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 |
zoneInfo | Asia/Tokyo固定 | Asia/Tokyo |
locale | ja-JP固定 | ja-JP |
birthDate | 生年(月日は含まない) | 1986 |
nickname | 名前 | やふうたろう |
picture | アイコン画像URL | https://dummy.img.yahoo.co.jp/example.png |
メールアドレス | yconnect@example.com | |
emailVerified | メールアドレス確認済みステータス | true |
country | 国コード | JP |
postalCode | 郵便番号 | 1028282 |
region | 都道府県 | 東京都 |
locality | 市区町村 | 千代田区 |
address | 都道府県+市区町村 | 東京都千代田区 |
Yahoo! ID連携 v2
- Yahoo! ID連携とは
- ガイドラインを確認する
- Yahoo! JAPAN IDを取得する
- Client IDを登録する
- 各種フロー
- ネイティブアプリを開発
- 属性取得API(UserInfoAPI)
- ID Token
- JavaScript SDK
- PHP SDK
- Java SDK
- デザインガイドライン
- APIアクセス実装方法
- Yahoo! ID連携用語集
- FAQ