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 相关文章推荐
优秀js开源框架-jQuery使用手册(1)
Mar 10 Javascript
js Html结构转字符串形式显示代码
Nov 15 Javascript
Web Inspector:关于在 Sublime Text 中调试Js的介绍
Apr 18 Javascript
javascript通过navigator.userAgent识别各种浏览器
Oct 25 Javascript
javascript实现类似于新浪微博搜索框弹出效果的方法
Jul 27 Javascript
window.setInterval()方法的定义和用法及offsetLeft与style.left的区别
Nov 11 Javascript
纯JS代码实现一键分享功能
Apr 20 Javascript
使用jQuery处理AJAX请求的基础学习教程
May 10 Javascript
vue 和vue-touch 实现移动端左右导航效果(仿京东移动站导航)
Apr 22 Javascript
vue使用v-if v-show页面闪烁,div闪现的解决方法
Oct 12 Javascript
深度了解vue.js中hooks的相关知识
Jun 14 Javascript
vue的滚动条插件实现代码
Sep 07 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
深入解析php中的foreach问题
2013/06/30 PHP
php实现图片添加描边字和马赛克的方法
2014/12/10 PHP
Laravel中Trait的用法实例详解
2016/03/16 PHP
php自定义函数实现统计中文字符串长度的方法小结
2017/04/15 PHP
Javascript 类与静态类的实现(续)
2010/04/02 Javascript
javascript forEach通用循环遍历方法
2010/10/11 Javascript
js的写法基础分析
2011/01/17 Javascript
用Jquery.load载入页面后样式没了页面混乱的解决方法
2014/10/20 Javascript
JS实现跟随鼠标闪烁转动色块的方法
2015/02/26 Javascript
JS+CSS实现Div弹出窗口同时背景变暗的方法
2015/03/04 Javascript
jQuery使用hide方法隐藏页面上指定元素的方法
2015/03/30 Javascript
网页中JS函数自动执行常用三种方法
2016/03/30 Javascript
node.js + socket.io 实现点对点随机匹配聊天
2017/06/30 Javascript
angular.js中解决跨域问题的三种方式
2017/07/12 Javascript
vue监听scroll的坑的解决方法
2017/09/07 Javascript
jQuery实现列表的增加和删除功能
2018/06/14 jQuery
jQuery实现checkbox全选功能完整实例
2018/07/12 jQuery
JS实现百度网盘任意文件强制下载功能
2018/08/31 Javascript
解决Vue使用swiper动态加载数据,动态轮播数据显示白屏的问题
2018/09/27 Javascript
JavaScript实现星级评价效果
2019/05/17 Javascript
JavaScript Array对象基本方法详解
2019/09/03 Javascript
Layui给switch添加响应事件的例子
2019/09/03 Javascript
python创建和使用字典实例详解
2013/11/01 Python
利用python画一颗心的方法示例
2017/01/31 Python
python条件变量之生产者与消费者操作实例分析
2017/03/22 Python
Python实现按照指定要求逆序输出一个数字的方法
2018/04/19 Python
python爬取内容存入Excel实例
2019/02/20 Python
Django model update的多种用法介绍
2020/03/28 Python
keras的load_model实现加载含有参数的自定义模型
2020/06/22 Python
css3实现冲击波效果的示例代码
2018/01/11 HTML / CSS
美国宠物美容和宠物用品购物网站:Cherrybrook
2018/12/07 全球购物
中学生在校期间的自我评价分享
2013/11/13 职场文书
企业内部培训方案
2014/02/04 职场文书
中秋节国旗下演讲稿
2014/09/13 职场文书
立春观后感
2015/06/18 职场文书
老人院义工活动感想
2015/08/07 职场文书