5

我将我的网站设置为使用google+signin

对于登录,谷歌提供了一个或多或少不错的翻译按钮来登录。

编码

<span id="signinButton">
  <span
    class="g-signin"
    data-callback="signinCallback"
    data-clientid="CLIENT_ID"
    data-cookiepolicy="single_host_origin"
    data-requestvisibleactions="http://schemas.google.com/AddActivity"
    data-scope="https://www.googleapis.com/auth/plus.login">
  </span>
</span>

扩展为:

在此处输入图像描述

要遵守 google 的开发者政策,该应用程序必须提供一种方法来删除您的应用程序与帐户之间的关联。(来自:谷歌帐户注销和重定向

实现很简单,但据我了解,谷歌没有提供(样式/设计)断开按钮。还是我错过了?它应该看起来像登录按钮。

4

2 回答 2

4

要遵守这些政策,您必须为您的用户提供一种方法来撤销您的应用程序对其信息和帐户的访问权限。这与注销不同。

了解如何提供断开连接和撤销访问

用户断开连接后,您将执行条款要求的清理步骤。

这是一个使用文档中的 jQuery 的示例。它假定您将访问令牌存储在全局变量中access_token

<script type="text/javascript">
function disconnectUser(access_token) {
  var revokeUrl = 'https://accounts.google.com/o/oauth2/revoke?token=' +
      access_token;

  // Perform an asynchronous GET request.
  $.ajax({
    type: 'GET',
    url: revokeUrl,
    async: false,
    contentType: "application/json",
    dataType: 'jsonp',
    success: function(nullResponse) {
      // Do something now that user is disconnected

      // Start account clean up
    },
    error: function(e) {
      // Handle the error
      // console.log(e);
      // You could point users to manually disconnect if unsuccessful
      // https://plus.google.com/apps
    }
  });
}
// Could trigger the disconnect on a button click
$('#revokeButton').click(disconnectUser);
</script>
<button id="revokeButton">Disconnect</button>

编辑:

如果您需要资源来帮助自定义断开连接按钮的外观以匹配登录按钮的外观,您可以使用Google+ 平台品牌指南页面上提供的资源。在该页面上,您可以下载 PhotoShop 源文件,您可以使用这些源文件为您的站点创建断开连接按钮。您需要按照该页面上的说明遵守品牌指南。

站点如何选择提供断开连接选项取决于设计者。一个站点可能更喜欢断开链接,而另一个站点可能更喜欢使用按钮,设计取决于您。

于 2013-02-27T17:49:16.183 回答
1

仅供参考,即使他们的规则确实规定您必须为用户提供一种撤销访问权限的方法,但这并不强制您让用户轻松地这样做。大多数网站倾向于将断开连接的功能隐藏在某处的用户设置菜单中,将其保留为文本链接。您真的不希望用户如此轻松地断开连接并永远离开。

如果您仍然想拥有该按钮,请在此处查看 CSS 解决方案 https://developers.google.com/+/web/signin/#customizing_the_sign-in_button

根据需要进行定制。祝你好运!

于 2013-04-02T07:42:22.153 回答