使用 React 前端和 Rails 后端的带有谷歌日历 API 的客户端 OAuth

Question

所以我正在尝试使用 google oauth 为我的用户获取刷新令牌（实际上并未使用 google oauth 来保存用户）。当我将客户端 OAuth 用于 google api 时，我一切正常，但是当你进行握手时它们不提供刷新令牌，只提供 access_token。我需要一个持久的 refresh_token，因为我要向用户的谷歌日历发出很多请求。

所以我在我的 Rails 服务器上设置了omniauth，以使流程如下所示：

用户点击通过谷歌验证（客户端）-->

弹出屏幕转到后端服务器 (localhost:3001/users/auth/google_oauth2) -->

后端 Rails 服务器重定向到 google 进行身份验证 -->

他们通过 google 进行身份验证并被重定向到后端服务器的回调 (localhost:3001/users/auth/google_oauth2/callback) -->

后端服务器为适当的用户保存令牌，然后在localhost:3000 上重定向回客户端应用程序（客户端无需执行任何操作，只需将令牌保存在我的服务器上以备将来使用）

但是，我确实需要知道身份验证是否成功，以便我可以在 react/redux 中调度适当的操作。在 redux-auth 中，他们检查 popup.location URI 中的 access_token。问题是当我使用这个服务器端弹出流时，我得到了这个讨厌的 http/https 错误：

（原图：http://imgur.com/v5NgIGr）

如果不是重定向回客户端，我只是重定向到后端服务器中的一个视图，那么我可以在该页面上有一个脚本，它只执行window.close()，它可以工作，但对我来说似乎很hacky。我在想的另一个潜在解决方案是尝试使用window.postMessage api，但我不知道它是否有很好的浏览器支持/似乎也很hacky。我可以从弹出窗口向另一个窗口（主客户端应用程序）发出一条消息，说明 oauth 成功，所以我的反应代码并做它需要做的任何事情。

我觉得我完全错误地处理了整个流程，或者我遗漏了一些明显的东西。

我还觉得，如果我在所有东西上都安装了 HTTPS，那么它就可以正常工作，因为之前它是 100% 客户端时，弹出窗口工作得很好，而且我没有收到这个 SecurityError。我花了一些时间弄清楚如何使用 https 获取我的 webpack 开发服务器，并尝试对 rails 做同样的事情（认为我在 rails 方面做错了）但它仍然无法正常工作。还觉得我不需要在我的所有开发服务器上强制使用 HTTPS 以使其正常工作......

如果有人有任何想法或可以给我一些方向，将不胜感激！

Answer 1

您以错误的方式处理此问题。 Google 的身份验证及其 API 确实有令人困惑的文档。我也遇到了类似的情况，在花了相当长的时间后，我找到了正确的方法。

根据您的问题，我相信这似乎是相关链接：https://developers.google.com/identity/sign-in/web/server-side-flow

按照它，你的流程应该是这样的：

要将其映射到您的问题上，您将执行以下操作：

1. 用户点击通过谷歌验证（客户端）
2. 客户向 Google 请求授权，其中包括您的范围 并收到一次authorization code。
3. Client 将此授权代码发送到您的 ruby​​ 服务器。
4. Ruby 服务器使用授权码将其与access_token 交换并持久化refresh_token，您将在随后对google apis 的请求中使用它。

希望对你有帮助。