谷歌OAuth登录是社会化登录方式的其中一种,相比之下在大陆地区使用更多的是QQ、微博和微信登录。
不过QQ微博微信登录都需要各类开发者认证以及大量的认证资料,博主在认证过程也是十分厌烦。其中微博开发这认证提示身份已经被其他帐号使用,无法继续操作。以前的开发帐号我也早忘了。
源码库下面说下WordPress使用谷歌验证登录帐号的过程。
1. 安装插件Google Apps Login
WordPress后台市场有很多类似功能的插件,谷歌官方并没有发布任何关于谷歌登录的插件。目前都是第三方调用谷歌API来完成的功能。
Google Apps Login 插件免费版即可,功能完全够使用。
Google Apps Login 插件免费版即可,功能完全够使用。
2. 设置谷歌官方API凭据和OAuth 同意屏幕
网址:https://console.cloud.google.com/apis/credentials/consent
在这个页面我们创建登录凭据和OAuth 同意屏幕,“OAuth 同意屏幕”是访客使用谷歌登录时显示给访客的信息。
2.1 创建OAuth 同意屏幕
我这里因为之前创建过了,这里没法演示创建过程了,这里说下其中需要的信息。
另外OAuth 同意屏幕审核是需要时间的!
同时你需要准备以下信息:
- 应用名称
- 用户支持电子邮件
- 应用徽标(可选)
- 应用网域(可选)
- 已获授权的网域
- 开发者联系信息
一些信息会显示给访客,在以下页面。
2.2 创建登录凭据(OAuth 客户端 ID )
创建 OAuth 客户端 ID
创建这个 OAuth 客户端 ID 就是配置我们网站的一些接入参数了。
2.选择后会显示要求填入的信息
应用名称、已获授权的 JavaScript 来源和已获授权的重定向 URI
名称随便填,已获授权的 JavaScript 来源填写网站域名即可。已获授权的重定向 URI 这里麻烦些,我们先跟上面一样填入网站域名。然后点击创建,后面会显示出来应用ID和密钥。我们需要使用这个,不要关闭这个弹窗。
3. 在Google Apps Login插件填入Client ID和Client Secret
将上面创建凭据后显示的客户端ID和密钥信息填入插件保存即可。
4. 修改重定向 URI
然后换个浏览器或者是按浏览器的Ctrl+Shift+N进入隐私模式。打开我们WordPress的注册页面。
点击谷歌登录的按钮,会进入授权页面,然后会提示错误
错误 400: redirect_uri_mismatch
您无法登录此应用,因为它不符合 Google 的 OAuth 2.0 政策的规定。
如果您是此应用的开发者,请在 Google Cloud Console 中注册重定向 URI。
我们点开请求详情,会看到一个redirect_uri地址。把这个地址复制下来,填入到上面我们留的坑“已获授权的重定向 URI”里面。
填入重定向URL然后保存即可。
有人会问为什么前面步骤不直接填入https://域名/wp-login.php这个地址?
因为有些主题继承的谷歌登录,他的重定向地址并不是/wp-login.php,比如justnews重定向的地址就是social-login?type=google&action=callback
到这里我们的谷歌登录就已经配置完成了。有什么疑问可以在下方留言。
常见问题
1.上面步骤创建的 OAuth 同意屏幕 和 凭据(OAuth 客户端 ID )是什么关系?
答: OAuth 同意屏幕 是你谷歌API登录中,全局的身份信息。你所有的网站调用谷歌API登录,都会显示 OAuth 同意屏幕 里面填入的信息。
凭据(OAuth 客户端 ID )可以简单理解为,给不同网站创建的不同管理信息。在访客那里是接触不到凭据(OAuth 客户端 ID )里面的信息的。
2. 使用谷歌登录会不会影响网站的加载(谷歌在大陆是无法访问的)?
使用谷歌登录不影响大陆用户的访问、注册等页面加载。谷歌登录请求的相关资源只会在授权页面加载。注册页面的登录按钮是你的主题或者插件提供的。
请登录后发表评论
注册