JSONP解决跨域请求

最新推荐文章于 2023-12-13 14:22:08 发布

原创最新推荐文章于 2023-12-13 14:22:08 发布 · 248 阅读

0 ·

CC 4.0 BY-SA版权

spring boot 专栏收录该内容

19 篇文章

订阅专栏

本文介绍了如何通过JSONP实现跨域请求，并给出了具体的前端HTML和后端Java代码示例。详细展示了如何设置和调用JSONP，以及如何在Spring框架下配置JsonpAdvice类以支持JSONP请求。

虽然请求类型是非xhr，但JSONP 创建的是SCRIPT标签，而后台返回的是json对象，造成请求类型不一致;
使用JSONP，后台需要作改动;
后台增加 JsonpAdvice类 ----即后台代码需要作改动

前台html实现代码：

// jsonp测试方法
it("jsonp请求", function(done) {
   // 服务器返回的结果
   var result;
   $.ajax({
       url: base +"/get1",
       dataType: "jsonp",
       jsonp: "callback",
       cache:true,
       success: function(json){
           result = json;
       }
   });
   // 由于是异步请求，需要使用setTimeout来校验
   setTimeout(function() {
       expect(result).toEqual({
           "data" : "get1 ok"
       });
       // 校验完成，通知jasmine框架
       done();
   }, 100);
});

后台代码：

package com.xibei.ajaxserver;

import org.springframework.web.bind.annotation.ControllerAdvice;
/**
* POM中org.springframework.book 版本为2.1.6 为了达到演示的效果，将版本下降到1.5.9
* AbstractJsonpResponseBodyAdvice 才能引用
*/
import org.springframework.web.servlet.mvc.method.annotation.AbstractJsonpResponseBodyAdvice;

@ControllerAdvice
public class JsonpAdvice extends AbstractJsonpResponseBodyAdvice {
    public JsonpAdvice(){
        super("callback");
    }
}