前后端跨域竟然不需要加注解！

众所周知前后端跨域一直是让人头疼的问题。

那什么是跨域呢？

出于浏览器的同源策略限制。同源策略（Sameoriginpolicy）是一种约定，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的，浏览器只是针对同源策略的一种实现。同源策略会阻止一个域的。javascript脚本和另外一个域的内容进行交互。所谓同源（即指在同一个域）就是两个页面具有相同的协议（protocol），主机（host）和端口号（port）

我所遇到的跨域问题

我的前端是通过vscode下载的Live Server运行的

因为前端的运行地址是http://127.0.0.1:5501/login.html
我要发起请求http://localhost:8080/user/login去实现登录，就会报下列错误

怎么解决呢?废话不多说，直接上干货

方法一:给controller加@CrossOrigin注解

这种方法是我知道的最简单的解决跨域的问题，但是他还是要依赖于vscode的live serve，而且这个方法太简单了，没有一点挑战性。
下面介绍一个大杀器

正文开始

Nginx来解决前后端跨域问题

1、首先去官网下载一个Nginx

https://nginx.org/en/download.html

2、直接解压

3、开始配置，打开conf文件夹，选择nginx.conf

打开后你会发现有很多行，不用管，大多都是注释的。
而你只需要关注我红色框起来的
一定要是第一个server里面配置
listen设置监听端口号，要设置空余的端口号
server_name就是你的ip地址，localhost或者127.0.0.1都可以

4、配置前端

root就是你的前端项目地址
index就是打开的页面
这就相当于把前端项目部署到了nginx上面

5、配置后端

proxy_pass就是你后端服务器地址，
/api/就是待会前端里面写请求的前缀，它能够转发到你的后端

6、保存退出，双击启动nginx

你也可以使用命令

7、然后就可以去浏览器输入localhost:90,他就会访问到你的项目

登录成功了！！

原先的请求http://localhost:8080/user/login
加入了nginx的请求：api/user/login

跨域问题解决成功，快去试试吧