如何将长用户令牌从 React Native 传递到 React Web 应用程序？

Question

我正在构建一个 React Native 应用程序，其中包含一个用于将用户重定向到基于 React 的 Web 应用程序的按钮。目标是将 userToken 从移动应用程序传递到 Web 应用程序，以便用户可以保持身份验证。我最初的想法是将令牌作为查询参数包含在 URL 中，如下所示：

const handleStatisticsClick = async () => {
   WebBrowser.openBrowserAsync(
     https://www.MY-URL.COM/user-profile/creator-hub?accessToken=${userToken.replace(/./g,'-')}
  ); };

如何安全可靠地将很长的 userToken 从 React Native 应用程序传递到 React Web 应用程序？是否有更好的替代方法来使用查询参数来实现此目的？ 但是，该令牌非常大（数千个字符），并且我担心在查询字符串中传递如此大的令牌时可能会出现 URL 长度限制或其他限制的潜在问题。例如，在测试此实现时，浏览器偶尔无法正确打开 URL，并且某些服务似乎会截断查询参数。此外，我不确定接收服务器如何处理具有非常大的查询字符串的 URL。如果相关，服务器配置为接受标准长度的查询字符串，但可能需要针对此类边缘情况进行调整。

此外，我担心通过 URL 传递此类敏感信息的安全性。

调试尝试

使用 URL 参数：我最初尝试在 URL 查询字符串中传递令牌，但遇到了长度限制问题以及敏感数据泄露问题。

替代缩短令牌：我考虑在移动应用程序中生成一个短暂的唯一标识符，Web 应用程序可以通过 API 调用交换实际令牌，但这会增加复杂性并可能引入延迟。

使用 Cookie：我探索了设置 Cookie 的可能性，但我不确定如何在移动应用程序和网络应用程序之间安全地共享 Cookie。

问题

有人遇到过这个问题吗？哪些解决方案对您有用？我正在寻找最佳实践来确保可靠性和安全性。

我尝试使用 React Native 中的 WebBrowser.openBrowserAsync 函数将 userToken 作为查询参数直接传递到 URL 中。我希望令牌能够无缝传输到网络应用程序并允许用户保持身份验证。

但是，我遇到了对潜在 URL 长度限制和在查询字符串中包含如此长的令牌（数千个字符）的安全问题的担忧。此外，我担心这可能会影响不同的浏览器或平台。

我正在寻找一种可靠且安全的替代方案来传递此令牌，而不会遇到这些问题。

Answer 1

听起来您在通过 URL 传递如此长的令牌时面临着一些挑战。您是否考虑过使用带有授权代码的安全身份验证流程（例如 OAuth）？它将完全避免在 URL 中传递敏感信息，并且您可以利用令牌交换机制之类的东西。另外，您是否研究过您的服务器是否可以处理 POST 请求中更大的有效负载，这可以帮助您在请求正文中安全地传递令牌？