时间戳

首页 > 解决方案 > 无法在 iFrame 内加载数据

html - 无法在 iFrame 内加载数据

问题描述

我试图获取旧网站的 URL，但发生了错误：

Fetch API cannot load http://xyz.
No 'Access-Control-Allow-Origin' header is present on the requested resource.
Origin 'http://abc' is therefore not allowed access.
If an opaque response serves your needs, set the request's mode to 'no-cors'
to fetch the resource with CORS disabled.

我的代码看起来像这样

render(){
    return (
       <div>
          <iframe src="http://localhost:8080/.../StockExchangeWidget.html" />
       </div>
    )
}

当我在 iFrame 之外加载它时，一切正常，但是当我尝试用 iFrame 很好地加载它时，我会遇到很多错误，但仅适用于图表数据，因为您可以看到框架和按钮已加载。

在此处输入图像描述

当我尝试通过 WebSocket 连接内的 url 加载 HTML 页面到 'wss://widgetdata.tradingview.com/socket.io/websocket?from=widgetembed%2F&date=2018_06_09-17_59' 失败时，我也收到了 WebSocket 错误： WebSocket 握手期间出错：意外的响应代码：403

标签： htmlreactjssocketswebsocket

解决方案

托管 iframe 的域需要修改其CORS 策略，以允许来自您的域的请求到达其站点。如果该页面上没有 CORS 标头，您的浏览器将不会呈现 iframe 的内容（出于安全原因）。

推荐阅读