0

RFC 2617は、 HTTP Basic および Digest Auth標準を指定し、ウィキペディアの「説明付きの例」サブセクションに要約されているように機能します。

  • クライアントは、認証が必要なページを要求しますが、ユーザー名とパスワードを提供しません。通常、これは、ユーザーが単にアドレスを入力したか、ページへのリンクをたどったためです。
  • サーバーは 401 "client-error" 応答コードで応答し、認証レルムと、ノンスと呼ばれるランダムに生成された使い捨ての値を提供します。
  • この時点で、ブラウザーは認証領域 (通常、アクセスされているコンピューターまたはシステムの説明) をユーザーに提示し、ユーザー名とパスワードの入力を求めます。ユーザーは、この時点でキャンセルすることを決定できます。
  • ユーザー名とパスワードが提供されると、クライアントは同じ要求を再送信しますが、応答コードを含む認証ヘッダーを追加します。
  • この例では、サーバーが認証を受け入れ、ページが返されます。ユーザー名が無効であるか、パスワードが正しくない場合、サーバーは "401" 応答コードを返す可能性があり、クライアントはユーザーに再度プロンプトを表示します。

注: クライアントは、必要なユーザー名とパスワードを既に持っている場合があります。ユーザーにプロンプ​​トを表示する必要はありません (以前に Web ブラウザーによって保存されている場合など)。

Facebookによって実装されているOAuth2 ドラフト標準を使用してログインを実行しています。

公開された公開 API (JSONRPC や REST など) を備えたサーバーがある場合、前述の RFC 2617 の例のような種類の機能を含めるように、クライアント側の JavaScript フロントエンドをどのように作成できますか?

4

1 に答える 1

1

クライアント側の JavaScript ライブラリの実装例の公式の (ただしメンテナンスされておらず、現在は正式に放棄されている) リポジトリを見つけました。最新の fork については、ここをクリックしてください。そのページの JQuery の例を次に示します。

<head>
      <meta http-equiv="content-type" content="text/html; charset=utf-8">
      <title>Connect JavaScript - jQuery Login Example</title>
  </head>
  <body>
      <h1>Connect JavaScript - jQuery Login Example</h1>
      <div>
          <button id="login">Login</button>
          <button id="logout">Logout</button>
          <button id="disconnect">Disconnect</button>
      </div>
      <div id="user-info" style="display: none;"></div>
      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js">
    </script>
  <div id="fb-root"></div>
  <script src="http://connect.facebook.net/en_US/all.js"></script>
  <script>
      // initialize the library with the API key
      FB.init({
          apiKey: '48f06bc570aaf9ed454699ec4fe416df'
      });


      // fetch the status on load
      FB.getLoginStatus(handleSessionResponse);

      $('#login').bind('click', function () {
          FB.login(handleSessionResponse);
      });


      $('#logout').bind('click', function () {
          FB.logout(handleSessionResponse);
      });

      $('#disconnect').bind('click', function () {
          FB.api({
              method: 'Auth.revokeAuthorization'
          }, function (response) {
              clearDisplay();
          });
      });

      // no user, clear display
      function clearDisplay() {
          $('#user-info').hide('fast');
      }

      // handle a session response from any of the auth related calls
      function handleSessionResponse(response) {
          // if we dont have a session, just hide the user info
          if (!response.session) {
              clearDisplay();
              return;
          }

          // if we have a session, query for the user's profile picture and name
          FB.api({
              method: 'fql.query',
              query: 'SELECT name, pic FROM profile WHERE id=' + FB.getSession().uid
          },

          function (response) {
              var user = response[0];
              $('#user-info').html('<img src="' + user.pic + '">' + user.name).show('fast');
          });
      }
  </script>

遠慮なく改善を提案してください。最適に私は見たい：

  • バニラ JavaScript 実装
  • 個人サーバー側でのログインを容易にするための JSONRPC 呼び出し
  • ルーティング (つまり、ログインに成功すると、サインインしているユーザーのホームページにリダイレクトされます)
于 2012-07-13T15:52:48.140 に答える