带有 React 和 OIDC 认证的 Electron 在 DEV 工作，但在 PROD 失败答案

【问题标题】：Electron with React and OIDC authenticatino works at DEV but fails at PROD带有 React 和 OIDC 认证的 Electron 在 DEV 工作，但在 PROD 失败
【发布时间】：2021-03-09 01:57:31
【问题描述】：

所以我构建了一个我想要的应用程序，包括与 OpenID Connect（OIDC“oidc-client”）的集成。

问题是它只适用于 DEV 环境，因为电子为它旋转本地服务器，所以当我在 DEV 模式下识别我的应用程序后被重定向时，侦听“localhost:3000”并且 oidc-client 可以继续保存令牌和其他的东西。

但是，一旦我构建了一个生产版本，electron 作为一个静态文件提供响应，所以现在所有的 URL 都是“file://....”，并且一旦我在这次识别后被重定向，没有人是否可以在“localhost:3000”处收听 OIDC 回调。我钻研了 electron 和 OIDC 的文档，但没有找到一个关于如何实现这个案例的示例。

有人在 Electron 的生产版本中成功“收听”了回调吗？我想到的唯一选择是在 prod 上启动服务器并收听“localhost:3000”，但问题是在哪里重定向它，所以 OIDC 会抓住它吗？如有任何意见，我将不胜感激，在此先感谢您。

这里是我描述的一些视觉解释。

【问题讨论】：

您找到解决方案了吗？ Okta 提供this tutorial 并包含一个用于生产构建的步骤，但由于您描述的问题，没有讨论它在产品构建中真正工作的必要步骤。
@dev 控制进程的唯一方法是使用电子应用程序的自定义登录页面，它与应用程序具有相同的来源，没有任何重定向，这与身份提供的登录页面不同服务器，需要重定向。这样我只需 http.post(...) 所有必要的数据并获取令牌作为响应。

标签： node.js electron openid-connect

【解决方案1】：

嗯 - 你是如何打包应用程序的？我有几个 Electron 示例可供您比较，您可以很容易地针对我的云 API 和授权服务器运行这两个示例：

在这两种情况下，我都可以通过“npm run pack”运行打包的应用程序。就我而言，我使用电子打包器来构建发布二进制文件。

我使用 AppAuth-JS 和 here is my code to listen on a loopback URL。

不确定我是否完全理解您的问题，但希望它能给您一些建议。

【讨论】：

我用“electron-builder”打包应用程序，首先我“构建”反应，然后我复制电子“main.js”，然后我将它们“打包”在一起并与“ipcRender”连接”。一旦构建完成，就没有服务器可以在 localhost 上侦听来自身份页面的回调，这与 DEV 中的情况不同。我尝试旋转本地服务器进行生产，但即使我使用令牌从身份页面捕获响应，将其重定向到何处以便 Electron 将其传递回 oidc-client？（就像它对 DEV 环境所做的那样）。我添加了一张图片以便更好地解释）
我查看了您的示例，它看起来不错且清晰，但最后您仍然重定向到 postLoginPage，它是“”authsamples.com....”而不是“文件： //.." 位置。
啊 - 我明白了。在我的第一个示例中，响应返回到一个 URL，例如 localhost:8000?code=abc0123zz。该技术是设置一个通过此响应恢复的承诺，而不是直接调用电子视图。在 AppAuth-JS 中，这是通过 AuthorizationRequestHandler Class 完成的。虽然编写代码很棘手，但这是要遵循的方向。