我正在尝试测试 OAuth 按钮,但它们(Facebook、Twitter、LinkedIn)都返回错误,似乎表明我无法从 本地 URL 测试或使用它们。
如果人们似乎都需要非开发和非本地连接环境,那么人们通常如何使用 OAuth 进行开发?
2016 年 10 月更新:现在最简单:使用始终指向 127.0.0.1
的 lvh.me,但请确保在每次需要调用它时验证它仍然正确(因为域可能会过期或获取接管,并且 DNS 中毒始终是一个问题)
上一个答案:
由于回调请求是由浏览器发出的,因此作为 HTTP 重定向响应,您可以设置您的 .hosts 文件或等效文件以将不是 localhost
的域指向 127.0.0.1。
例如,假设您向 Twitter 注册了以下回调:http://www.publicdomain.com/callback/
。确保 www.publicdomain.com
在您的 hosts 文件中指向 127.0.0.1,并且 twitter 可以在 www.publicdomain.com 上进行成功的 DNS 查找,即域需要存在,并且如果请求,特定回调应该可能返回 200 状态消息。
编辑:
我刚刚阅读了以下文章:http://www.tonyamoyal.com/2009/08/17/how-to-quickly-set-up-a-test-for-twitter-oauth-authentication-from-your-local-machine,该文章与此问题相关:Twitter oAuth callbackUrl - localhost development。
引用文章:
您可以使用 URL 缩短服务 bit.ly。只需缩短 [localhost URL 例如 http//localhost:8080/twitter_callback] 并将缩短的 URL 注册为 Twitter 应用程序中的回调。
这应该比在 .hosts 文件中摆弄更容易。
请注意,现在(2014 年 8 月)bit.ly 不允许将链接转发到本地主机;但是谷歌链接缩短器有效。
PS 编辑:(18 年 11 月):Google 链接缩短器停止支持 localhost 或 127.0.0.1。
或者您可以使用 https://tolocalhost.com/ 并配置它应该如何将回调重定向到您的本地站点。您可以指定主机名(如果与 localhost 不同,即 yourapp.local 和端口号)。 仅用于开发目的。
您还可以使用 ngrok:https://ngrok.com/。我一直使用它在我的本地主机上运行公共服务器。希望这可以帮助。
甚至免费提供您自己的自定义域的另一个选项是 serveo.net 和 https://localtunnel.github.io/www/
./ngrok http 8080 -host-header="localhost:8080"
,我正在使用公共 URL 运行。
对于 Mac 用户,编辑 /etc/hosts
文件。如果它是只读的,您必须使用 sudo vi /etc/hosts
。授权后,oauth 服务器会发送回调 URL,由于回调 URL 是在您的本地浏览器上呈现的,因此本地 DNS 设置将起作用:
127.0.0.1 mylocal.com
将您的本地域设置为 mywebsite.example.com
(并将其重定向到 localhost)——即使通常使用 mywebsite.dev
。这将允许强大的自动测试。
虽然授权 .test
和 .dev
是不允许的,但在 google oauth2 中授权 example.com
是 允许的。
(您可以在主机文件中将任何域重定向到 localhost (unix/linux: /etc/hosts
))
为什么选择 mywebsite.example.com
?
因为 example.com
是保留域名。所以
您的机器上不会有命名冲突。如果您的测试系统将数据暴露给 not-redirected-by-mistake.example.com,则没有数据风险。
您可以在 windows 或 linux 上编辑 hosts 文件 Windows : C:\Windows\System32\Drivers\etc\hosts Linux : /etc/hosts
localhost 名称解析在 DNS 本身内处理。 127.0.0.1 mywebsite.com
完成测试后,您只需评论添加的行以禁用它
127.0.0.1 mywebsite.com
Google 不允许在 localhost 上使用 http://webporject.dev
或 .loc
和 .etc 和 google 短链接测试身份验证 api,这缩短了您的本地 url(http://webporject.dev
) 也 bit.ly
:)。 Google 只接受以 http://localhost/
开头的网址...
如果您想测试 google auth api,您应该按照以下步骤操作...
https://i.stack.imgur.com/gGIOb.png
如果您使用 openserver
,请转到设置面板并单击 aliases tab
并单击下拉菜单,然后找到 localhost
并选择它。
现在您应该通过单击第一个下拉列表旁边的下一个下拉列表来选择您的本地 Web 项目根文件夹。
并单击一个名为 add
的按钮并重新启动 opensever。
现在您的本地项目在此链接 http://localhost/
上可用,您也可以将此本地 url 粘贴到 google auth api 到 redirect url
字段...
此答案仅适用于 Google OAuth
它实际上非常简单,我很惊讶它对我有用(我仍然怀疑我的眼睛所看到的)。
显然,您可以在 Google Developer Console 上将 localhost
添加为可信域,因为 localhost 是大多数规则的例外,如您所见 here。
这可以在 OAuth 2.0 客户端 ID 下完成on this page。单击编辑,然后添加 http://localhost:8000
或类似端口,然后单击保存。
在输入框中包含 http
或 https
至关重要。
HTTP 还是 HTTPS?
我再次对 Google 允许使用 http 感到惊讶,但请注意,如果您的应用程序已发布到生产环境,则会存在轻微的安全风险。
如果您想格外谨慎,可以选择坚持使用https。这将要求您在 localhost 服务器上设置 SSL 证书。
这比您想象的要容易,因为 SSL 证书不需要是有效的。许多 http 服务器应该给你这个选项。无论如何,您都必须在浏览器中单击“继续”按钮才能绕过大红色警告。
这比 http 更安全,因为 a) 如果黑客正在尝试钓鱼,用户将看到一个大红色警告,或者 b) 他们唯一不会看到此警告的情况是用户故意设置了自托管 SSL 证书,在这种情况下,他们可能知道自己在做什么(我想病毒在技术上也可以做到这一点,但在那个阶段,他们已经获得了对用户系统的足够控制权,可以做任何他们想做的事情)。
localhost
不起作用,但 127.0.0.1
起作用。 @edit:至少我是这么想的。我正在使用 Gapi,我通过了 gapi.client.init
,但是当我尝试授权时,我得到了 Error 400: invalid_request Permission denied to generate login hint for target domain.
我发现 xip.io 会自动将固定 url 转换为嵌入式 localhost 域。
例如,假设您的 localhost 服务器正在 127.0.0.1:8000
上运行,您可以转到 http://www.127.0.0.1.xip.io:5555/
访问该服务器。然后,您可以将此地址添加到 Facebook 或 Google 的 Oauth 配置中。
我遇到了其他答案中提到的工具的一些问题,例如 http://tolocalhost.com 不转发查询参数(更不用说您必须先访问页面并对其进行配置,与 https://thomasmcdonald.github.io/Localhost-uri-Redirector/ 相同)和 http://lvh.me 没有用对我来说,因为我在本地计算机上运行代理,并且需要公共 URL 指向像 http://mywebsite.dev 这样的私有 URL。
所以我制作了自己的工具来满足我的需求,并且可能会满足你的需求:
例子:
https://redirectmeto.com/https://www.google.com/search?q=puppies
http://redirectmeto.com/http://localhost:4000/oauth/authorize
http://redirectmeto.com/http://client.dev/page
另一个有价值的选项是 https://github.com/ThomasMcDonald/Localhost-uri-Redirector。这是一个非常简单的 html 页面,可以重定向到您在 UI 中配置的任何主机和端口。
该页面托管在 Github https://thomasmcdonald.github.io/Localhost-uri-Redirector 上,因此您可以将其用作 OAuth2 重定向 URL,并在 UI 中配置您的目标主机和端口,它只会重定向到您的应用
以 Google OAuth 为参考
在您的 OAuth 客户端选项卡中,将您的应用程序 URI 示例(http://localhost:3000)添加到授权的 JavaScript 源 URI
将您的 App URI 示例 (http://localhost:3000) 添加到 Authorized JavaScript origins URIs
在您的 OAuth 同意屏幕中将 mywebsite.com 添加到授权域
将 mywebsite.com 添加到授权域
在 windows 或 linux 上编辑 hosts 文件 C:\Windows\System32\Drivers\etc\hosts Linux : /etc/hosts 添加 127.0.0.1 mywebsite.com (注意如果有任何其他 127.0.0.1,请注释掉任何内容)
不定期副业成功案例分享
.me
)。结果,lvh.me 无法正常工作。我发现使用 lacolhost.com 取得了成功。