利用注解的方式解决AJAX请求跨域问题

1.编写一个支持跨域请求的 Configuration

- 第一种方式

- CorsConfig.java

import org.springframework.context.annotation.Configuration;

import org.springframework.web.servlet.config.annotation.CorsRegistry;

import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter;

/**

 * 处理AJAX请求跨域的问题

 * @author Levin

 * @time 2017-07-13

 */

@Configuration

public class CorsConfig extends WebMvcConfigurerAdapter {

    static final String ORIGINS[] = new String[] { "GET", "POST", "PUT", "DELETE" };

    @Override

    public void addCorsMappings(CorsRegistry registry) {

        registry.addMapping("/**").allowedOrigins("*").allowCredentials(true).allowedMethods(ORIGINS)

                .maxAge(3600);

    }

}

2.HTTP请求接口

- HelloController.java

@RestController

public class HelloController {

    @Autowired

    HelloService helloService;

    @GetMapping(value = "/test", produces = MediaType.APPLICATION_JSON_UTF8_VALUE)

    public String query() {

        return "hello";

    }

}

- 第二种方式（推荐）

PS：第一种存在一个问题，当服务器抛出 500 的时候依旧存在跨域问题

@SpringBootApplication

@ComponentScan

@EnableDiscoveryClient

public class ManagementApplication {

    public static void main(String[] args) {

        SpringApplication.run(ManagementApplication.class, args);

    }

    private CorsConfiguration buildConfig() {

        CorsConfiguration corsConfiguration = new CorsConfiguration();

        corsConfiguration.addAllowedOrigin("*");

        corsConfiguration.addAllowedHeader("*");

        corsConfiguration.addAllowedMethod("*");

        corsConfiguration.addExposedHeader(HttpHeaderConStant.X_TOTAL_COUNT);

        return corsConfiguration;

    }

    /**

     * 跨域过滤器

     *

     * @return

     */

    @Bean

    public CorsFilter corsFilter() {

        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();

        source.registerCorsConfiguration("/**", buildConfig()); //

        return new CorsFilter(source);

    }

}

- index.html

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>跨域请求</title>

<script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js">

</script>

<script>

$(document).ready(function(){

    $("button").click(function(){

        $.ajax({url:"http://localhost:8080/test",success:function(result){

            $("#p1").html(result);

        }});

    });

});

</script>

</head>

<body>

<p width="500px" height="100px" id="p1"></p>

<button>获取其他内容</button>

</body>

</html>

SpringBoot支持AJAX跨域请求的更多相关文章

  1. springboot：ajax跨域请求解决方案

    Cors详细介绍请看阮一峰的跨域资源共享 CORS 详解:http://www.ruanyifeng.com/blog/2016/04/cors.html SpringBoot使用CROS解决跨域问题 ...

  2. WebApi 自定义过滤器实现支持AJAX跨域的请求

    我想关于此类话题的文章,大家一搜铺天盖地都是,我写此文的目的,只是对自己学习过程的记录,能对需要的朋友有所帮助,也百感荣幸!!!废话不多说,直接上代码! 客户端:很简单的AJAX请求 <html ...

  3. Laravel中的ajax跨域请求

    最近接触Laravel框架ajax跨域请求的过程中遇到一些问题,在这里做下总结. 一开始发起ajax请求一直报500错误,搜索相关资料后发现Laravel要允许跨域请求可以加入Cors中间件,代码如下 ...

  4. 浅谈linux 下，利用Nginx服务器代理实现ajax跨域请求。

    ajax跨域请求对于前端开发者几乎在任何一个项目中都会用到,众所周知,跨域请求有三种方式: jsonp; XHR2 代理: jsonp: 这种应该是开发中是使用的最多的,最常见的跨域请求方法,其实aj ...

  5. 解决ajax跨域请求 （总结）

    ajax跨域请求,目前已用几种方法实现:   1)用原生js的xhr对象实现.                var url="http://freegeoip.net/json/" ...

  6. ASP.NET MVC 实现AJAX跨域请求方法《1》

    ASP.NET MVC 实现AJAX跨域请求的两种方法 通常发送AJAX请求都是在本域内完成的,也就是向本域内的某个URL发送请求,完成部分页面的刷新.但有的时候需要向其它域发送AJAX请求,完成数据 ...

  7. $.ajax 跨域请求 Web Api

    WepApi确实方便好用,没有配置文件,一个apicontroller直接可以干活了.但今天用$.ajax跨域请求的时候总是获取不到数据,用fiddler一看确实抓到了数据,但回到$.ajax函数中, ...

  8. JQuery的Ajax跨域请求原理概述及实例

    今天在项目中需要做远程数据加载并渲染页面,直到开发阶段才意识到ajax跨域请求的问题,隐约记得Jquery有提过一个ajax跨域请求的解决方式,于是即刻翻出Jquery的API出来研究,发 JQuer ...

  9. jQuery ajax跨域请求的解决方法

    在Ajax应用中,jQuery的Ajax请求是非常容易而且方便的,但是初学者经常会犯一个错误,那就是Ajax请求的url不是本地或者同一个服务器下面的URI,最后导致虽然请求200,但是不会返回任何数 ...

