• Java跨域问题的处理


      1,JavaScript由于安全性方面的考虑,不允许页面跨域调用其他页面的对象,那么问题来了,什么是跨域问题?

      答:这是由于浏览器同源策略的限制,现在所有支持JavaScript的浏览器都使用了这个策略。那么什么是同源呢?所谓的同源是指三个方面“相同”:
      (1)域名相同
      (2)协议相同
      (3)端口相同

      上述三个方面均相同属于同源,JavaScript默认在同源范围内才允许通信。我们接下来通过不同的URL认识同源和跨域问题:

     http://www.a.com/a.js
     http://www.a.com/b.js 协议相同,域名相同,端口相同 允许
    
     http://www.a.com/a.js 
     http://www.b.com/a.js  协议相同,域名不同,端口相同    不允许
    
     http://www.a.com:8000/a.js
     http://www.a.com/b.js  协议相同,域名相同,端口不同    不允许
    
     https://www.a.com/a.js 
     http://www.a.com/b.js  协议不同,域名相同,端口相同    不允许
    

       2.Java中处理跨域问题,通常采取两种方法:

      (1)后台代码在被请求的Servlet中添加Header设置。

    response.setHeader("Access-Control-Allow-Origin","*");
    response.getWriter().write("{'status':'OK'}");
    

       Access-Control-Allow-Origin这个Header在W3C标准里用来检查该跨域请求是否可以被通过,如果值为*则表明当前页面可以跨域访问。默认的情况下是不允许的。

      在前端JS代码中需要向Servlet发出请求,请求代码如下所示:

    $.ajax({
           url:"http://localhost:8080/test",
           type:"post",
           data:{
                name:"Jim",
                },
           dataType:"json",
           success:function(data){
                 ...
                 },
           error:function(data){
                 ...
           }
         })
    

       (2)通过jsonp跨域请求的方式。

      JSONP和JSON虽然只有一个字母的区别,但是他们完全就是两回事,很多人很容易把他们搞混。JSON是一种数据交换的格式,而JSONP则是一种非官方跨域数据交互协议。该方式只能用于GET方式请求,不能用于POST方式请求。

      我们先来看前段JS代码如何发送请求:

     $.ajax({
               url:"http://localhost:8080/test",
               type:"get or post",
               async:true,
               dataType : "jsonp",
               //服务端用于接收callback调用的function名的参数
               jsonp:"callbackparam",
               //callback的function名称
               jsonpCallback:"success_jsonpCallback",
               success:function(data){
                        console.log(data);
               },
               error:function(data){
                        console.log(data);
               }
     });
    

       这里的callbackparam和success_jsonpCallback可以理解为发送的data数据的键值对,可以自定义,但是callbackparam需要和后台约定好参数名称,因为后台需要获取到这个参数里面的值(即success_jsonpCallback)。

      后台代码如下:  

    String callback = request.getParameter("callbackparam");
    String json = callback + "({'status':'OK'})";
    response.getWriter().print(json);
    

       在后台代码里,需要获取参数名为callbackparam的值,这里获取到的值就是“success_jsonpCallback”。然后将这个值后面加上一对小括号,小括号里放入你需要返回的数据内容,比如这里我返回一个JSON对象。当然你也可以返回其他对象,比如只返回一个字符串类型数据也可以。最后前端JS接收到的数据是这样的:

      success_jsonpCallback({'status':'ok'})

      浏览器会自动解析为json对象,这时候你只需要在success回调函数中直接用data.status就可以了。

  • 相关阅读:
    面试题--基础
    面试题---flask
    vue---07 支付和订单
    企业真题
    vue --06 购物车的实现
    Three.js 开发机房(四)
    Three.js 开发机房(三)
    Three.js 开发机房(二)
    Three.js 开发机房(一)
    Three.js 前言
  • 原文地址:https://www.cnblogs.com/lizhangyong/p/8893177.html
Copyright © 2020-2023  润新知