不用调整Nginx,SpringBoot也能解决前端访问的跨域问题
1、什么情况下会出现跨域问题
通常,在前端工程师的开发过程中,往往在本地机器启动前端服务, 而调用的后端接口服务是在另外一台机器运行,这时就会出现跨域问题,让接口无法调通。
而到了测试环境和生产环境,可以使用Nginx去解决这个问题。
这里我们仅考虑开发环境,在不借助Nginx的情况下,解决跨域。
2、解决方案
在SpringBoot工程中,增加跨域配置即可。
3、实现
新增一个跨域配置类 CrossDomainConfig,在其中配置允许跨域访问的url、请求方式、Header等。代码如下:
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter; @Configuration
public class CrossDomainConfig{ public CrossDomainConfig() { }
private CorsConfiguration buildConfig() {
// 添加cors配置信息
CorsConfiguration corsConfiguration = new CorsConfiguration();
corsConfiguration.addAllowedOrigin("http://localhost:8080");
// * 代表所有url
corsConfiguration.addAllowedOrigin("*"); // 设置允许请求的方式
corsConfiguration.addAllowedMethod("*"); // 设置允许的header
corsConfiguration.addAllowedHeader("*"); // 设置是否发送cookie信息
corsConfiguration.setAllowCredentials(true); return corsConfiguration;
} @Bean
public CorsFilter corsFilter() {
// 为url添加映射路径
UrlBasedCorsConfigurationSource crossDomainSource = new UrlBasedCorsConfigurationSource();
crossDomainSource.registerCorsConfiguration("/**", buildConfig()); // 返回重新定义好的配置
return new CorsFilter(corsSource);
}
}
重启后台工程,会发现,跨域问题被如此简单的解决了。
不用调整Nginx,SpringBoot也能解决前端访问的跨域问题的更多相关文章
- Nginx解决前端访问资源跨域问题
被前端跨域问题折磨快2天后,终于用ngnx的方式解决了,所以在此总结下. 该篇只探讨如何用Ngnx解决跨域问题,对于原理不作讨论. 1.首先介绍Windows环境下Nignx的相关命令操作 nginx ...
- nginx配置反向代理,解决前端开发的跨域问题
适用:开发和生产环境 配置如下 server { listen 10901; server_name res.pre.ices.red; #charset koi8-r; #access_log lo ...
- nginx配置反向代理解决前后端分离跨域问题
摘自<AngularJS深度剖析与最佳实践>P132 nginx配置文件如下: server { listen ; server_name your.domain.name; locati ...
- Ajax【介绍、入门、解决Ajax中文、跨域、缓存】
什么是Ajax Ajax(Asynchronous JavaScript and XML) 异步JavaScript和XML Ajax实际上是下面这几种技术的融合: (1)XHTML和CSS的基于标准 ...
- vue+springboot前后端分离实现单点登录跨域问题处理
最近在做一个后台管理系统,前端是用时下火热的vue.js,后台是基于springboot的.因为后台系统没有登录功能,但是公司要求统一登录,登录认证统一使用.net项目组的认证系统.那就意味着做单点登 ...
- Vue-cli proxyTable 解决开发环境的跨域问题
Vue-cli proxyTable 解决开发环境的跨域问题 proxyTable: { '/list': { target: 'http://api.xxxxxxxx.com', pathRewri ...
- 解决阿里云OSS跨域问题
解决阿里云OSS跨域问题 现象 本人项目中对阿里云图片请求进行了两次,第一次通过img标签进行,第二次通过异步加载获取.第一次请求到图片,浏览器会进行缓存,随后再进行异步请求,保存跨域失效. 错误信息 ...
- 小白的springboot之路(六)、跨域解决方案CORS
0-前言 前后端分离.分布式集群,经常都会涉及到跨域访问,而浏览器基于同源策略,正常情况下是不能跨域的,这就需要我们解决跨域访问问题:spring boot解决跨域也比较简单: 1-CORS跨域解决方 ...
- 利用nginx做反向代理解决前端跨域问题
最近朋友再群里提了一个问题,他们公司给他提供了一个获取数据的接口,在浏览器访问这个接口能获取到json数据,但是放在项目里使用ajax就产生了跨域问题,一般这个需要提供接口的后台方面需要做跨域处理,但 ...
随机推荐
- Docker编排利器DockerCompose
Docker 编排利器 DockerCompose,编排之后可以一次性通过一条命令启动一组服务 例如一条命令启动 SpringBoot 项目,同时启动 SpringBoot 项目依赖的其他中间件(My ...
- CentOS下 Django部署 nginx+uWSGI+Django(二)
该篇内容承接CentOS下 Django部署 uWSGI+Django(一),细节流程可参考此篇内容. 1. 当前系统 CentOS Linux release 7.6.1810 Python 2.7 ...
- 每天五分钟Go - 指针
什么是指针 一个指向内存地址的变量,称为指针变量,指针是一个特殊的变量,他的值存储的是另一个值的内存地址 指针变量的声明 var var_name *type var_name 是指针变量的名称,ty ...
- 每天五分钟Go - 变量
变量的声明 1.使用关键词 var 定义,声明后若不赋值,则使用默认值 var 变量名 [变量类型] [=初始值] var a,b,c string var e,f int = 0,1 声明时,如果省 ...
- 微信小程序创建第一个项目
一.打开微信开发者工具,扫码登录 二.点击右侧的加号,添加小程序 第三步:创建成功后,报错 VM82:1 cloud init error: Error: invalid scope 没有权限,请先开 ...
- 解决proto文件生成pb文件时提示(e.g."message")的问题
原因:格式不支持 解决办法:去下个notepad,打开方式选择notepad,文件属性的只读取消掉 打开后会发现最下面显示了文件的格式是unix,utf-8 右键红框处,选择转换为windows格式, ...
- open jdk 绿色版 下载
https://adoptopenjdk.net/ 是 rethat 的 openjdk 地址, jdk 11 , 进入页面后搜索 : jdk_x64_windo , 下载 zip 绿色版的那个. h ...
- 大数据学习(07)——Hadoop3.3高可用环境搭建
前面用了五篇文章来介绍Hadoop的相关模块,理论学完还得操作一把才能加深理解.这一篇我会花相当长的时间从环境搭建开始,到怎么在使用Hadoop,逐步介绍Hadoop的使用. 本篇分这么几段内容: 规 ...
- Docker部署Mysql实践
前言:由于Docker部署容器时,没有指定IP,当机器重启后,容器的IP会变化,所以在创建容器的时候,最好能固定IP:同时,在Ubuntu系统中,每次执行命令,都需要root权限,命令需要加sudo标 ...
- 修改Linux系统的默认语言编码集
RedHat 今天晚上发现服务器上vi的界面提示变成了乱码,只能将XShell的编码改为GBK才能正常显示,导致consolas字体无法使用,GBK编码下的字体丑陋无比,无法忍受,一轮google之后 ...