Yahoo!IncのOAuthがUI改善を実施

この件について解説します。
http://developer.yahoo.net/blog/archives/2009/06/oauth_update_ux.html

■ 背景

Yahoo!はOAuth,OpenID,BBAuthについて、ID/PW認証、認可を行う際に外部サイトにYahoo!への「リダイレクト」を要求するUIを利用してきました。
多くの開発者はそのUXが"disruptive"だとわかっていました。

■ 何が"disruptive"なのか?

ユーザーの画面遷移は次のようになります。

0. 【外部サイト】未ログインページ
1. 【Yahoo! JAPAN】ログインページ
2. 【Yahoo! JAPAN利用規約同意画面など
3. 【外部サイト】ログイン済みページ

私たちのような開発にかかわるものにとっては当たり前のフローなのかもしれませんが、0から1に遷移するとき、ユーザーに対して「なぜYahoo! ID/PWを入力する必要があるの?」という疑問を持つかもしれません。
また、そもそも0,1,2,3というフローの説明も十分にできていないのかもしれません。

■ 懸念点

今回の場合、「フィッシングによるID/PW不正取得」がリスクになります。
このリスクを回避するためには、Yahoo!であることを確かめた上でYahoo! ID/PWを入力させる習慣をつけさせるしかありません。
Yahoo!Sign-in Seal(Y!Jでいうとログインシール)の機能を提供し、スクレイピングなどの方法ではなくOAuth/OpenID/BBAuthというYahoo!上でユーザー認証を行う方法を勧めています。

■ 今回何をした?

Yahoo!は、小さなポップアップウィンドウの中での表示を可能にするためのUI改善を行いました。
今までID/PW入力だけを目的としていた画面には以下の項目が含まれています。

  • アドレスかくにんのためのURLバー
  • 何が行われるかの説明
  • OAuthのSP名とConsumer名
  • Consumerに渡す情報(What am I sharing?をクリックすると出てきます)
  • Sign-In Seal
  • ID/PW入力フォーム
  • 「Login」,「cancel」ボタン(リンク)
  • PW忘れユーザーのためのAccount Recovery機能へのリンク
  • 利用規約など

これらの項目が必要なのかについては、OpenID Wiki / Details-of-UX-Best-Practices-for-OPsを参照してください。
よくまぁ詰め込んだという感じがします。
とてもじゃないけど日本語で同じ内容を詰め込むのは不可能に近いのではないでしょうか。。。




ここでログインをすると、MySpaceの時にはConsumerに戻っていましたがYahoo!の場合は今何が行われたかを説明する画面に遷移します。
そしてなぜかOAuthの認可を行ったユーザーに対してメール送信も行うようです。
まるでhttp://login.yahoo.co.jp/guide/jp/yid/login_alert/index.htmlのようですね。

■ この画面はどうやって使うのか?

OpenIDの場合、OpenID UI Extensionという拡張を利用するとこのような画面を出すパターンが考えられます。
しかし、Yahoo!は今回、全てのOAuthフローをこのUIに変更しました。

Using the new Popup OAuth UI is optional, sites currently using the old redirect UI don't have to change anything to benefit from having the more contextual Yahoo! Login screen, although the screen might look a little sparse in a full browser window.

http://developer.yahoo.net/blog/archives/2009/06/oauth_update_ux.html

ということで、いつものここでも画面が確認できます。
http://r-weblife.sakura.ne.jp/oauthviewer/
MySpaceも常に小さな画面を出しているので、似ています。

■ 他に言いたいこと

  • SDK用意しています Social SDKs - Yahoo! Social APIs
  • 画面サイズは600×435ピクセルでサイズを可変にするといいことあるそうです
  • フィッシングと間違わないようにアドレスバー出してください
  • ドキュメント見てください
  • OpenIDもそのうち対応するそうです

■ OAuth Core 1.0a

前にも言っていますが、Yahoo!のOAuthはOAuth Core 1.0aに対応しています。
開発者の皆様は対応をお願いしますと言いたいのでしょう。
http://oauth.googlecode.com/svn/spec/core/1.0a/drafts/3/oauth-core-1_0a.html;title

■ 思ったこと

  • ID/PW認証の時にユーザーに対して何が行われるのかを説明するのはいいこと
  • 日本語だとスペースとかきつそう。利用規約もリンクじゃ許されないかも
  • Yahoo! JAPANもOAuth対応したら(けっこう待ってるけどいったいいつ対応するのか?)の画面はこれを使うのか?

今日はこれぐらいにします。
お疲れ様でした。

Keep on hacking!