ionic(cordova) iOSでのtwitterログインで403 Forbidden の対応

ionic cordova ハイブリッドアプリ
はじめに

アプリのコードいじってないのにアプリで実装していたTwitterログインができなくなった。

使っていたプラグインはこちら
https://github.com/ManifestWebDesign/twitter-connect-plugin

エラー内容

error: Request failed: forbidden (403)
Error Domain=TWTRNetworkingErrorDomain Code=-1011 "Request failed: forbidden (403)" UserInfo={NSErrorFailingURLKey=https://api.twitter.com/oauth/request_token, NSLocalizedDescription=Request failed: forbidden (403), NSLocalizedFailureReason=Twitter API error :
<?xml version="1.0" encoding="UTF-8"?><errors><error code="415">Callback URL not approved for this client application. Approved callback URLs can be adjusted in your application settings</error></errors> (code (null))}
原因

https://apps.twitter.com/
こちらの画面から設定する「Callback URLs」が今までアプリから使用する際は適当な値(http://example.com とか)をセットしていた。が、これにちゃんとした値をセットしないとダメになったというのが原因だった。じゃあアプリから呼び出す際には何をセットすればいいのか？というのでハマった。

対応

https://another.rocomotion.jp/15293882415732.html
こちらのページに救われた。以下をそれぞれ設定する必要がある

Callback URLs (Twitterアプリの設定画面)

twitterkit-xxxxxxx:// (xxxxxxxはtwitterアプリのConsumerKey)

info.plistに以下を追加(Xcode)

<key>CFBundleURLTypes</key>
<array>
  <dict>
    <key>CFBundleURLSchemes</key>
    <array>
      <string>twitterkit-xxxxxxx</string>
    </array>
  </dict>
</array>
・・・
<key>LSApplicationQueriesSchemes</key>
<array>
  <string>twitter</string>
  <string>twitterauth</string>
</array>

swiftとかで開発していたらこれでOKだけれどもCordovaの場合、プラグイン自体がそのまま使えなかったのでプラグイン自体対応が必要だった。まず、上記のURLから取得したTwitterKitのSDKが古いぽくて動かなかった。Forkしてるリポジトリを探しているとちゃんとSDKも更新してくれてる人がいたのでそれを更にForkしてちょこっといじって解決。上記で書いたinfo.plistへの追記もプラグインが勝手にやってくれる。

そのまま使えるプラグインがこちら
GitHub - nrikiji/twitter-connect-plugin: Cordova/PhoneGap plugin to use Twitter Single Sign on

インストール

$ ionic plugin add https://github.com/nrikiji/twitter-connect-plugin --variable FABRIC_KEY=<Fabric API Key> --variable TWITTER_KEY=<Twitter Consumer Key> --variable TWITTER_SECRET=<Twitter Consumer Secret>

loginとlogoutしか実装されてないので画像の取得とかは必要なら実装しないとならない。以上です