jsonp跨域请求实现示例

网上看了很多关于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);
 }
}

以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，同时也希望多多支持！

# jsonp # 跨域请求 # 实例讲解使用原生JavaScript处理AJAX请求的方法 # 原生js jquery ajax请求以及jsonp的调用方法 # 详解JavaScript原生封装ajax请求和Jquery中的ajax请求 # 原生javascript的ajax请求及后台PHP响应操作示例 # Javascript原生ajax请求代码实例 # 轻松搞定jQuery+JSONP跨域请求的解决方案 # JavaScript用JSONP跨域请求数据实例详解 # Ajax jsonp跨域请求实现方法 # JSONP跨域请求实例详解 # 详细解密jsonp跨域请求 # JSONP跨域请求 # 原生js实现ajax请求和JSONP跨域请求操作示例 # 弹出 # 服务端 # 自己的 # 的是 # 而不是 # 看了 # 是有 # 网上 # 其他的 # 上有 # 它是 # 是说 # 火狐 # 相关资料 # 所要 # 本机 # 亦可 # 要写 # 客户端 # 双引号

返回目录在线咨询

上一篇：php怎么判断一维数组键名不存在_php判断键名不存在array_key_exists法【教程】
下一篇：傻瓜式本地建站软件：怎样选择合适的模板来设计网站？

您的项目需求

*请认真填写需求信息，我们会在24小时内与您取得联系。

全网整合营销服务商

jsonp跨域请求实现示例

您的项目需求