个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
26
4
编辑:已解决，请参阅下面的答案。
我试图解决的问题是一个广告加载脚本，它使用 jsonp 加载广告代码并将其插入到 dom 中。
现在，有时广告代码会包含 javascript 标签，从 stackoverflow 上的一些帖子中，我想到将它们移动到文档的头部以使它们运行，经过一些实验后促使我提出这个问题:
Appending scripts to head using javascript - weird behavior
我的问题已经解决，但问题仍然存在，我插入测试 div 的脚本没有运行，移动到头部时也没有运行。
我这里有一个代码示例:
这里有一个简单的 jsonp 示例:
p2 中的代码将尝试将消息记录到控制台，发出警报消息，并设置一个变量，然后我尝试打印该变量，但所有这些都失败了。
是使用 eval 函数运行这样的代码的唯一方法还是我犯了一些基本错误？
这是第一部分的代码:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
if (typeof JSONP === 'undefined') {
/*Lightweight JSONP fetcher - www.nonobtrusive.com*/
var JSONP = (function(){
var counter = 0, head, query, key, window = this;
function load(url) {
var script = document.createElement('script'),
done = false;
script.src = url;
script.async = true;
script.onload = script.onreadystatechange = function() {
if ( !done && (!this.readyState || this.readyState === "loaded" || this.readyState === "complete") ) {
done = true;
script.onload = script.onreadystatechange = null;
if ( script && script.parentNode ) {
script.parentNode.removeChild( script );
}
}
};
if ( !head ) {
head = document.getElementsByTagName('head')[0];
}
head.appendChild( script );
}
function jsonp(url, params, callback) {
query = "?";
params = params || {};
for ( key in params ) {
if ( params.hasOwnProperty(key) ) {
query += encodeURIComponent(key) + "=" + encodeURIComponent(params[key]) + "&";
}
}
var jsonp = "json" + (++counter);
window[ jsonp ] = function(data){
callback(data);
window[ jsonp ] = null;
try {
delete window[ jsonp ];
} catch (e) {}
};
load(url + query + "callback=" + jsonp);
return jsonp;
}
return {
get:jsonp
};
}());
}
JSONP.get( 'http://m.iijax.com/p2.php', { requestType:'demoRequest'}, function(data){
var adC = document.getElementById("testId");
adC.innerHTML = data.code;
// Move script tags to head
var scripts = adC.getElementsByTagName("script");
for(i=scripts.length - 1;i>-1;i--) {
document.head.appendChild(scripts[i]);
}
// Now check value of var letsSeeIfThisIsDefined, set in the fetched code
console.log(letsSeeIfThisIsDefined);
});
</script>
</head>
<body>
<div id="testId"></div>
</body>
</html>
最佳答案
答案似乎有点臃肿。这是my version :
function execJSONP(url, cb) {
var script = document.createElement('script');
script.async = true;
var callb = 'exec'+Math.floor((Math.random()*65535)+1);
window[callb] = function(data) {
var scr = document.getElementById(callb);
scr.parentNode.removeChild(scr);
cb(data);
window[callb] = null;
delete window[callb];
}
var sepchar = (url.indexOf('?') > -1)?'&':'?';
script.src = url+sepchar+'callback='+callb;
script.id = callb;
document.getElementsByTagName('head')[0].appendChild(script);
}
关于javascript - 运行使用 jsonp 获取的脚本标签，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/6789502/
26
4
0
如果可能的话，我想在答案中举一个具体的例子。 为了解释起见，我们这里有三个玩家。 我的服务器 (myserver.com) 客户端服务器 (myclient.com) 客户用户(通过 myclient
我想通过 JSONP 提供 Web 服务，并且想知道是否需要清理回调参数中的值。 我当前的服务器端脚本目前看起来像这样(或多或少。代码在 PHP 中，但实际上可以是任何东西。): header("Co
我有一个每分钟更新一次数据的 Web 服务器，并且希望使该数据可供所有类型的客户端使用。为了减少带宽，我使用 IF-MODIFIED-SINCE 和/或 IF-NONE-MATCH 设置 PHP 脚本
关闭。这个问题是opinion-based 。目前不接受答案。 想要改进这个问题吗？更新问题，以便 editing this post 可以用事实和引文来回答它。 . 已关闭 7 年前。 Improv
我正在努力使用 vue-resource 发出 JSONP 请求。任何人都可以提供一些工作示例来演示定义 jsonp 回调、处理 Vue 组件中的调用等的正确方法。 谢谢 **编辑:**对于其他人，让
我正在尝试获取 AngularJS 中 rest api 的 JSON 输出。以下是我面临的问题: Rest api url 中有端口号，AngularJS 为变量插入端口号。为此，我尝试了多种解决方
代码: 当我在浏览器中输入网址时，我可以看到所有对象，例如: link 但我似乎无法让它在我的代码中工作，我是否遗漏了什么？ angular.module('ionicApp', ['ionic']
我在连接最近了解 JSONP 的一些点时遇到了麻烦。这是我的理解: 由于同源策略，禁止任何内容(包括 JSON)的跨域 XmlHttpRequests。这可以防止 XSRF。 您可以拥有一个带有返回
我正在使用 JSONP 进行 Ajax 调用以从第三方(与我的站点不同的域)获取 JSON 数据，它在 Chrome 和 Firefox 上工作但在 IE 上失败(9 和 10 是我试过的版本) .在
django rest 框架发行说明声称在 0.3.0 中重新添加了 JSONP 支持。我还在框架中找到了一个 JSONPRenderer 类。但是，我似乎找不到有关如何使用该东西的任何文档.....
我有一个使用 JSONP 的 WCF 服务(托管在 Azure 中)。它在 HTTP 上工作得很好，即，如果它仅接收 JSON，则仅返回 JSON，如果它接收 JSONP，则返回 JSONP。但是，一
有人知道为什么我的ajax失败吗？ 我从这里通过 JSONP 获取数据: JSON Data 您可以使用此代码，并注意“警报”如何永远不会执行: $(document).ready(function(
我正在使用 jaubourg 的 jquery-jsonp module从与我的网站所在的域不同的域中获取数据。我从 jQuery 的 ajax 开始使用这个模块函数不支持 JSONP 请求的错误处理
我有一个使用 Jquery Mobile 制作移动 Web 应用程序的项目。我希望我的应用程序能够使用来自跨域 REST Web 服务的数据。很多人说用JSONP。但我仍然困惑如何使用它以及如何构建支
我正在使用 Angular 的 $http.jsonp() 请求，它成功返回了包含在函数中的 json: var url = "http://public-api.wordpress.com/rest
基于 Please explain JSONP ，我知道可以使用 JSONP 来绕过同源策略。 但是为了做到这一点，页面必须使用 标签。 我知道页面可以动态地发出新的脚本标签，例如: docum
在 jQuery 中使用 JSONP 时是否可能捕获错误？我已经尝试了 $.getJSON 和 $.ajax 方法，但都不会捕获我正在测试的 404 错误。这是我尝试过的方法(请记住，这些都可以成功运
我正在为一个带有嵌入推文的页面使用内容安全策略，我收到了 https://cdn.syndication.twimg.com 的报告。 ，这在我的政策中是不允许的。 这是一个很长的政策，但相关部分
使用 mootools 和 JsonP 我在 Firefox 错误控制台中收到“无效标签”错误 JsonP 似乎可以工作(我正确地获取了数据) {"jsondata":[{"title":"title
JSONP (JSON with Padding) 是 JSON 的一种 使用模式，可以让网页从别的网站那获取数据，即跨域读取数据 为什么我们从不同的域（网站）访问数据需要一个特殊的技术(JSONP
我是一名优秀的程序员,十分优秀！