在 React 或 Angular 上带有本地 html 的 iframe答案

【问题标题】：iframe with local html on React or Angular在 React 或 Angular 上带有本地 html 的 iframe
【发布时间】：2022-01-16 09:04:06
【问题描述】：

我正在尝试在 iframe 中显示本地 html 文件。 在 Angular 和 React 中，它适用于开发模式，但适用于生产（AWS Amplify）我收到错误“无法匹配任何路由”。

我尝试了以前类似问题的所有答案，但没有适合我的解决方案。我尝试了多种位置（在 src 中，在公共场所，创建资产文件夹等）。我尝试了多种地址语法，例如：

<iframe src="address.html"></iframe>
<iframe src="./address.html"></iframe>
<iframe src="../address.html"></iframe>
<iframe src="./assets/address.html"></iframe>
<iframe src="../assets/address.html"></iframe>
<iframe src={process.env.BASE_URL + "/assets/address.html"}></iframe>
<iframe src="https://awsAmplifyAddress.com/assets/address.html"></iframe>

等等……

帮助...

【问题讨论】：

标签： reactjs angular iframe aws-amplify src

【解决方案1】：

请阅读以下问题先回答answer

您已经实施了 catch-all 策略，其中所有对服务器的请求都会响应 index.html 再次开始渲染您的应用，并且应用会尝试查找地址。 html页面您的应用程序中不存在的应用程序路由。

【讨论】：

【解决方案2】：

阿比舍克，你为我节省了很多时间。太感谢了！我完全忘记了单页路由问题。所以我的解决方案是：

转到 AWS Amplify 控制台
转到重写和重定向
将html添加到源地址，用于重定向文件。

查看添加的图像

【讨论】：