Laravel + Nuxt.js + Firebase でいい感じにTwitterによるソーシャルログインを実現する

社会人になって1ヶ月が経過しました。 GWが長すぎて五月病になりそうで怖いですので、ダラダラしすぎないように個人開発をして過ごすことにしました。

作ろうとしているWebアプリにTwitterによるソーシャルログイン機能を追加したいと思い、先人の知恵をフル活用しながらスマートな構成を考え、実装してみました。

python-twitter で BASE64 形式の画像をツイートする

  1. クライアントサイドで Canvas API - Web API | MDN 等を使って画像を処理する
  2. canvas.toDataURL()で BASE64 形式の画像データを取得
  3. このデータをサーバー側にPOSTして、サーバーで Twitter API を叩いて画像を添付したツイートをする

というようなシステムを作ろうとして、3の画像添付ツイートを行う部分で少し詰まったので、解決方法をまとめておきます。 なお、 Twitter の API key などを取得する部分は割愛させていただきます。