如何在我的 React 应用程序中打开外部网站答案

【问题标题】：How to open external website in my React app如何在我的 React 应用程序中打开外部网站
【发布时间】：2019-03-13 12:38:17
【问题描述】：

我正在使用 React 构建 PWA，并且我想在我的应用程序中打开一个外部网站（例如，在 Facebook 应用程序中，当您单击一个链接时，外部网站只是从底部滑入一个额外的窗口）。

由于我的应用是 PWA，我可能会使用 iframe 来获得相同的效果，但当然，由于 x-frame-options，这种方法会受到限制。

是否有任何其他选项可以实现所需的行为？

【问题讨论】：

您实际上想在您的应用程序中运行链接？那么你提到的 iframe 就是要走的路。
是的，但是由于 x-frame-options，这种方法非常有限 - 尝试将 Google 嵌入到您的 html 中，您就会明白我的意思
您可以使用fetch 或ajax 获取页面，然后将其呈现在一个元素中（可能是div）

标签： javascript reactjs iframe ecmascript-6 x-frame-options

【解决方案1】：

我认为没有其他方法，iframe 是完成您想要的确切工具。 x-frame-options 出于安全原因而存在，如果某些网站不允许其他网站通过 iframe 加载它，那么他们有理由这样做。启用此类 iframe 的正确方法是获得此特定网站的许可，即他们应将您的域作为受信任方包含在 X-Frame-Options 中。

【讨论】：