jsonp跨域请求实现示例


Posted in Javascript onMarch 13, 2017

网上看了很多关于jsonp的资料,发现在本机运行后实现不了,有的是有错漏,有的是说的比较含糊,接合自己的情况,整了一个可运行的示例;

前言:

ajax请求地址:http://192.168.1.102:8080/carop/jsonp

服务端要返回的jsonp字符串:jsonpCallback({"name":"刘德华","电话":"17688888888"})

jsonp写法,写法上可以理解成一个javascript函数的执行,例如alert("hello world")会弹出hello world的窗口,再例如alert({"name":"刘德华"})会弹出[object Object]的窗口。(注意这里参数两端没加双引号,它是一个有属性的对象而不是一个字符串)

那么本示例的jsonp中,可以将jsonpCallback理解成函数名,{"name":"刘德华","电话":"17688888888"}这个对象是这个函数执行时所要传递的参数。

客户端:

$.ajax({
       type: "get",
       async:false,
url: "http://192.168.1.102:8080/carop/jsonp",
       dataType: "jsonp",
jsonpCallback:"jsonpCallback",       
       success: function(data){
       alert(data.name+"\n "+data.tel);
       }
     });

其他的ajax方法比如getjson亦可,写法上有区别,这里仅采用一种方法。

说明:jsonpCallback:"jsonpCallback",前一个ajax参数表示要执行的函数,后面的”jsonpCallback“,这个是服务器返回jsonp的javascript函数名。(网上有相关资料这个参数写的是jsonp而不是jsonpCallback,经实际测试要写成jsonpCallback,jquery版本1.8,所测试浏览器为火狐和edge)

服务端

servlet控制器层直接返回jsonp;

import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
@WebServlet("/jsonp")
public class jsonp extends HttpServlet{
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp)
 throws ServletException, IOException {
 resp.setCharacterEncoding("UTF-8");
 //System.out.println("进入jsonp");
 resp.setContentType("text/json;charset=utf-8");
 String json="{\"name\":\"刘德华\",\"tel\":\"17688888888\"}";
 String jsonp="jsonpCallback("+json+")";
 PrintWriter pw=resp.getWriter();
 System.out.println(jsonp);
 pw.print(jsonp);
}
@Override
 protected void doPost(HttpServletRequest req, HttpServletResponse resp)
  throws ServletException, IOException {
 // TODO Auto-generated method stub
 doGet(req, resp);
 }
}

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
根据对象的某一属性进行排序的js代码(如:name,age)
Aug 10 Javascript
在Javascript里访问SharePoint列表数据的实现方法
May 22 Javascript
jquery实现鼠标点击后展开列表内容的导航栏效果
Sep 14 Javascript
JavaScript知识点总结(五)之Javascript中两个等于号(==)和三个等于号(===)的区别
May 31 Javascript
JS数组搜索之折半搜索实现方法分析
Mar 27 Javascript
Vue学习笔记进阶篇之vue-router安装及使用方法
Jul 19 Javascript
关于ES6箭头函数中的this问题
Feb 27 Javascript
原生JavaScript实现todolist功能
Mar 02 Javascript
解决node.js含有%百分号时发送get请求时浏览器地址自动编码的问题
Nov 20 Javascript
关于vue-cli3打包代码后白屏的解决方案
Sep 02 Javascript
js实现简单的轮播图效果
Dec 13 Javascript
Vue实现跑马灯样式文字横向滚动
Nov 23 Vue.js
使用openSpeDiv方法实现Ecshop登录弹窗框效果
Mar 13 #Javascript
H5实现中奖记录逐行滚动切换效果
Mar 13 #Javascript
jQuery实现页面倒计时并刷新效果
Mar 13 #Javascript
JS实现的简单拖拽功能示例
Mar 13 #Javascript
jQuery中layer分页器的使用
Mar 13 #Javascript
如何理解jQuery中的ajaxSubmit方法
Mar 13 #Javascript
Node.js调试技术总结分享
Mar 12 #Javascript
You might like
使用PHP生成二维码的两种方法(带logo图像)
2014/03/14 PHP
php curl请求信息和返回信息设置代码实例
2015/04/27 PHP
php 删除一维数组中某一个值元素的操作方法
2018/02/01 PHP
php支付宝系列之电脑网站支付
2018/05/30 PHP
PHP实现简单登录界面
2019/10/23 PHP
js各种验证文本框输入格式(正则表达式)
2010/10/22 Javascript
Jquery实现的tab效果可以指定默认显示第几页
2013/10/16 Javascript
jQuery瀑布流插件Wookmark使用实例
2014/04/02 Javascript
JavaScript实现判断图片是否加载完成的3种方法整理
2015/03/13 Javascript
jquery实现简单的无缝滚动
2015/04/15 Javascript
整理Javascript数组学习笔记
2015/11/29 Javascript
JavaScript类型系统之Object详解
2016/01/07 Javascript
jQuery添加和删除输入文本框标签代码
2016/05/20 Javascript
BootStrap按钮标签及基本样式
2016/11/23 Javascript
AngularJS集合数据遍历显示的实例
2017/12/27 Javascript
angular学习之动态创建表单的方法
2018/12/07 Javascript
vue项目中使用vue-i18n报错的解决方法
2019/01/13 Javascript
axios实现简单文件上传功能
2019/09/25 Javascript
解决python写的windows服务不能启动的问题
2014/04/15 Python
Windows和Linux下使用Python访问SqlServer的方法介绍
2015/03/10 Python
将Python代码嵌入C++程序进行编写的实例
2015/07/31 Python
深入解析Python中的线程同步方法
2016/06/14 Python
Django ORM框架的定时任务如何使用详解
2017/10/19 Python
利用Python循环(包括while&for)各种打印九九乘法表的实例
2017/11/06 Python
Python3之文件读写操作的实例讲解
2018/01/23 Python
详解利用django中间件django.middleware.csrf.CsrfViewMiddleware防止csrf攻击
2018/10/09 Python
图文详解python安装Scrapy框架步骤
2019/05/20 Python
使用css如何制作时间ICON方法实践
2012/11/12 HTML / CSS
女孩每月服装订阅盒:kidpik
2019/04/17 全球购物
Delphi笔试题
2016/11/14 面试题
便利店投资创业计划书
2014/02/08 职场文书
家长会演讲稿
2014/04/26 职场文书
关于建议书的格式范文
2014/05/20 职场文书
我爱幼儿园演讲稿
2014/09/11 职场文书
公司联欢会主持词
2015/07/04 职场文书
Python-OpenCV教程之图像的位运算详解
2021/06/21 Python