Yahoo! ID連携

JavaScript SDK

JavaScript SDKとは

Implicitフローで利用する場合

  • 属性情報の取得とフォームへの自動入力が簡単に行えます。

  • リダイレクトできません。redirectUriには自ページのURLを設定してください。

Authorization Codeフローで利用する場合

  • 認可コードを取得し、Access TokenやID Tokenを発行できます。

  • 属性取得API(UserInfoAPI)にアクセスして属性情報を取得できます。

  • 任意のURLにリダイレクトできます。

  • responseType,state,nonceの指定が必須です。

サンプル

ボタンを押すと別ウィンドウが起動してログイン画面、同意画面が表示されます。

フロー

ログインが完了すると、下記のフォームにそれぞれの属性情報が自動入力されます。

実装方法

ログインボタン生成

ボタンの種類
ボタン
テキストリンク
ボタンのテキスト
サイズ
プレビュー
ログイン
Client IDを登録するで登録したClient IDを指定してください
アプリケーションの管理から設定したコールバックURLを指定してください
scope
メールアドレスや氏名など属性情報の取得に必要なパラメーターです。
属性取得API(UserInfoAPI)を参考に、必要に応じて指定してください
フロー

以下に生成されたスクリプトをHTML内に設置してください。

上記の項目を選択・入力すると、ここに実装用のコードが表示されます。

属性一覧

パラメーター 概要 入力値(サンプル)
name姓名矢風太郎
givenName太郎
givenNameKanaカナ名タロウ
givenNameKanji漢字名太郎
familyName矢風
familyNameKanaカナ姓ヤフウ
familyNameKanji漢字姓矢風
gender性別
male / femaleのどちらかを返却
male
zoneInfoAsia/Tokyo固定Asia/Tokyo
localeja-JP固定ja-JP
birthDate生年(月日は含まない)1986
nickname名前やふうたろう
pictureアイコン画像URLhttps://dummy.img.yahoo.co.jp/example.png
emailメールアドレスyconnect@example.com
emailVerifiedメールアドレス確認済みステータスtrue
country国コードJP
postalCode郵便番号1028282
region都道府県東京都
locality市区町村千代田区
address都道府県+市区町村東京都千代田区

Yahoo!知恵袋で調べる