google浏览器:Ignored call to 'confirm()'. The document is sandboxed, and the 'allow-modals' keyword is not set
最近做一个功能,测试环境测试没问题,google浏览器测试也没问题,结果上生产发现google浏览器竟然用不了。查看控制台发现控制台报错:
Ignored call to 'confirm()'. The document is sandboxed, and the 'allow-modals' keyword is not set.
功能很简单,就是弹出一个确认对话框,但是生产环境google上竟然弹不出来,一直报上面问题。后来分析生产环境的页面是嵌入到一个iframe中的,iframe中有一属性“sandbox”,值如果包含“allow-modals”就没有问题了。
比如:
<iframe sandbox="allow-modals allow-forms allow-popups allow-scripts allow-same-origin" frameborder="0">
不过这个iframe不是我们开发,也不是我们负责,解决方案:
在页面加载是执行以下代码:
$("iframe").each(function() {
var sandbox=this.sandbox.value;
if(sandbox.length>5){//此处也可以是>0,由于sandbox的属性值都是由allow打头的,所以这里我选择5
if(this.sandbox.value.indexOf("allow-modals")==-1){
this.sandbox += ' allow-modals';
}
}
})
附:
sandbox属性是指带有额外限制的 <iframe>。sandbox 是 HTML5 中的新属性。
如果被规定为空字符串(sandbox=""),sandbox 属性将会启用一系列对行内框架中内容的额外限制。
sandbox 属性的值既可以是一个空字符串(应用所有的限制),也可以是空格分隔的预定义值列表(将移除特定的限制)。
sandbox主要是为了安全,它可以防止如下操作:
- 访问父页面的DOM(从技术角度来说,这是因为相对于父页面iframe已经成为不同的源了)
- 执行脚本
- 通过脚本嵌入自己的表单或是操纵表单
- 对cookie、本地存储或本地SQL数据库的读写
常见的sandbox属性:
| 值 | 描述 |
|---|---|
| "" | 应用以下所有的限制。 |
| allow-same-origin | 允许将内容作为普通来源对待。如果未使用该关键字,嵌入的内容将被视为一个独立的源 |
| allow-top-navigation | 允许 iframe 内容从包含文档导航(加载)内容。 |
| allow-forms | 允许嵌入的浏览上下文可以提交表单。如果该关键字未使用,该操作将不可用 |
| allow-scripts | 允许嵌入的浏览上下文运行脚本(但不能window创建弹窗)。如果该关键字未使用,这项操作不可用 |
allow-modals |
允许内嵌浏览环境打开模态窗口(比如alert(),confirm()) |
|
允许内嵌浏览环境禁用屏幕朝向锁定(译者注:比如智能手机、平板电脑的水平朝向或垂直朝向) |
|
允许内嵌浏览环境使用 Pointer Lock API |
|
允许弹窗 (类似window.open, target="_blank", showModalDialog)。如果没有设置该属性,相应的功能将静默失效 |
|
允许沙箱文档打开新窗口,并且不强制要求新窗口设置沙箱标记。例如,这将允许一个第三方的沙箱环境运行广告开启一个登陆页面,新页面不强制受到沙箱相关限制 |
|
允许嵌入者控制是否iframe启用一个展示会话 |
|
嵌入的页面的上下文可以导航(加载)内容到顶级的浏览上下文环境(browsing context)。如果未使用该关键字,这个操作将不可用。 |
参考:
https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/iframe
google浏览器:Ignored call to 'confirm()'. The document is sandboxed, and the 'allow-modals' keyword is not set的更多相关文章
- 利用Google浏览器调试js代码
1.js有两种引入方式,外链和内嵌: 内嵌在浏览中直接调试,外链要在断点处写debugger; 示例代码: <!DOCTYPE html> <html lang="en&q ...
- js部分知识整理,google浏览器的代码调试
整理一些学过的js知识点,包括js中3个括号的含义,this的使用,递归,google浏览器的代码调试.Location的属性及常用方法,window对象常用方法,open方法等. js括号 在js中 ...
- nodejs 使用Google浏览器进行可视化调试——Node Inspector工具
1.npm安装Node Inspector工具,全局安装 命令行执行npm install -g node-inspector 2.启动Node Inspector工具,命令行执行 node-insp ...
- 彻底解决Google浏览器CSS居中问题
div做的界面时,又出现CSS hack(CSS兼容浏览器问题)在IE内核浏览器或者firefox浏览器中都能居中,没有居中的可以用其特殊标签来设定居中,如下划线 _ IE6优先识别,!importa ...
- 下载Google浏览器(Google Chrome)离线安装包方法
Chrome浏览器默认是在线安装的,但由于网络的原因,有时很久也不能完成安装.其实Chrome官方是提供离线安装包的.具体地址如下: 稳定版:http://www.google.com/chrome/ ...
- google 浏览器使用技巧(一)
google 浏览器使用技巧(一) google 浏览器使用技巧 1. 调整地址栏的宽度 当安装多个插件的时候,默认插件会隐藏,所以使用起来很麻烦.在chrome 浏览器的配置中没有找到相应的配置.一 ...
- Google浏览器解决编码乱码问题
新版google浏览器编码乱码没有设置的入口,怎么办呢?. 步骤一: 可以下载goole的插件,名为charset,下载后的文件名为Charset_v0.4.1 步骤二: google右上角-> ...
- Google浏览器——AxureRP_for_chorme_0_6_2添加
准备 链接:https://share.weiyun.com/5PVwSMA Google浏览器版本 步骤 压缩解压 首先把需要安装的第三方插件,后缀.crx 改成 .rar,然后解压,得到一个文件夹 ...
- ubuntun 18.04 安装google浏览器
---恢复内容开始--- 一:下载谷歌浏览器镜像源 sudo wget http://www.linuxidc.com/files/repo/google-chrome.list -P /etc/ap ...
随机推荐
- [项目部署] CentOs7 安装 MySQL/Tomcat/JDK 笔记
0.安装 MySQL cd /usr/local/ # 新增yum源 rpm -Uvh http://dev.mysql.com/get/mysql-community-release-el7-.no ...
- jmeter请求中上传图片
1.请求中上传图片 把图片放在bin目录下:multipart/form-data 先把照片发送给阿里,阿里返回image_id:然后用后置条件正则表达式匹配并保存image_id 下次请求直接用im ...
- 做什么职业,也别做程序员,尤其是Java程序员
千万别做程序员,尤其别做Java这种门槛低,入门快的程序员(别跟我说Java搞精通了也很牛之类的,原因不解释,做5年以上就知道了),程序员本来就是我见过最坑爹的职业了...Java程序员更是,现在满地 ...
- 树莓派(Arduino)仿真软件 —— Fritzing
Fritzing 官网:Fritzing Fritzing 下载地址:Fritzing Download windows 下降 zip 文件解压后,免安装双击 exe 即可运行:
- 团队开发中Git冲突解决
正常来说我们团队协作开发过程中,冲突是常有的事,下面介绍下本人在开发中的解决办法. 冲突的主要原因就是由于我们开发人员在分支的同一位置写入了不一样的代码,然后合并到主干上导致我们冲突. 方法: 当冲突 ...
- [Luogu2371][国家集训队]墨墨的等式
luogu 题意 给出\(n,a_i,B_{min},B_{max}\),求使得\(a_1x_1+a_2x_2+...+a_nx_n=B\)存在一组非负整数解的\(B\in[B_{min},B_{ma ...
- ProjectEuler654
我,ycl:BM是什么早就忘了! 毕老爷:那你们可以做一做这道题练练BM板子啊. 传送门 //Achen #include<bits/stdc++.h> #define For(i,a,b ...
- 洛谷【P1140】相似基因
浅谈\(DP\):https://www.cnblogs.com/AKMer/p/10437525.html 题目传送门:https://www.luogu.org/problemnew/show/P ...
- PyCharm 2017.2.2+PyQt5+Python3.6.0
PyCharm注册地址 http://idea.imsxm.com/ 安装的是miniconda激活虚拟环境执行pip install PyQt5pip install PyQt5-tools 从官网 ...
- salt-minion dead but pid file exists 正确解决方法
说明: 看了网上很多关于alt-minion dead but pid file exists 的解决方法,千篇一律的写一个shell脚本 killproc salt-minion 见链接:http: ...