[Cordova] 无法显示Alert视窗
[Cordova] 无法显示Alert视窗
问题情景
今天开了一个Cordova专案做范例，将预设的index.html页面修改为下列内容。按下执行却发现，这样一个简单的范例无法正常执行。点击页面上的Click Me按钮，没有办法显示Alert视窗。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta charset="utf-8" />
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">
<title>BlankCordovaApp1</title>
<script>
function test() {
alert("Clark")
}
</script>
</head>
<body>
<p>您好，您的应用程式已准备好!</p>
<button onclick="test()">Click Me</button>
</body>
</html>
解决方案
经过排查程式码后发现，在预设的状态下Cordova会为HTML加上「Content-Security-Policy」这个安全性设定，并且预设不启用内嵌JavaScript。 (其实预设页面的注解就有写了...)
预设页面注解
<!--
视需要在下方的中继标签中自订内容安全性原则。将'unsafe-inline' 加入default-src 以启用内嵌JavaScript。
如需详细资料，请参阅http://go.microsoft.com/fwlink/?LinkID=617521
-->
知道了问题之后，只需要将「'unsafe-inline'」加入Content-Security-Policy里的default-src区块，就可以让Alert视窗正常的执行并显示。
Before
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">
After
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval' ' unsafe-inline'; style-src 'self' 'unsafe-inline'; media-src *">
[Cordova] 无法显示Alert视窗的更多相关文章
- Swift显示alert和promp confirmation
Swift 显示alert func Alert(title:String, msg:String)->Void{ let alert = UIAlertController(title: ti ...
- Cordova 3.0 + Eclipse 开发流程
cd d:\cordova\projectscordova create HelloWorld com.example.helloworld HelloWorldcd HelloWorldcordov ...
- Appium环境搭建+cordova
1.安装JDK 配置JAVA_HOME(变量值为jdk的安装目录)以及Path path值如下: 验证是否生效 2.安装node.js 选择适合自己的版本官网直接下载https://nodejs.or ...
- Cordova - 使用Cordova开发iOS应用实战1（配置、开发第一个应用）
Cordova - 使用Cordova开发iOS应用实战1(配置.开发第一个应用) 现在比较流行使用 html5 开发移动应用,毕竟只要写一套html页面就可以适配各种移动设备,大大节省了跨平台应用的 ...
- Easyui弹出窗体在iframe的父级页面显示
今天做EasyUI学习的预到了一个这样的问题:通过iframe加载的一个页面在调用$.messager.alert();这个方法后只能在iframe中显示alert效果而不是在全局的页面上显示这并不我 ...
- Javascript和jQuery WordPress 图片轮播插件， 内容滚动插件，前后切换幻灯片形式显示
用于在有限的网页空间内展示一组产品图片或者照片,同时还有非常吸引人的动画效果.本文向大家推荐12款实用的 jQuery 图片轮播效果插件,帮助你在你的项目中加入一些效果精美的图片轮播效果,希望这些插件 ...
- Alert()与Redirect()同时使用失效的问题
例如以下代码: echo "<script>alert('跳转到博客园');</script>"; redirect(“www.cnblogs.com”); ...
- windows下用cordova构建android app
最近用到cordova打包apk,总结了下,写下来给大家分享. 一.前期准备工作: 1.安装node 6.2.0 *64 下载地址:链接:http://pan.baidu.com/s/1eS7Ts ...
- Cordova入门系列（一）创建项目 转发 https://www.cnblogs.com/lishuxue/p/6008678.html
版权声明:本文为博主原创文章,转载请注明出处 Cordova是什么? 初学Cordova的人,虽然了解一点点,知道Cordova是用来将html, css, js变成app的,但并不知道到底是怎么用的 ...
随机推荐
- 分享10条Visual Studio 2012的开发使用技巧
使用Visual Studio 2012有一段时间了,并不是追赶潮流,而是被逼迫无可奈何.客户要求的ASP.NET MVC 4的项目,要用.NET 4.5来运行.经过一段时间的摸索,得到一点经验和体会 ...
- UML基础系列：用例图
1. 概述 用例图(Use Case Diagram)描述“用户.需求.系统功能单元”之间的关系,是参与者所能观察和使用到的系统功能模型图. 用例图用于需求分析阶段 用例图包含6个基本元素:参与者(A ...
- ZOJ 3804 YY's Minions (简单模拟)
/* 题意:一个矩阵中有 n*m个宠物,每一个宠物都有一个状态, 1醒着的,0睡着的 X离开的!如果这个宠物(醒着的)的周围醒着的个数>3 || <2它就会睡着, 如果这个宠物(睡着的)的 ...
- python--基础学习（二）判断 、循环、定义函数、继承、调用
1.判断 if.elif 代码示范 # coding=utf-8 score = 90 if (score>=90): print("完美") print("优秀& ...
- CSS布局（上）
CSS布局(上) *:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: 0 !import ...
- .Net Request.Form含有危险字符的处理办法
今天我们的网站遇到一个问题,下标就类似于化学分子式这样的是需要用"<sub></sub>"这个标签括起来的,当时没有转义,有部分标签就显示不出来了, 后来我 ...
- [转载]TFS测试管理
微软2010年发布的Visual Studio 2010或Visual Studio Test Professional 2010包含一个称为 Microsoft 测试管理器的新应用程序,用于帮助您使 ...
- Web 开发人员和设计师必读文章推荐【系列三十】
<Web 前端开发精华文章推荐>2014年第9期(总第30期)和大家见面了.梦想天空博客关注 前端开发 技术,分享各类能够提升网站用户体验的优秀 jQuery 插件,展示前沿的 HTML5 ...
- finetuning caffe
还没解决,以下是解释fine-tune 比如说,先设计出一个CNN结构.然后用一个大的数据集A,训练该CNN网络,得到网络a.可是在数据集B上,a网络预测效果并不理想(可能的原因是数据集A和B存在一些 ...
- 如果简单的记录,就可以为这个世界创造更多的财富,那么还有什么理由不去写博客呢? — 读<<黑客与画家>> 有感
上一次博文发文时间是2016.1.15,7个月已经过去了.最近读了一本<>的书,对我触动挺大的!里面有关于技术趋势的探讨,也有关于人生和财富的思考! 开始更新iOS122的文章的初衷是,聚 ...