Plunker 身份验证如何工作

How does the Plunker authentication work

所有。如果我的问题偏离主题或愚蠢的问题,请原谅我。 我真的很想知道如何为 Plunker 实现像 GitHub 这样的身份验证机制。 在我的 project.I 中,我认为我也有同样的情况。 我有一些网站,例如 Plunker。 我想为 GitHub 等所有其他网站实施 SSO 中心认证网站或服务。 当我在 Plunker 中单击按钮 Sign in with GitHub 时。该网站将打开新的 windows 和 url https://github.com/login?return_to=%2Flogin%2Foauth%2Fauthorize%3Fclient_id%3D7e377e5657c4d5c332db%26redirect_uri%3Dhttp%253A%252F%252Fplnkr.co%252Fauth%252Fgithub%26scope%3Dgist

当我在 GitHub 成功登录时。然后 Plunker 将使用我刚刚在 GitHub.

中使用的经过身份验证的用户登录

我的问题是我不知道 GitHub 和 Plunker 之间的身份验证是如何工作的。 有人可以告诉我一些事情吗?它将被应用。谢谢

Plunker 的 "log in with GitHub" 按钮使用 OAuth2, an open standard for this kind of thing. It's the same technology used by Google for their sign-in with Google functionality,以及许多其他提供商。

这里是GitHub's documentation for adding "log in with OAuth" to your site.

创建您自己的 OAuth 提供程序是一项重要任务,如果不仔细权衡,您可能不想处理它。如果您确实选择沿着这条路走下去,您可能希望为您的语言或选择的堆栈使用现有的库,例如也许来自 this list。如果您只打算构建一个 OAuth 客户端,这也是一个很好的建议。

正如所指出的,Plunkr 的登录过程似乎正在使用 Github 的 OAuth2,但设法在没有 redirects/reloads 使用 window.open 和 postMessage. A detailed description of the technique can be found here. The demo code 看起来相对无痛。

Gatekeeper project seems to be a more polished implementation (with node.js) of that idea and there is a detailed tutorial on doing client-side auth with it here.