前后端分离跨域问题

最新推荐文章于 2024-05-29 00:41:40 发布

原创最新推荐文章于 2024-05-29 00:41:40 发布 · 139 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#java #spring

代码层面配置

package com.codinglife.gateway.config;

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

/**
 * @description 跨域问题
 * @author: jinxiaokai
 * @create: 2021-09-05 20:51
 **/

@Configuration
public class CrossOriginConfiguration {

    @Bean
    public WebMvcConfigurer corsConfigurer() {
        return new WebMvcConfigurer() {
            @Override
            public void addCorsMappings(CorsRegistry registry) {
                registry.addMapping("/*")
                        .allowedOriginPatterns("*")
                        .allowCredentials(true)
                        .allowedMethods("GET", "POST", "DELETE", "PUT", "PATCH")
                        .maxAge(3600);
            }
        };
    }
}

gateway配置文件

  globalcors:
    cors-configurations:
      '[/**]':
        allowCredentials: true
        allowedOriginPatterns: "*"
        allowedHeaders: "*"
        allowedMethods: "*"
    add-to-simple-url-handler-mapping: true

前端vue解决跨域

devServer: {
    port: port,
    host: HOST || IP,
    overlay: {
      warnings: false,
      errors: true
    },
    proxy: {
      [process.env.VUE_APP_BASE_API]: {
        target: process.env.VUE_APP_BASE_TARGET,
        changeOrigin: true,
        ws: true,
        pathRewrite: {
          ['^' + process.env.VUE_APP_BASE_API]: ''
        }
      }
    }
 }