项目用的js框架是angularJS,遇到一个和浏览器兼容相关的bug,功能是按钮点击出现一个popupWindow,再点击popupWindow右上角的关闭按钮时,在Safari浏览器中会崩溃而Chrome以及Firefox浏览器中均能正常显示。
报错内容如下:
Safari can’t open “unsafe:javascript:void(0);” because macOS doesn’t recognize Internet addresses starting with “unsafe”
如下图所示:
根据其错误信息可以大体推测出和javascript:void(0)
以及macOS不能识别有关,全局搜索javascript:void(0)
在项目中找到这样写的代码,调试着修改。我的问题代码是在这里:
<a href="javascript:void(0)" data-ng-click="showPopup()" class="close-link"><img alt="close"></a>
展开popup后点击关闭时,通过href
标签指向本页就实现了关闭的功能了,但是macOS不能识别,原因是angular对href有安全检查,只能生成它认为安全的链接,javascript不在angularJS的白名单中,将href="javascript:void(0)"
修改为href="#"
即可,代码如下:
<a href="#" data-ng-click="showPopup()" class="close-link"><img alt="close"></a>
还有一种修改方式是配置编译:
angular.module('app').config( [
'$compileProvider',
function( $compileProvider )
{
$compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|ftp|mailto|tel|file|sms):/);
// Angular v1.2 之前使用 $compileProvider.urlSanitizationWhitelist(...)
}
]);
以上即为解决方式,如有疑问请及时指出,其中参考链接如下及大致概要如下;
1.https://gitter.im/720kb/angular-datepicker?at=5afe7357b84be71db9178260
Since javascript is not in the sanitization whitelist by default in angularjs, it will be replaced with href=”unsafe:javascript:void(0)”. If you click on a link like this, Safari will try to open a page and just shows an error called Safari can’t open “unsafe:javascript:void(0)” because macOS doesn’t recognize Internet addresses starting with “unsafe:”.
The javascript protocoll can be added to the whitelist to fix this:
$compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|s?ftp|mailto|tel|file|javascript):/);
However, i don’t think thats recommended. It would be better just to change the href to # or just simply remove it.
2.http://eyehere.net/2015/angularjs-unsafe/ 标题:“关于angularJs中的unsafe”
angular.module('app').config( [
'$compileProvider',
function( $compileProvider )
{
$compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|ftp|mailto|tel|file|sms):/);
// Angular v1.2 之前使用 $compileProvider.urlSanitizationWhitelist(...)
}
]);