JSONP之我见


Posted in Javascript onMarch 24, 2015

JavaScript初学,一点自己的理解,有不当之处请大家指正~

JSONP:

本地html文件要获取xxx网站(跨域)数据时使用的方法。

跨域问题:

外部服务器的数据只能用外部服务器中的js访问,本地js无法用XMLHttpRequest()访问。

外部服务器中的Web服务提供JSON数据,比如在http://gumball.wickedlysmart.com/中,数据包含在函数updateSales中作为参数,现在要在本地html中访问外部服务器中的JSON数据该怎么办呢?

1, 查看Web服务文档,明确服务实际使用的参数名(本例只有一个参数即一个对象数组);
2, 在url中指定一个回调函数,http://gumball.wickedlysmart.com/?callback=updateSales,用来指定Web服务中访问JSON数据的函数名;
3, 在本地js文件中使用刚才定义的函数名创建函数updateSales(对象),编写处理得到外部JSON数据的方法;
4, 在html文件中的<body>标签下使用<script>标签链接到外部Web服务,url为2中的那个路径。

总结:

JSONP目的在于提供给本地html一个函数接口(本地html可通过在url后方加入?callback=functionName的方法指定函数名),为了确保数据访问的安全,服务器将安全的数据放在回调函数的参数中,函数内部的参数就是服务器提供给本地的数据,至于怎么使用这些数据就要在本地的js中定义这个callback函数了。

注意:本地使用JSONP请求访问Web服务,可能会获取不安全的Js代码,所以要确保信任这个Web服务。

JSONP与XMLHttpRequest:

         XMLHttpRequest用于开发内部Web服务,内部访问内部,同域访问会更加简便。

         访问外部数据时(跨域访问)就要使用JSONP。

以上所述就是本文的全部内容了,希望大家能够喜欢,能够对大家学习jsonp有所帮助。

Javascript 相关文章推荐
Jquery时间验证和转换工具小例子
Jul 01 Javascript
JS取得绝对路径的实现代码
Jan 16 Javascript
实现音乐播放器的代码(html5+css3+jquery)
Aug 04 Javascript
jQuery通过ajax方法获取json数据不执行success的原因及解决方法
Oct 15 Javascript
如何理解jQuery中的ajaxSubmit方法
Mar 13 Javascript
详解angular中的作用域及继承
May 31 Javascript
javascript 作用于作用域链的详解
Sep 27 Javascript
javaScript动态添加Li元素的实例
Feb 24 Javascript
vue-router路由懒加载的实现(解决vue项目首次加载慢)
Aug 28 Javascript
基于Angular中ng-controller父子级嵌套的相关属性详解
Oct 08 Javascript
vue+element搭建后台小总结 el-dropdown下拉功能
Apr 10 Javascript
OpenLayers3实现对地图的基本操作
Sep 28 Javascript
JavaScript将数字转换成大写中文的方法
Mar 23 #Javascript
自定义jQuery插件方式实现强制对象重绘的方法
Mar 23 #Javascript
jQuery定义背景动态切换效果的方法
Mar 23 #Javascript
javascript实现客户端兼容各浏览器创建csv并下载的方法
Mar 23 #Javascript
jQuery实现拖拽效果插件的方法
Mar 23 #Javascript
jQuery操作表单常用控件方法小结
Mar 23 #Javascript
JavaScript自定义等待wait函数实例分析
Mar 23 #Javascript
You might like
PhpMyAdmin中无法导入sql文件的解决办法
2010/01/08 PHP
PHP删除数组中的特定元素的代码
2012/06/28 PHP
PHP中基于ts与nts版本- vc6和vc9编译版本的区别详解
2013/04/26 PHP
PHP随机数 C扩展随机数
2016/05/04 PHP
PHP错误和异常处理功能模块示例
2016/11/12 PHP
thinkPHP5项目中实现QQ第三方登录功能
2017/10/20 PHP
javascript取消文本选定的实现代码
2010/11/14 Javascript
MyEclipse取消验证Js的两种方法
2013/11/14 Javascript
javascript常用的方法整理
2015/08/20 Javascript
js入门之Function函数的使用方法【新手必看】
2016/11/22 Javascript
jquery.zclip轻量级复制失效问题
2017/01/08 Javascript
vue-router懒加载速度缓慢问题及解决方法
2018/11/25 Javascript
微信小程序textarea层级过高的解决方法
2019/03/04 Javascript
小程序按钮避免多次调用接口和点击方案实现(不用showLoading)
2020/04/15 Javascript
JavaScript交换变量常用4种方法解析
2020/09/02 Javascript
Vue +WebSocket + WaveSurferJS 实现H5聊天对话交互的实例
2020/11/18 Vue.js
跟老齐学Python之再深点,更懂list
2014/09/20 Python
python自定义解析简单xml格式文件的方法
2015/05/11 Python
Python基于QRCode实现生成二维码的方法【下载,安装,调用等】
2017/07/11 Python
python实现朴素贝叶斯分类器
2018/03/28 Python
Django 浅谈根据配置生成SQL语句的问题
2018/05/29 Python
python人民币小写转大写辅助工具
2018/06/20 Python
influx+grafana自定义python采集数据和一些坑的总结
2018/09/17 Python
python模糊图片过滤的方法
2018/12/14 Python
python中import与from方法总结(推荐)
2019/03/21 Python
Python 中由 yield 实现异步操作
2020/05/04 Python
新百伦折扣店:Joe’s New Balance Outlet
2016/08/20 全球购物
优衣库澳大利亚官网:UNIQLO澳大利亚
2017/01/18 全球购物
摩托车和ATV零件、配件和服装的首选在线零售商:MotoSport
2017/12/22 全球购物
比驿:全球酒店比价网
2018/06/20 全球购物
药剂学专业应届生自荐信
2013/09/29 职场文书
音乐学院硕士生的自我评价分享
2013/11/01 职场文书
公共机构节能宣传周活动总结
2014/07/09 职场文书
2014保险公司内勤工作总结
2014/12/16 职场文书
工作简报格式范文
2015/07/21 职场文书
python如何将mat文件转为png
2022/07/15 Python