两年前就接触phonegap,也尝试做了一个小的东西在移动平台上。没有深入尝试和了解,今年有个项目用H5来做展示,同时也有在移动平台上应用的需求。我就想到了phonegap,现在变更为Cordova。搭建环境这里就不描述了可以参考cordova官方网站。
移动终端应用比较简单,包括登录、消息列表、通知列表、全文检索、签到。
很快就实现了这几个功能,在chrome浏览器上测试通过,通过cordova build android 进行打包。进行真机测试。
在真机上测试结果也比较顺利(版本android 4.0),所有功能在真机上都顺利测试通过。
随机在同事手机上进行测试(版本android5.0.1 ),第一个登录功能就卡壳了,输入用户、密码后点击”登录“功能没有响应,考虑到可能是打包版本问题。
查看AndroidManifest配置
<uses-sdk android:minSdkVersion="14" android:targetSdkVersion="22" />
否定打包版本问题,配置版本范围最高支持android5.1.1.如果打包android版本问题,App应该无法正常安装。
于是各种原因查找,起初怀疑ajax方式不对,因为所有数据交换都是需要跨域。尝试各种不同跨域方式,在浏览器下功能正常。
但在真机版本高于android 4.1就不能正常使用,因为在真机上我查看不了报错的log,所有开始没有头绪,排除了很多原因。
在查找过程中看到一篇文章,说道真机测试log查看问题通过一段脚本
window.onerror = function (msg, url, line) {
var idx = url.lastIndexOf("/");
if (idx > -1) {
url = url.substring(idx + 1);
}
alert("ERROR in " + url + " (line #" + line + "): " + msg);
return false;
};
终于看查看真机错误提示了
显示是因为安全问题导致,jquery脚本运行错误最终导致所有功能失效了。知道问题所在就好解决了。
查阅关于Content-Security-Policy资料,参考资料。
页面中包含<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap:http://192.168.0.55 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">