• jsonp跨域问题


    .jsonp跨域:jsonp跨域只支持get请求

        1.可以使用script标签实现jsonp跨域

        <script src="http://www.haohao.com?callback=showdata"></script>

      callback是服务器获取回调函数的参数字段,showdata是在浏览器定义的方法,服务器会返回showdata(参数);也就是showdata函数的执行语句,浏览器接收到响应后会执行这个语句,那么也就相当于执行了showdata方法。

    2.使用ajax实现jsonp跨域。

      返回响应后,如果没有设置jsonpCallback会执行success方法,如果设置了,则会执行showdata方法(必须是window下的showdata方法,如果改方法在其他对象或函数里则不执行)然后执行success方法,

      $.ajax({
           url:"http://127.0.0.1:8888/",           
            type : 'get',
            dataType: "jsonp",   //指定服务器的返回类型
            jsonp: "callback",  //获取回调函数的参数名称
            jsonpCallback:"showdata",  //回调函数
            success:function(res){
                console.log(res);
            },
            error : function (xhr){
                console.log(xhr);
            }
        });
    

      要实现jsonp跨域,需要服务器端的支持,服务器端需要根据参数获取到回调函数名称,然后返回该回调的执行语句,并传入返回的数据。

     protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
     2     response.setCharacterEncoding("UTF-8");
     3     response.setContentType("text/html;charset=UTF-8");
     4 
     5     //数据
     6     List<Student> studentList = getStudentList();
     7 
     8 
     9     JSONArray jsonArray = JSONArray.fromObject(studentList);
    10     String result = jsonArray.toString();
    11 
    12     //前端传过来的回调函数名称
    13     String callback = request.getParameter("callback");
    14     //用回调函数名称包裹返回数据,这样,返回数据就作为回调函数的参数传回去了
    15     result = callback + "(" + result + ")";
    16 
    17     response.getWriter().write(result);
    18 }
    

      在服务器中跨域还需要设置响应头信息以支持跨域请求不被浏览器拦截

    response.writeHead(200, {
         response.writeHead(200, {
         "access-control-allow-origin": "*",
         "access-control-allow-methods": "GET, POST, PUT, DELETE, OPTIONS",
         "access-control-allow-headers": "content-type, accept", 
         'Content-Type': 'text/plain'
       });
     });
    

      

        

  • 相关阅读:
    hdu 2897 巴什博弈变形
    hdu 2516 FIB博弈模型
    zoj 1904 Beavergnaw 计算圆柱和圆台的体积
    zoj 1806 This Takes the Cake 计算凸四边形和三角形的面积
    zoj 1608 Two Circles and a Rectangle 判断两个圆是否能放入一个矩形中
    zoj 1439 Area Ratio 计算三角形内接圆面积和外接圆面积之比
    zoj 1199 Point of Intersection 求两个圆公切线的交点
    poj 1584 A Round Peg in a Ground Hole 判断多边形是否为凸多边形 + 圆心是否在凸多边形内 + 圆是否在凸多边形内部
    Django-Xadmin
    Django组件-分页器
  • 原文地址:https://www.cnblogs.com/BlingSun/p/9002354.html
Copyright © 2020-2023  润新知