前后端跨域问题汇总

小星空

文章最后更新时间:2021年10月04日已超过871天没有更新。

前后端跨域问题汇总

has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource

前后端跨域问题汇总

解决办法1-前端Vue

// 网关地址
const GATEWAY_HOST = process.env.GATEWAY_HOST || '127.0.0.1'
const GATEWAY_PORT = process.env.GATEWAY_PORT || '9180'

// 转发配置
module.exports = {
  proxyList: {
    '/api': {
      target: 'http://' + GATEWAY_HOST + ':' + GATEWAY_PORT,
      changeOrigin: true,
      pathRewrite: {
        '^/api': '/api'
      }
    }
  }
}


解决办法2-后端Java

SpringBoot2.x版本之后的解决跨域问题:

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

@Configuration
public class WebMvcConfig implements WebMvcConfigurer {

    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                    .allowedOrigins("*")
                    .allowedHeaders("*")
                    .allowedMethods("*")
                    .maxAge(30 * 1000);
    }

}


解决办法3-Nginx

location / {  
    add_header Access-Control-Allow-Origin *;
    add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS';
    add_header Access-Control-Allow-Headers 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization';

    if ($request_method = 'OPTIONS') {
        return 204;
    }
}

参考文章https://segmentfault.com/a/1190000012550346

版权声明
  本站致力于为模板爱好者提供国内外插件开发技术和模板共享,着力为用户提供优资资源。
  本站提供的所有下载文件均为网络共享资源,请于下载后的24小时内删除。如需体验更多乐趣,还请支持正版。
  我站提供用户下载的所有内容均转自互联网。如有内容侵犯您的版权或其他利益的,请编辑邮件并加以说明发送到站长邮箱。
  站长会进行审查之后,情况属实的会在三个工作日内为您删除。
文章版权声明:除非注明,否则均为小星空博客原创文章,转载或复制请以超链接形式并注明出处。

您需要 登录账户 后才能发表评论

发表评论

快捷回复: 表情:
AddoilApplauseBadlaughBombCoffeeFabulousFacepalmFecesFrownHeyhaInsidiousKeepFightingNoProbPigHeadShockedSinistersmileSlapSocialSweatTolaughWatermelonWittyWowYeahYellowdog
评论列表 (暂无评论,5659人围观)

还没有评论,来说两句吧...

取消
微信二维码
微信二维码
支付宝二维码