我已经获得了第三方表单解决方案,我可以通过导入javascript文件嵌入我的网站。嵌入脚本的说明实际上就是这样的 "复制并粘贴:"
<script type="text/javascript" src="https://<form.company.com>/<form_name>.js"></script>
看看实际的javascript文件,它基本上只是一组
document.write(" <input id=\"SubmitButton2070990\""+"\n");
document.write(" class=\"fsSubmitButton\""+"\n");
document.write(" style=\"display: block;\""+"\n");
document.write(" type=\"submit\""+"\n");
document.write(" value=\"Submit Form\" />"+"\n");
现在,我尝试了几件事...... 我已经获得了一个带有模板URL的指令,该URL可以访问包含该脚本的简单部分。 它看起来像这样:
指令:
angular.directive('feedbackForm',function() {
return {
restrict: 'A',
templateUrl: '/static/form.html'
};
)
form.html
<div>
<h2>testing form</h2>
<script type="text/javascript" src="https://<form.company.com>/<form_name>.js"></script></div>
</div>
所有发生的事情都是呈现html,但脚本的内容不是......
我已经尝试了$http
请求,该请求从上面的第三方链接获取脚本的内容,并尝试执行它。
像
$http.get('https://<form.company.com>/<form_name>.js')
.then(function(response){
var formScript = new Function(response.data);
formScript();
})
但是,我的浏览器中的网络选项卡显示,当请求以200响应代码发送时,响应没有内容,是0字节等等。
基本上,我无法弄清楚我做错了什么......
我真的可以这样做吗?我遇到了一些跨域脚本类型的东西吗?
答案 0 :(得分:1)
这就是应该在模板中处理脚本的方式。
app.directive('directive', function () {
return {
template: '<script src="404.js"><\/script>' +
'<script>console.log("inline script");<\/script>',
link: function (element, attrs) {
var scripts = element.find('script');
angular.forEach(scripts, function (script) {
script = angular.element(script);
var type = script.attr('type');
var src = script.attr('src');
if (type && !type.match(/^(?:text|application)\/javascript$/i))
return;
var scriptFixed = angular.element('<script>');
if (src) {
scriptFixed.attr('src', src);
} else {
scriptFixed.text(script.text());
}
script.replaceWith(scriptFixed);
});
}
};
});
使用$ http请求脚本时,您显然会遇到XSS问题。