jsonp 全称是JSON with Padding

我们大家都知道ajax是不能发起跨域请求,现在可以通过jsonp来弥补ajax的这一缺陷

通过script标签的src属性就可以实现跨域请求。如(CDN)现在的互联网调优,引用goole,百度等的常用js文件,通过浏览器的缓存机制可以实现互联网调优。

下面是原生js实现跨域请求,走码

方式一:
<script type="text/javascript" src="http://localhost:23415/2012Test/testJasonp.ashx?callback=mycallback"></script><!--这里的地址指跨域地址-->
方式二:
<script type="text/javascript">
function createScript()
{
var myScript = document.createElement("script");
myScript.setAttribute("type", "text/javascript");
myScript.setAttribute("src", "http://localhost:23415/2012Test/testJasonp.ashx?callback=mycallback");
document.body.appendChild(myScript);
} function mycallback(data)
{
alert(data.msg);
} window.onload = function () {
document.getElementById("getOtherDomainData").addEventListener("click", function () {
createScript();
});
}
</script>
<input type="button" id="getOtherDomainData" value="发起跨域请求" /> //testJasonp.ashx返回的数据为context.Response.Write("mycallback({\"msg\":\"ok\"})");

当然通过jquery就可以轻易实现jsonp

 $(function () {
$("#jqGetOtherDomainData").click(function () {
$.ajax({
type: "GET", url: 'http://localhost:23415/2012Test/testJasonp.ashx', dateType: "jsonp", jsonp: "mycallback", success: function (data) {
alert(data.msg);
}
});
}); });

认识JSONP的更多相关文章

  1. 实例操作JSONP原理

    絮语:按这个步骤走,你就会明白JSONP是什么鬼. 1.工程目录: ng-mywork demo.html test.js 2.nginx的server配置 server { listen ; ser ...

  2. angular2系列教程(九)Jsonp、URLSearchParams、中断选择数据流

    大家好,今天我们要讲的是http模块的第二部分,主要学习ng2中Jsonp.URLSearchParams.observable中断选择数据流的用法. 例子

  3. 疯狂的JSONP

    何为跨域?何为JSONP?JSONP技术能实现什么?是否有必要使用JSONP技术? 跨域 就是由于JavaScript同源策略的限制,使得a.com域名下的js无法操作b.com或c.a.com域名下 ...

  4. 通过扩展让ASP.NET Web API支持JSONP

    同源策略(Same Origin Policy)的存在导致了"源"自A的脚本只能操作"同源"页面的DOM,"跨源"操作来源于B的页面将会被拒 ...

  5. 跨域的jsonP

    1.出现原因:因为web中的同源策略(域名,协议,端口号)限制了跨域访问.   2.区别于json (个人理解)json是数据交换格式,jsonp是数据通信中的交互方式   3.jsonp的get与p ...

  6. ASP.NET Web API 配置 JSONP

    之前的一篇博文:jsonp跨域+ashx(示例) 1. 安装 Jsonp 程序集: PM> Install-Package WebApiContrib.Formatting.Jsonp PM&g ...

  7. 原生JS封装Ajax插件(同域&&jsonp跨域)

    抛出一个问题,其实所谓的熟悉原生JS,怎样的程度才是熟悉呢? 最近都在做原生JS熟悉的练习... 用原生Js封装了一个Ajax插件,引入一般的项目,传传数据,感觉还是可行的...简单说说思路,如有不正 ...

  8. 跨域之jsonp

    我们都知道使用<script>标签可以引入外部的JS文件,即使这个JS文件来自于其他的网站,比如我们引用存放在网络服务器上的jQuery框架.在这个过程中,我们已经实现跨域访问.像< ...

  9. 由浅入深学习ajax跨域(JSONP)问题

    什么是跨域?说直白点就是获取别人网站上的内容.但这么说貌似又有点混淆,因为通常我们用ajax+php就可以获取别人网站的内容,来看下面这个例子. 来看看跨域的例子,jquery+ajax是不能跨域请求 ...

  10. JSONP的诞生、原理及应用实例

    问题: 页面中有一个按钮,点击之后会更新网页中的一个盒子的内容. Ajax可以很容易的满足这种无须刷新整个页面就可以实现数据变换的需求. 但是,Ajax有一个缺点,就是他不允许跨域请求资源. 如果我的 ...

随机推荐

  1. Python初学

    经同学推荐,学习了下Python语言,看Python的介绍,它本身是一个面向对象的解释型脚本语言,我初看到这句话的时候就在想,一个脚本语言还搞成面向对象?有这个必要么?原谅我肤浅了一把. 它还被俗称为 ...

  2. toJOSN()方法

    toJSON方法可以作为函数过滤器的补充.序列化的顺序如下: (1)如果存在toJSON方法而且能够通过它取得有效值,则调用该方法. (2)如果提供了第二个参数,应用该函数过滤器.传入过滤器的值是步骤 ...

  3. mysql存储过程实践总结

    一:参数类型 1.IN 只能读取参数并在函数内部更改有效,不能持久化到外部变量 2.OUT  不能读取参数,可以在函数内部修改并保存到外部变量 3.INOUT 既能读取又能持久化 二:基本格式 mys ...

  4. Android中的消息机制:Handler消息传递机制

    参考<疯狂android讲义>第2版3.5 P214 一.背景 出于性能优化考虑,Android的UI操作并不是线程安全的,这意味着如果有多个线程并发操作UI组件,可能导致线程安全问题.为 ...

  5. phpexcel导入excel文件报the filename xxx is not recognised as an OLE file错误。

    工作中频繁会用phpexcel类导入excel文件的数据到数据库,目前常用的excel文件格式有:xls.csv.xlsx. 刚开始,针对xls文件,使用如下程序,能正常运行: $objReader ...

  6. Ubunu下安装mongoDB

    mongoDB有两种安装模式: 1. 源码安装 wget http://fastdl.mongodb.org/linux/mongodb-linux-x86_64-2.2.0.tgz tar zxvf ...

  7. C语言基础10

    栈区间:在函数内部声明的变量都存放在栈区间,比如int char 数组 结构体 指针,只管申请,系统会自动帮我们回收,收回的时间是作用域结束之后,遵循的原则是"先进后出". int ...

  8. gcc编译通过,运行却显示“段错误”的解决方法

    ​第一次在Liunx上(liunx mint 17)使用gcc编译c文件,竟然提示“找不到stdio.h",经过google后发现执行 sudo apt-get install build- ...

  9. android Unable to resolve target 'android-XX'错误和conversion to dalvik format failed with error 1错误

    当用eclipse 导入一个已经存在的项目时,经常会遇见:Unable to resolve target 'android-XX' 类似的错误.这是因为导入的项目代码中project.propert ...

  10. 对Qt for Android的评价(很全面,基本已经没有问题了,网易战网客户端就是Qt quick写的),可以重用QT积累20年的RTL是好事,QML效率是HTML5的5倍

    现在Qt不要光看跨平台了,Qt也有能力和原生应用进行较量的.可以直接去Qt官网查看他和那些厂商合作.关于和Java的比较,框架和Java进行比较似乎不且实际.如果是C++和Java比较,网上有很多文章 ...