SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

DeveloperZine(デベロッパージン)- エンジニアの意思決定を支える技術情報メディア ProductZine

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

Zusaar開発者に学ぶソーシャルアプリ入門

WebアプリにSNSアカウントでのログインを実装する

Zusaar開発者に学ぶソーシャルアプリ入門(1)

開発手順

 以下にアプリケーションの登録から、アクセストークンの取得、およびAPI呼び出しまでのサンプルを掲示します。記事に添付されているサンプルファイルをダウンロードして、併せて確認してください。

 また、今回紹介するサンプルをGoogle App Engine上でも動かしていますので、動作イメージについてはこちらを参考にしてください。

Twitterの場合

アプリケーション登録

 次のページからアプリケーション登録を行います。

 英語の画面ですが「Name」「Description」は日本語でも入力できます。「Name」は他のアプリと同じ名称は使えません。

 「WebSite」はURLが決まっていなければ仮でも構いません。決まってから修正しましょう。

 「Callback URL」は今回のようにWebアプリの場合は必須です。「WebSite」と同じ値を設定しましょう。

 登録が完了すると上記のような画面が表示されます。「Consumer Secret」はそのアプリだけの秘密鍵になるので絶対に他人に知られないようにしてください。

 パーミッションの設定は上図から行ってください。

サンプルコード

 TwitterのOAuthはバージョン1.0です。前述のように1.0は手順が複雑なため、ライブラリを利用するのが一般的です。ここではJavaのサンプルを示しますが、Javaでは山本裕介氏の「Twitter4J」が事実上の標準ライブラリとなっています。

TwitterへリダイレクトするServlet(/source/src/sample/twitter/LoginServlet.java)
package sample.twitter;

import java.io.IOException;
import java.util.Properties;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import twitter4j.Twitter;
import twitter4j.TwitterException;
import twitter4j.TwitterFactory;
import twitter4j.auth.RequestToken;

@SuppressWarnings("serial")
public class LoginServlet extends HttpServlet {

    protected void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

        StringBuffer callbackURL = request.getRequestURL();
        int index = callbackURL.lastIndexOf("/");
        callbackURL.replace(index, callbackURL.length(), "").append("/callback");

        // (注意)Twitter4Jは自動でpropertyファイルを読み込む機能がありますが、
        // このサンプルでは敢えて明示的にconsumerKey,consumerSecretを設定しています。
        Properties prop = new Properties();
        prop.load(this.getClass().getClassLoader().getResourceAsStream("twitter.properties"));
        final String consumerKey = prop.getProperty("consumerKey");
        final String consumerSecret = prop.getProperty("consumerSecret");

        Twitter twitter = new TwitterFactory().getInstance();
        twitter.setOAuthConsumer(consumerKey, consumerSecret);
        request.getSession().setAttribute("twitter", twitter);
        try {
            RequestToken requestToken = twitter.getOAuthRequestToken(callbackURL.toString());
            request.getSession().setAttribute("requestToken", requestToken);
            response.sendRedirect(requestToken.getAuthenticationURL());
        } catch (TwitterException e) {
            throw new RuntimeException(e);
        }
    }
}

 上記が「Twitterアカウントでログイン」で実行されるコードです。ユーザーはTwitterへリダイレクトされ以下の画面が表示されます。

 許可(ログイン)すると特殊なパラメータとともに以下のコードにリダイレクトされます。

TwitterからリダイレクトされるServlet(/source/src/sample/twitter/CallbackServlet.java)
package sample.twitter;

import twitter4j.Twitter;
import twitter4j.TwitterException;
import twitter4j.TwitterFactory;
import twitter4j.User;
import twitter4j.auth.AccessToken;
import twitter4j.auth.RequestToken;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;

import java.io.IOException;
import java.util.HashMap;
import java.util.Map;
import java.util.Properties;

@SuppressWarnings("serial")
public class CallbackServlet extends HttpServlet {

    protected void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

        /*
         * アクセストークンの取得
         */
        HttpSession session = request.getSession();
        Twitter twitter = (Twitter) session.getAttribute("twitter");
        RequestToken requestToken = (RequestToken) session.getAttribute("requestToken");
        final String verifier = request.getParameter("oauth_verifier");
        AccessToken accessToken = null;
        try {
            accessToken = twitter.getOAuthAccessToken(requestToken, verifier);
        } catch (TwitterException e) {
            throw new RuntimeException(e);
        }
        final String token = accessToken.getToken();
        final String tokenSecret = accessToken.getTokenSecret();
        final Long userId = accessToken.getUserId();
        request.getSession().removeAttribute("requestToken");

        /*
         * APIの実行
         */
        // (注意)ここでは上記のtwitter,accessTokenインスタンスでそのままAPIの実行ができますが、
        // サンプルのため敢えて別インスタンスtwitter2,accessToken2を生成しています。
        Properties prop = new Properties();
        prop.load(this.getClass().getClassLoader().getResourceAsStream("twitter.properties"));
        final String consumerKey = prop.getProperty("consumerKey");
        final String consumerSecret = prop.getProperty("consumerSecret");

        Twitter twitter2 = new TwitterFactory().getInstance();
        twitter2.setOAuthConsumer(consumerKey, consumerSecret);
        AccessToken accessToken2 = new AccessToken(token, tokenSecret);
        twitter2.setOAuthAccessToken(accessToken2);
        User me = null;
        try {
            me = twitter2.showUser(userId);
        } catch (TwitterException e) {
            throw new RuntimeException(e);
        }

        /*
         * ログイン処理
         */
        Map map = new HashMap();
        map.put("service", "Twitter");
        map.put("userId", String.valueOf(userId));
        map.put("name", me.getScreenName());
        map.put("token", accessToken.getToken());
        map.put("tokenSecret", accessToken.getTokenSecret());
        session.setAttribute("loginUser", map);

        response.sendRedirect(request.getContextPath() + "/");
    }
}

 ここでアクセストークンを取得します。リダイレクトする前にsessionに保存したRequestTokenを取り出して利用しているのがポイントです。

 AccessTokenオブジェクトから取得できるtokenおよびtokenSecretの2つがアクセストークンの実態です。

 API実行時にはアプリ共通のConsumer Key, Consumer Secret、そしてユーザーごとのアクセストークンをすべてセットして実行します。

次のページ
Facebookの場合

この記事は参考になりましたか?

この記事の著者

石井 賢司(イシイ ケンジ)

 会社員時代にGoogle App Engineに出会い傾倒、新規事業としてGAEを使った『決済できるソーシャルイベントプラットフォーム「Zusaar」』を立ち上げる。現在はフリーランスのエンジニアとして活動しつつ新たなサービスも模索中。Blog: http://d.hatena.ne.jp/knj77 ...

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この記事は参考になりましたか?

この記事をシェア

CodeZine(コードジン)
https://codezine.jp/article/detail/6572 2012/06/01 14:00

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー