Laravel4でTwitterログイン認証を作成する

カテゴリ:Web制作タグ:,

これは Laravel Advent Calendar 19日目の記事です。

昨日はkam01@github さんのlaravelでmodule laravel-modulesでした。
本日はyukke0310ことUKが担当させていただきます。
どうぞよろしくお願いします。

Twitterで認証するログインシステムも今ではそんな珍しいものではなくなりました。
今回はそんな認証をLaravel4でも使いたいという方の為に便利なパッケージの紹介とユーザー登録までのロジックを説明します。
使用するパッケージはLaravel-Twitterです。

この記事の内容

  1. Twitterでアプリケーションを作成する
  2. composer.jsonを編集する
  3. 設定ファイルを編集する
  4. DBへusersテーブル作成する
  5. コントローラを作成する
  6. モデルを作成する
  7. ビューを作成する
  8. ルーティングを編集する
  9. 動作確認・最後に

Twitterでアプリケーションを作成する

それでは始めていきましょう!
まずはTwitterでアプリケーションの登録をします。
twitter-login-for-laravel-4_01
1.Twitter Developersにアクセスし、右上の「Sign in」をクリックします。

twitter-login-for-laravel-4_02
2.「Username」と「Password」を入力して「Log in」ボタンをクリックします。

twitter-login-for-laravel-4_03
3.右上のアイコンにマウスカーソルを重ねると出るメニューから「My applications」をクリックします。

twitter-login-for-laravel-4_04
4.アプリケーションの一覧ページに移動するので、右側にある「Create a new application」ボタンをクリックします。

twitter-login-for-laravel-4_05
5.画像を参考に項目を埋めていただき最後に「Create your Twitter application」ボタンをクリックします。
※Callback URLは後に自由に指定出来ますが、入力しないとPINコード入力での認証になってしまうので注意です。

twitter-login-for-laravel-4_06
6.アプリケーションの作成が終わると上記のような画面に移動すると思うので、「Consumer key」、「Consumer secret」の値をメモします。
※今回はログイン認証のみなので、権限の変更などはしませんが、自動つぶやきなどしたい場合は別途設定を変更してあげて下さい。
以上でTwitterでの作業は終わりです。

composer.jsonを編集する

次はcomposer.jsonを編集します。
Laravel4のルートディレクトリにある「composer.json」を開きrequireに「”philo/laravel-twitter”: “dev-master”」を追加します。
例:

編集が終わったら保存し、SSHクライアント等でサーバーにログインしLaravel4のルートディレクトリで

コマンドを実行してパッケージのダウンロードを行います。
完了したら次に

を実行して設定ファイルを作成します。
以上でcomposer関連の設定は終わりです。

設定ファイルを編集する

次は設定ファイルの編集です。
まず、「app/config/packages/philo/twitter」ディレクトリにある「config.php」を開き先ほどメモした「Consumer key」、「Consumer secret」を入力します。

次に「app/config」ディレクトリにある「app.php」を開き「providers」に「’Philo\Twitter\TwitterServiceProvider’,」を、「aliases」に「’Twitter’ => ‘Philo\Twitter\Facades\Twitter’,」を追加します。
例:

設定ファイルの編集は以上で終わりです。

DBへusersテーブル作成する

次にユーザーテーブルがないと始まりませんので作成します。
まず、SSHクライアントなどでLarave4のルートディレクトリに移動して

コマンドを実行し、マイグレーションファイルを作成します。
次に「app/database/migrations」ディレクトリに作成されたファイルの中身を下記のように書き換えて下さい。

編集が終わったらコマンド画面に戻り

コマンドを実行してテーブルを作成しましょう。
以上でDBへusersテーブルを作成する作業は終わりです。

コントローラを作成する

次はコントローラの作成です。
「app/controllers」ディレクトリに「UserController.php」を作成し、中身を下記のように編集します。

Sigin in with Twitterを使う場合はコード内容を参考に一部変更して下さい。今回は使用してないので特にいじらなくてもOKです。
また、プロフィール画像も最大500×500のサイズのものが欲しい場合はコード内容を参考に一部変更して下さい。今回は73×73のサイズで取得しています。

モデルを作成する

次はモデルの作成です。
「app/models」ディレクトリにある「User.php」を開き下記の内容へ変更します。

パスワードの再発行は今回は使わないため削りました。別途使う方は適宜合わせて編集して下さい。

ビューを作成する

まずTwitterへのログイン説明ページを作成します。
「app/views」ディレクトリに「login.blade.php」を作成し、下記の内容に編集して下さい。

次にコールバック後のページを作成します。
同じく「app/views」ディレクトリに「mypage.blade.php」を作成し、下記の内容に編集して下さい。

ルーティングを編集する

「app」ディレクトリにある「routes.php」に下記のルーティングを追加して下さい。

ルーティングの編集は以上です。

動作確認・最後に

ここまで作成が終わったら、動作確認をしましょう。
twitter-login-for-laravel-4_07
1.http://example.com/loginへアクセスし、「Twitterの認証ページへ」リンクをクリックします。
※ドメイン部分はご自身の環境に合わせて読み替えて下さい。
twitter-login-for-laravel-4_08
2.Twitterのページへ移動するので、ログインしていない場合はユーザー名とパスワードを入力し、「連携アプリを認証」をクリックする。

twitter-login-for-laravel-4_09
3.上記のようにマイページがちゃんと表示されていれば成功!

お疲れ様でした!如何でしたでしょうか?
明日20日のLaravel Advent Calenderは、ytake さんで
laravel4を使ったアプリケーション配布時の工夫(仮)」についてです。
お楽しみにー(*´∀`*)

あとでよむ / みんなにシェアする

このエントリーをはてなブックマークに追加
LINEで送る

コメントをする / みる

コメントを残す

コメントはまだありません。

検索する

カテゴリ一覧

タグ一覧

お知らせ アクセス解析 アプリケーション ゲーム サーバー スニペット プラグイン 動画 日記 Laravelパッケージ Laravel3 Laravel4 Tips Webサービス Webデザイン WordPress

最近投稿された記事

つぶやき

【GIGAZINE読者限定早い者勝ち】無料でDropbox・Googleドライブなどのクラウドを自由自在に同期・一括管理できる「まとめてクラウド」が先着5万人48時間だけゲット可能 - GIGAZINE gigazine.net/news/20151010-…

約2年前

離れていてもコミュニケーションが取りやすい便利なサービス「Remotty」 #remotty remotty.net

約2年前

RT @localdisk: メジャーどころがたくさん / 【セキュリティ ニュース】「WPTouch」など多数のWordPressプラグインに脆弱性(1ページ目 / 全1ページ):Security NEXT security-next.com/057930

約2年前

Javascript フレームワーク「Aurelia」aurelia.io

約2年前

dockerで起動済みのコンテナに対して何かしたい時は、docker exec -it コンテナ名 /bin/bashで入って実行したり、docker exec -it コンテナ名 supervisorctl restart nginxみたいな事も出来て便利。

約2年前

サーバー移転完了に伴いサイトの閲覧も可能な状態になりました。移転作業中にご訪問いただいた方には大変ご迷惑をおかけいたしました。今後このようなことがないよう気をつけて参ります。

約2年前

現在当サイトが閲覧出来ない状態となっております。こちらはサーバーの移転作業に遅れが生じているためとなっております。ご利用いただいている方にはご迷惑をおかけいたします。

約2年前

WordPress4.1.1(日本語版)が利用出来るようになりました wp.me/p4RkJY-Dj

約3年前

RT @keito_jp: Twitterをサマーウォーズ的に表示させるやつを製作中。遊んでみてね。 open.moo.jp http://t.co/gIgp5Gh6qW

約3年前

任天堂、YouTubeの広告収入を動画制作者とシェアする「Creators Program」サービス開始 | Game*Spark - 国内・海外ゲーム情報サイト s.gamespark.jp/article/2015/0…

約3年前

↑上へ戻る