SpringBoot+Vue2项目解决前后端跨域方案

SpringBoot+Vue2项目解决前后端跨域方案
一. 前端跨域解决方案
二. 后端跨域解决方案

现实工作开发中经常会有跨域的情况，因为公司会有很多项目，也会有很多子域名，各个项目或者网站之间需要相互调用对方的资源，这样就避免不了跨域请求。
那先来说一说什么是跨域吧！
跨域：指的是从一个域名去请求另外一个域名的资源，即跨域请求！
跨域时，浏览器不能执行其他域名网站的脚本，是由浏览器的同源策略造成的，是浏览器施加的安全限制。
跨域严格来说就是只要协议、域名、端口三者有一个不同，就被当作跨域。
同源策略：三者必须完全相同称之为同源。

下面介绍两种解决前后端跨域方案。

一. 前端跨域解决方案
1、vue.config.js配置如下：

const { defineConfig} = require(‘@vue/cli-service’)
module.exports = defineConfig({
transpileDependencies: true,
devServer: {
// 设置前端页面访问端口（选填）
host: ‘localhost’,
port: ‘80’,
// 跨域配置
proxy: {
‘/api’: {
target: ‘http://localhost:8080’, // 后台地址
changeOrigin: true, // 允许跨域

            pathRewrite: {<!-- -->
                '^/api': ''
            }