配置Chrome支持网页内的frame跨域

前言

跨域限制可以保证安全，但是调试的时候关掉会更方便，然而现在网络上能找到的关闭跨域限制方法，在新版的Chrome浏览器上根本没用……

经过一番摸索，发现用旧版的Chrome就可以绕过跨域限制，刚好我做的这个需要跨域内嵌frame的网页只是单纯展示的，所以这个正好符合我的需求，奥利给！

然后我找到了旧版的Chrome软件，解压出来是绿色版的可以直接运行，不过运行后发现直接把系统的Chrome给调起来了，然后只好放到Windows10的沙盒里面运行，（不得不说这个沙盒真的方便）

要取消Chrome的跨域限制，请在Chrome的快捷方式里加上命令行参数 --disable-web-security，如图所示：

运行之后会弹出提示说使用了不支持的命令行参数，会降低安全性啥的，就说明成功了，这时访问带有跨域frame的网页就是可以了

使用js操作frame中的元素

这部分是附加内容，简单说一下… 网络上一搜索都有的

首先是要确定frame或者iframe内的网页啥时候加载好，我懒得判断了，所以弄了个按钮，人肉判断，等frame里的网页加载完，按一下这个按钮，就实现自动把用户名密码填入frame内的网页并且自动登录

document.querySelector('#btn-login').onclick = function () {
    var iframe_window = document.getElementById('hik').contentWindow
    var iframe = iframe_window.document
}

然后就可以 iframe.querySelector 随意操作 frame内的DOM了

旧版Chrome下载

Chrome45版本：https://pan.baidu.com/s/1bCv9W8gcm9oi0tHOKuAgGw （提取码：74xr ）

更多版本的可以看这个：https://www.zhihu.com/question/20364836

参考资料

• 谷歌浏览器Chrome 80版本默认SameSite导致跨域请求Cookie丢失：http://www.withcoder.com/articles/server_side/zs/434.html
• iframe 跨域，有没办法获取 iframe子页面元素：https://segmentfault.com/q/1010000017568917/a-1020000017570521

欢迎交流

程序设计实验室专注于互联网热门新技术探索与团队敏捷开发实践，在公众号「程序设计实验室」后台回复 linux、flutter、c#、netcore、android、kotlin、java、python 等可获取相关技术文章和资料，同时有任何问题都可以在公众号后台留言~