随机推荐

  1. Codeforces--633D--Fibonacci-ish（暴力搜索+去重）（map）

    Fibonacci-ish Time Limit: 3000MS   Memory Limit: 524288KB   64bit IO Format: %I64d & %I64u Submi ...

  2. android apk 防止反编译技术第二篇-运行时修改Dalvik指令

    上一篇我们讲了apk防止反编译技术中的加壳技术,如果有不明白的可以查看我的上一篇博客http://my.oschina.net/u/2323218/blog/393372.接下来我们将介绍另一种防止a ...

  3. React-Native 踩坑过程

    踩坑过程: 解决方法就是去 SDK Manager 把 23.0.1 的版本下载了 而如果报错信息中含有bintray.com.gradle.org等网址,请***,反复重试,或者去react nat ...

  4. 洛谷P1402 酒店之王(二分图)

    P1402 酒店之王 题目描述 XX酒店的老板想成为酒店之王,本着这种希望,第一步要将酒店变得人性化.由于很多来住店的旅客有自己喜好的房间色调.阳光等,也有自己所爱的菜,但是该酒店只有p间房间,一天只 ...

  5. docker(一):docker是什么？

    认识容器:docker入门篇 docker是什么? Docker 是一个开源的应用容器引擎,让开发者可以打包他们的应用以及依赖包到一个可移植的容器中,然后发布到任何流行的Linux机器上,也可以实现虚 ...

  6. AE错误代码解释

    每当我们在进行AE开发,出现错误时经常会出现错误代码,但是我们并不知道它到底代表什么意思,这里的而错误编码我们可以对照着找到我们需要的时候常详细信息(问题是,经常还是会出现没有错误编码HRESULT ...

  7. Redis(六)-数据类型

    Redis支持五种数据类型:string(字符串),hash(哈希),list(列表),set(集合)及zset(sorted set:有序集合). String(字符串) string是redis最 ...

  8. DotNetCasClient加载失败问题分析

    最近公司在接入整理单点登录方案的时候,选择了CAS方案,实际版本采用了4.0.当我们把服务端附属完毕,基于.NET平台Web版的客户端DotNetCasClient进行定制化修改后,在测试环境通过.然 ...

  9. 2.Dubbo开源分布式服务框架(JAVA RPC)

    1. Dubbo介绍 Dubbox是阿里巴巴公司开源的一个高性能优秀的服务框架,使得应用可通过高性能RPC(即远程调用)实现服务的输出和输入功能, 可以和Spring框架无集成.Dubbo是一款高性能 ...

  10. [转载]MySql事物处理

    事务处理在各种管理系统中都有着广泛的应用,比如人员管理系统,很多同步数据库操作大都需要用到事务处理.比如说,在人员管理系统中,你删除一个人员,你即需要删除人员的基本资料,也要删除和该人员相关的信息,如 ...