LoginSignup
7
8

More than 3 years have passed since last update.

Javascriptで画像付きツイートを行う

Posted at

経緯

山手線 Ver.2020 by 東京感動線でWebARから画像付きツイートをすることになり、色々と悪戦苦闘して、動くものができたので残しておきます。ニーズが無いのか、ググってもビンゴの記事がないのですよね。

コード

プラットフォームとして、Oauth.ioを使っています。
ポイントをコメントで残しました。

/* detail : base64エンコード済みの画像データ */
/* tweet_text : ツイート内容 */
function twitter_tweet(detail, tweet_text) {
    var oauth_result;
    OAuth.initialize("***public key***"); /* 各自PUBLIC KEYを設定 */
    OAuth.popup('twitter').then(function(result) {
        oauth_result = result;
    }).fail(function(err){
        /* エラー処理 */;
    });

    /* multipartにするための区切り */
    var bound_text = "------------------------1ae47d990b354d1b00a4eea60e6b5b72";

    var image_src =
        "--" + bound_text + "\r\n" +
        'Content-Disposition: form-data; name="media_data"' + "\r\n" +
        "\r\n" +
        detail + "\r\n" +
        "--" + bound_text + "--\r\n\r\n";

    /* この書き方でOauth署名は正しく作成される模様 */
    var param1 = {
        headers: {
            'Content-Type' : 'multipart/form-data; boundary=' + bound_text
        },
        data: image_src
    };

    /* 画像のアップロード */
    oauth_result.post('https://upload.twitter.com/1.1/media/upload.json', param1).done(function (response) {
        /* 画像のアップロードに成功したら、ツイートと紐づけるために */
        /* 画像データのIDを取得する */
        var media_id_ = response.media_id_string;

        var param2 = {
            data: {
                status: tweet_text,
                media_ids: media_id_
            }
        };

        /* ツイート */
        oauth_result.post('/1.1/statuses/update.json', param2).done(function (response) {
            /* ツイート成功時の処理 */;
        }).fail(function (err) {
            /* ツイート失敗時のエラー処理 */;
        });
    }).fail(function(err) {
        /* 画像アップロード失敗時のエラー処理 */;
    });
}

参考

最後に

あまり親切な文書になってないと思うので、気が向いたら更新します。
ここをもっと書いて欲しいとうのご要望いただけるとありがたいです。

7
8
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
7
8