使用 Javascript 访问 iframe 内容答案

【问题标题】：Access Iframe content with Javascript使用 Javascript 访问 iframe 内容
【发布时间】：2022-01-17 06:16:21
【问题描述】：

我想在 iframe 中访问此 URL 内容我检查了它没有 x-frame-options 设置为 SAMEORIGIN 但是给了我这个错误：阻止了来源为“null”的框架访问跨域框架。

https://s.tradingview.com/mediumwidgetembed/?symbols=BTCusdt&BTCusdt=BINANCE%3ABTCUSDT%7C12M&topColor=%23EFE7FF&lineColor=%23784ED1&chartType=area&locale=en&fontColor=%23787B86&gridLineColor=%23D3BDFF&width=100%25&height=100%25&colorTheme=light&&utm_medium=widget_new&utm_campaign=symbol-overview&showFloatingTooltip=1&showVolume=1

<body>
<iframe id="TView"
        src="https://s.tradingview.com/mediumwidgetembed/?symbols=BTCusdt&amp;BTCusdt=BINANCE%3ABTCUSDT%7C12M&amp;topColor=%23EFE7FF&amp;lineColor=%23784ED1&amp;chartType=area&amp;locale=en&amp;fontColor=%23787B86&amp;gridLineColor=%23D3BDFF&amp;width=100%25&amp;height=100%25&amp;colorTheme=light&amp;&amp;utm_medium=widget_new&amp;utm_campaign=symbol-overview&amp;showFloatingTooltip=1&amp;showVolume=1"
        style="margin:0 !important; padding: 0 !important; width: 100%; height: 450px;" frameborder="0"
        allowtransparency="true" scrolling="no"></iframe>
</body>
<script>
    let iframe = document.getElementById('TView');
    setTimeout(()=>{
        let iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
        console.log(iframeDocument)
    },1000)
</script>

【问题讨论】：

标签： javascript vue.js iframe nuxt.js

【解决方案1】：

由于小部件域的 CSP 规则，它不允许您加载 iframe。

查看此文档，该小部件允许一组域，而您的域可能不在其中。

https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/default-src

【讨论】：