DribbbleのAPIをいろいろ調べてる過程で Dribbble のAPIがOAuth2.0認証をする必要があったので調べるついでに実装してみました。
ライブラリもたくさんあったのですが、とりあえずやってみようの精神で実装してみました。
GitHub
先にソースコードの置き場を...。
OAuth2を突破するまでの過程
段取り的なのをまずは紹介します。
- DribbbleでApplication登録をする
- URLSchemeでcallbackURLを設定する
- 実際に認証画面を開く
- callbackから値を受け取ってpost
-
access_token
を取得する
という流れになります。
今回使うAPIが Dribbble なので Dribbble を例に話を進めていきますが、他のAPIでも大差がないと思います。
アクセス先が違うくらいかと。
なので(多分)QiitaのAPI(ver 2.0)でも通用するかと思います。
では、一つずつ説明していきます。
1. DribbbleでApplication登録をする
Dribbble DeveloperよりApplication登録をしてください。
Register an Application
ボタンを押せば登録画面へ進めると思います。
入力項目についてですが
- Name : アプリケーションの名前です。
- Description : アプリケーションの説明です。
- Website URL : アプリケーションのWebサイトのURLです。ない場合は自分のブログのURLとかで大丈夫かと。
- Callback URL : アプリに戻るためのURLです。iOSのURLSchemeに則って入力してください。
これを入力したらregister application
を押して完了です。
Client ID
とClient Secret
をメモしておいてください。
2. URLSchemeでcallbackURLを設定する
これをしないとwebでの認証後、アプリに戻ってこれず終了します。
これはスクリーンショットで説明したいと思います。
Dribbbleでの設定事項
ここのCallback URLをXcodeでURLSchemeとして設定します。
XCodeでの設定
これでWebでの認証後、値が返ってくるようになります。
3. 実際に認証画面を開く
では実際にソースコードを交えて説明していきます。
画面はこんな感じです。
ボタンを押したらsafariを使って認証画面を表示します。
以下のようなURLを作成してUIApplication.sharedApplication().openURL(_:)
を叩きます。
let authorizeURL = "https://dribbble.com/oauth/authorize?client_id=\({Client ID})&redirect_uri=\({Callback URL})&scope=public&state=DRIBBBLE"
if let authURL = NSURL(string: authorizeURL) {
UIApplication.shreadApplication().openURL(authURL)
}
APIの仕様は以下を参照してください。
http://developer.dribbble.com/v1/oauth/#web-application-flow
safariでログイン画面 or 認証画面が出てきたら、認証してください。
うまくいけばアプリに戻ってこれると思います。
もし戻ってこれなかった場合
redirect_uriの指定がまちがっていると思いますので、 DribbbleのApplication情報とURLSchemeを見比べてみてください。
4. callbackから値を受け取ってpost
http://developer.dribbble.com/v1/oauth/#web-application-flow
のページの 2. Dribbble redirects back to your site.を確認するとcode
とstate
の値がついているcallbackURLを叩いてくれるとのことなので、それを受けとってaccess_token
を取得したいと思います。
受け取り方
AppDelegate.swift
に以下のメソッドを追加してください。
func application(application: UIApplication, openURL url: NSURL, sourceApplication: String?, annotation: AnyObject?) -> Bool {
return true
}
このメソッドのopenURL
の値がcallbackで返ってきた値となります。
以下のように返ってくるかと思います。
oauth-dribbble://oauth/callback?code=xxxxxxxx&state=DRIBBBLE
以上のURLのqueryからcode
を引き抜いて、client_id
とclient_secret
、redirect_uri
をpostでhttps://dribbble.com/oauth/token
にrequestします。
5. access_token
を取得する
requestが成功すると
{
"access_token" : "29ed478ab86c07f1c069b1af76088f7431396b7c4a2523d06911345da82224a0",
"token_type" : "bearer",
"scope" : "public write"
}
(上記のレスポンスはサンプルなので仕様しても全く意味ないかと思います)
というようなresponseが返ってくるので、それを取得して保存しておく形になります。
作ったクラス
上記の処理をラッピングしたクラスを作成しました。
結構適当ではありますが、参考になればと。
ソースコードが長いので、リンクで勘弁してください...。
終わりに
僕自身OAuth2.0に詳しいわけでもないですが、他のAPIを仕様するときに触っておいたほうがいいかなと思ってやってみました。
なにか不具合ありましたら、ご連絡ください。