iframe嵌套第三方网站页面,如何获取第三方网站的内容，获取时跨域了怎么解决？

一般直接获取不到，只能解决跨域问题才能获取到，可以使用代理解决或者使用CORS

帮你找了个相似的问题, 你可以看下: https://ask.csdn.net/questions/7575245
你也可以参考下这篇文章：修改iframe路径、iframe内元素修改iframe路径
除此之外, 这篇博客: iframe 引入第三方页面，并去掉页面的导航栏和下半部分，只显示部分页面的方法中的 iframe 引入第三方页面，并去掉页面的导航栏和下半部分，只显示部分页面的方法 部分也许能够解决你的问题, 你可以仔细阅读以下内容或跳转源博客中阅读:

我用的elementui 画的页面，和html一样

用iframe引入第三方页面
（1）src 里面写要引入的第三方页面的链接
（2）iframe 一定要放在div里面，最外层div的position =relative，里层的div的position=adsolute
（3）去掉头部的内容，可以直接在`里层的div中的margin-top设置，margin-top = -122px，这个-122px 可以根据自己的需求调整，页面就会网上移动，去掉自己不需要的导航栏等部分。


        <div align="center" style="margin:0 auto;">
          <div style="width:100%;height:600px;overflow:hidden;border:0px"> 
            <div style="margin:-122px 0px 0px -10px;position:relative"> #这里的position = relative 是必须的
               <iframe src="http://ucsc.crg.eu/cgi-bin/hgTracks?db=mm10;position=chr11:61507627-61509532" id="ifyemian" scrolling="no" frameborder="0"
                  style="position:absolute;  //这里的position = acsolute也是必须的
                      width: 100%;
                      height: 100vh;
                      display:block;
                      left: 0;
                      right:0;">
                </iframe>
            </div>
          </div>
        </div>

js部分：
在mounted钩子函数中，渲染

mounted(){
	function changeifyemianfIframe() {
     	 const mobsf = document.getElementById('ifyemian'); #根据id选择对应要处理的部分
     	 const deviceWidth = document.body.clientWidth;
     	 const deviceHeight = document.body.clientHeight;
     	 mobsf.style.width = (Number(deviceWidth) - 220) + 'px'; //数字是页面布局宽度差值
    	 mobsf.style.height = (Number(deviceHeight) - 380) + 'px'; // 这部分可以从下至上剪掉页面不需要的部分
    }

   	 changeifyemianfIframe()
    	window.onresize = function () {
      	changeifyemianfIframe()
    }
}

展示：

在这里插入图片描述

以下回答由chatgpt基于相关博客总结生成:
问题解决方案:
通过跨域的iframe获取第三方网站页面内容，可以采用以下两种方式：
1. 使用代理服务器
代理服务器是一种服务器，它充当客户端以及目标服务器之间的中间服务器，它的作用是获取目标服务器上的内容并将其转发回客户端。因此，使用代理服务器可以绕过跨域限制，实现对第三方网站页面内容的获取。
具体实现步骤如下：
(1) 安装并启动代理服务器
可以使用Java写的跨域代理工具corsproxy（https://github.com/gr2m/CORS-Proxy）和node.js写的http-proxy（http://www.jianshu.com/p/8bf5b2c3fd23）等。
(2) 在自己的网站上添加iframe标签，并以代理地址作为src属性的值
例如：
这样，当访问这个iframe时，浏览器会先向代理服务器发送请求，代理服务器会将请求转发到目标服务器上，并将目标服务器返回的数据传回浏览器，从而绕过跨域限制。
(3) 在代理服务器上设置响应头
因为CORS（跨域资源共享）是浏览器实施的安全策略，因此需要在代理服务器上设置响应头，以便浏览器允许访问第三方网站页面内容。例如：
Access-Control-Allow-Origin: *
这样设置后，浏览器就会认为代理服务器和自己在同一个域下，因此就能够允许访问第三方网站页面内容了。
1. 使用window.postMessage方法
window.postMessage方法允许跨窗口通信，可以在两个窗口（例如：父窗口和iframe子窗口）之间传递数据，并且可以绕过跨域限制。
具体实现步骤如下：
(1) 在父窗口中添加事件监听器
例如：
window.addEventListener('message', receiveMessage, false);
这样，在子窗口向父窗口发送信息时，父窗口就能够监听到。
(2) 在子窗口中使用window.postMessage方法发送信息
例如：
window.postMessage({ message: 'hello' }, '*');
第二个参数'*'表示接收消息窗口的源不限于任何一个源。
(3) 在父窗口中实现接收消息的函数
例如：
function receiveMessage(event) { //event.data包含子窗口发送的数据 console.log(event.data.message); }
这样，在子窗口发送信息后，父窗口就能够接收到，并且绕过了跨域限制。
综上所述，以上两种方式都可以实现跨域获取第三方网站页面内容，具体选择哪种方式需要根据自身情况来决定。