Jsonp其实就是一个跨域解决方案。

Js跨域请求数据是不可以的,但是js跨域请求js脚本是可以的

所以可以把要请求的数据封装成一个js语句,做一个方法的调用。

跨域请求js脚本可以得到此脚本。得到js脚本之后会立即执行。

可以把数据做为参数传递到方法中。就可以获得数据。从而解决跨域问题。

jsonp原理:

浏览器在js请求中,是允许通过script标签的src跨域请求,可以在请求的结果中添加回调方法名,在请求页面中定义方法,既可获取到跨域请求的数据。

淘淘商城的理解:

在taotao-portal中访问taotao-rest中的category数据,

一个是8082的端口,一个是8081的端口,同一个域名,但是端口不一样,所以跨域访问数据是不可以的。可以利用上面的jsonp的方式来进行访问。

在js中定义一个url,用于访问服务上面的category.json的数据,这样子是获取不到数据的

定义一个方法利用script的方式获取脚本

将category的数据封装成一个js类型的语句,它调用一个js的方法,即最后一个图的方法,在调用方法时将参数传递过去。

js脚本中的参数传递过来,获取到数据,在回调方法中获取数据即可。

什么是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. ssh配置文件ssh_config和sshd_config区别

    问题描述:在一次配置ssh端口和秘钥登录过程中,修改几次都没有成功.最后发现修改的是ssh.config,原因是习惯tab一下,实在是眼拙! ssh_config和sshd_config配置文件区别: ...

  2. 现代软件工程 第十六章 【IT 行业的创新】练习与讨论

    16.6.0  Xerox Parc 的成功创新和推向市场的失败 http://research.microsoft.com/en-us/um/people/blampson/Slides/AltoA ...

  3. Oracle:高效插入大量数据经验之谈

    来源于:http://www.cnblogs.com/liwenzhen238/p/3610518.html 在很多时候,我们会需要对一个表进行插入大量的数据,并且希望在尽可能短的时间内完成该工作,这 ...

  4. 对象关系映射ORM

    对象关系映射(英语:Object Relational Mapping,简称ORM,或O/RM,或O/R mapping),是一种程序技术,用于实现面向对象编程语言里不同类型系统的数据之间的转换.从效 ...

  5. oracle中SET DEFINE意思

    et define off关闭替代变量功能 在SQL*Plus中默认的"&"表示替代变量,也就是说,只要在命令中出现该符 号,SQL*Plus就会要你输入替代值.这就意味着 ...

  6. iOS开发中的错误整理,pod文件Install失败

    一.之前用黑苹果,编辑pod文件用一下格式 platform :ios, "8.0" pod "MJExtension" pod "MJRefresh ...

  7. Region的周长, 面积与紧凑程度

    Perimeter 边界长度. 计算方式跟边界的表示方式有关 Area 包含的点的个数 Compactness 两种常用的计算方式 \(\frac {perimeter^2}{area}\). cir ...

  8. 二、处理MVC多级目录问题——以ABP为基础架构的一个中等规模的OA开发日志

    就个人感觉而言.ASP.NET MVC是一种非常反人类的设计.(我没有接触过Java的MVC,不知道两者是否一样.如果一样,那么搞Java的同学也挺可怜.)尤其是MVC的路由机制,灰常灰常反动.路由所 ...

  9. Html-Css标签lable中定义宽度需要其他的支持

    lable的标签如果定义了width,如果要使起生效,则需要定义display width: 130px; display: inline-block;

  10. 华硕笔记本BIOS设置详解

    BIOS是英文Basic Input/Output System的缩写,即基本输入输出系统,合理的BIOS设置可以让我们的电脑更好的为我们服务,但由于大部分笔记本的BIOS界面是英文,并且BIOS里面 ...