解决 Blocked a frame with origin “xxx“ from accessing a cross-origin frame

简介: 解决 Blocked a frame with origin “xxx“ from accessing a cross-origin frame
  • 内嵌 iframe 页面,一般使用 window.parentwindow.top 来获取父页面的 window 对象
  • 在子页面 想使用(或传递给) 父页面的参数,但是原因两个的域名不一样,所以会出现跨域问题。
  • 解决办法
    1、父页面监听 message,写法固定
window.addEventListener('message', function (e) {
  console.log(e)
})
  • 2、子页面发送 message 消息,并附带参数
// window.parent 是 iframe 子页面获取父页面的 window 对象
// 后面的 * 号就是处理跨域问题的,任何域名都不会出现跨域问题
window.parent.postMessage("需要传递的参数", '*')
// 也可以指定传送域名地址,这个域名不会出现跨域问题,写父页面(接收)域名地址
window.parent.postMessage("需要传递的参数", 'http://0.0.0.0:8080')
相关文章
|
存储 前端开发 JavaScript
React中如何动态添加和删除元素
React中如何动态添加和删除元素
417 0
iOS- 关于AVAudioSession的使用——后台播放音乐
iOS- 关于AVAudioSession的使用——后台播放音乐
700 0
iOS- 关于AVAudioSession的使用——后台播放音乐
|
3月前
|
安全 Unix Linux
Docker中授权普通用户使用docker命令以及解决无权限访问/var/run/docker.sock错误。
通过上述步骤,可以有效解决普通用户无法使用Docker命令的问题,同时处理 `/var/run/docker.sock`权限错误。这样的设置不仅方便用户使用Docker提供的各项服务,同时还能保护系统的安全性。在进行此类配置更改时,请确保理解每一步骤的作用及潜在的安全风险,尤其是在修改文件权限时。在实际的操作中,始终应该努力保持系统的最低必要权限,避免过度放宽权限,这是保障系统安全的一个重要方针。
974 75
|
5月前
|
自然语言处理 前端开发 JavaScript
🔥3.4K star!阿里出品对话式UI神器,轻松打造专业级聊天界面!
ChatUI 是阿里巴巴团队开源的对话式 UI 设计语言与 React 组件库,专为构建智能对话界面而生。它凝聚了阿里在智能客服领域的最佳实践,提供“最新、最全、最优质”的开源项目和高效工作学习方法。核心功能亮点包括智能消息流处理、无障碍访问认证、企业级主题定制、多端自适应布局、国际化双引擎和智能输入辅助。技术架构基于 React 17 + TypeScript 4,支持 Less + CSS Variables 样式方案,Rollup + Babel 构建工具,以及 Jest + React Testing Library 测试体系。
1420 5
|
10月前
|
JavaScript API 数据处理
vue3使用pinia中的actions,需要调用接口的话
通过上述步骤,您可以在Vue 3中使用Pinia和actions来管理状态并调用API接口。Pinia的简洁设计使得状态管理和异步操作更加直观和易于维护。无论是安装配置、创建Store还是在组件中使用Store,都能轻松实现高效的状态管理和数据处理。
553 3
|
JavaScript 测试技术
vue配置生产环境.env.production、测试环境.env.development
该文章介绍了如何在Vue项目中配置和使用不同的环境变量文件(.env、.env.production、.env.development)以适应开发、测试和生产环境,并通过修改`package.json`中的scripts来实现不同环境的打包。
2835 0
vue配置生产环境.env.production、测试环境.env.development
echarts如何设置滚动条(dataZoom),实现横向或纵向滚动
echarts如何设置滚动条(dataZoom),实现横向或纵向滚动
echarts如何设置滚动条(dataZoom),实现横向或纵向滚动
|
存储 负载均衡 NoSQL
Tomcat 9.X(9.0.74)集群实现Session共享(基于redisson)
本文主要介绍了tomcat集群环境下基于redis+Redisson实现session共享,分享给大家,供广大从业者学习和参考。
13010 4
|
Web App开发 存储
解决 Failed to read the ‘localStorage‘ property from ‘Window‘: Access is denied...
解决 Failed to read the ‘localStorage‘ property from ‘Window‘: Access is denied...
1015 0
|
前端开发 JavaScript
使用 JavaScript 获取 URL 参数的详细指南
【2月更文挑战第26天】
14185 2
使用 JavaScript 获取 URL 参数的详细指南