我在本地托管AngularJS。如果我在结束体标记之前以这种方式加载JS文件,它可以工作:
<script src="javascript/angular.min.js"></script>
<script src="javascript/angular.min.js.map" type="application/json"></script>
<script src="javascript/angular-route.min.js"></script>
<script src="javascript/angular-route.min.js.map" type="application/json"></script>
为了允许新的'严格动态'CSP,我需要在一个无源脚本中加载我的所有脚本(即,页面上的脚本元素不允许'src';脚本本身必须包含在脚本标记内)。对于除AngularJS之外的所有脚本,我的脚本加载例程没有问题。如果我尝试以这种方式加载它,它会在控制台中失败并显示错误消息(“无法读取未定义的属性'模块',等等):
<script>
window.onload = function () {
var loadScript = function (url, type) {
var script = document.createElement('script');
script.src = url;
if (type === 'application/json') {
script.type = type;
}
document.body.appendChild(script);
};
loadScript('javascript/angular.min.js', '');
loadScript('javascript/angular.min.js.map', 'application/json');
loadScript('javascript/angular-route.min.js', '');
loadScript('javascript/angular-route.min.js.map', 'application/json');
};
</script>
如果例程不限于window.onload事件,那么这也会失败:
<script>
var loadScript = function (url, type) {
var script = document.createElement('script');
script.src = url;
if (type === 'application/json') {
script.type = type;
}
document.body.appendChild(script);
};
loadScript('javascript/angular.min.js', '');
loadScript('javascript/angular.min.js.map', 'application/json');
loadScript('javascript/angular-route.min.js', '');
loadScript('javascript/angular-route.min.js.map', 'application/json');
</script>
...如果我从本地主机或谷歌的Ajax CDN获取文件,这没有任何区别。
有任何线索如何解决这个问题?使用'严格动态'CSP,我别无选择,只能使用上述技术加载AngularJS框架文件。