添加适用于JavaScript的Login with Amazon SDK

添加适用于JavaScript的Login with Amazon SDK

您可以使用Login with Amazon提供的JavaScript SDK来获取访问令牌和检索客户个人资料。适用于JavaScript的Login with Amazon SDK将处理在集成Login with Amazon与您的网站时遇到的所有难题。SDK必须先从亚马逊内容交付网络自行加载,在这之后您才能作出访问授权调用或者检索个人资料。

适用于JavaScript的Login with Amazon SDK必须使用此页面中的amazon-root元素。amazon-root元素不得使用display: none或者visibility: hidden进行隐藏,否则SDK的部分功能将无法在Internet Explorer中正常运行。

SDK在amazon-root中插入的元素将位于页面主体或顶部元素的相近位置。最好不要将amazon-root元素放在包含position: absoluteposition: relative设置的元素内。如果必须将amazon-root元素放置在已定位的元素之内,其位置应靠近主体顶部,否则SDK可能无法正常运行。

  1. 在您的页面中,将以下代码添加到打开的<body>之后,以加载适用于JavaScript的Login with Amazon SDK,并将amazon-root标签添加到您的页面:

    <div id="amazon-root"></div>
     <script type="text/javascript">
    
        window.onAmazonLoginReady = function() {
          amazon.Login.setClientId('YOUR-CLIENT-ID');
        };
        (function(d) {
          var a = d.createElement('script'); a.type = 'text/javascript';
          a.async = true; a.id = 'amazon-login-sdk';
          a.src = 'https://assets.loginwithamazon.com/sdk/na/login1.js';
          d.getElementById('amazon-root').appendChild(a);
        })(document);
    
    </script>
    
  2. SDK加载完成后,将调用window.onAmazonLoginReady来进行初始化。在使用SDK之前,您必须调用amazon.Login.setClientId来传递客户端标识符。

  3. YOUR-CLIENT-ID替换为你在注册应用时生成的客户端ID。

  4. 将以下JavaScript添加到网站的Login with Amazon按钮之后,用以返回AuthorizeRequest对象。请求完成后,该对象将包含具体说明响应情况的属性详情(如访问令牌或授权码,您可以用来获取客户个人资料):

    <script type="text/javascript">
        document.getElementById('LoginWithAmazon').onclick = function() {
            options = {}
            options.scope = 'profile';
            options.scope_data = {
                'profile' : {'essential': false}
            };
            amazon.Login.authorize(options,
                'https://www.example.com/handle_login.php');
            return false;
        };
    </script>
    
  5. www.example.com替换为您的网站域名。

    用户登录并同意共享特定数据后,当前窗口将重定向到既定URI,授权响应将添加到查询字符串。URI必须使用HTTPS协议,且与当前窗口位于同一域。

如需了解有关上述方法的更多信息,请参阅适用于JavaScript的Login with Amazon SDK参考