Vue配置proxy代理接口报错2007 bad domain的解决

 更新时间:2023年06月11日 15:42:27   作者:小草莓蹦蹦跳  
本文主要介绍了Vue配置proxy代理接口报错2007 bad domain的解决,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

1、排查proxy代理配置是否有误

排查 proxyTable 对象中配置的 target 是否正确。若正确,那可能就是请求头的问题。

无特殊配置的情况下,请求头是这样子的:

Host 和 Referer 是本地地址,如果后端增加  CSRF 防御机制,对请求头 Origin/Referer 进行校验。那么就会报错:2007 bad domain

2、修改 headers 中的 Origin 和 Referer 规避校验

'/api': {
        target: process.env.VUE_APP_API_BASE_URL,
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        },
        headers: {
          // 后端增加 CSRF 防御机制,对请求头 Origin/Referer 进行校验,开发模式下 devServer 的代理需要修改 Origin/Referer 规避校验
          Origin: process.env.VUE_APP_DEV_FAKE_ORIGIN,
          Referer: process.env.VUE_APP_DEV_FAKE_ORIGIN
}

重新启动项目,就正常了~~

到此这篇关于Vue配置proxy代理接口报错2007 bad domain的解决的文章就介绍到这了,更多相关Vue 代理接口报错内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • vue不用import直接调用实现接口api文件封装

    vue不用import直接调用实现接口api文件封装

    这篇文章主要为大家介绍了vue不用import直接调用实现接口api文件封装,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-06-06
  • 快速将Vue项目升级到webpack3的方法步骤

    快速将Vue项目升级到webpack3的方法步骤

    这篇文章主要给大家介绍了关于如何快速将Vue项目升级到webpack3的方法步骤文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧。
    2017-09-09
  • VUEJS实战之利用laypage插件实现分页(3)

    VUEJS实战之利用laypage插件实现分页(3)

    这篇文章主要为大家详细介绍了VUEJS实战之修复错误并且美化时间,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-06-06
  • 解决ant design vue中树形控件defaultExpandAll设置无效的问题

    解决ant design vue中树形控件defaultExpandAll设置无效的问题

    这篇文章主要介绍了解决ant design vue中树形控件defaultExpandAll设置无效的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-10-10
  • 压缩Vue.js打包后的体积方法总结(Vue.js打包后体积过大问题)

    压缩Vue.js打包后的体积方法总结(Vue.js打包后体积过大问题)

    大家都知道,Vuejs的 CLI工具 是基于 webpack 来实现的,所以在项目打包后,会生成的文件会很大。 主要原因是 webpack 将我们所有文件都打包成一个js文件,即使再小的项目,打包之后文件都会变得很大。 下面讲讲最近我遇到的相同问题。
    2020-02-02
  • 关闭eslint检查和ts检查的简单步骤记录

    关闭eslint检查和ts检查的简单步骤记录

    这篇文章主要给大家介绍了关于关闭eslint检查和ts检查的相关资料,eslint是一个JavaScript的校验插件,通常用来校验语法或代码的书写风格,文中通过代码介绍的非常详细,需要的朋友可以参考下
    2024-02-02
  • vue项目中如何使用mock你知道吗

    vue项目中如何使用mock你知道吗

    这篇文章主要为大家介绍了vue项目如何使用mock,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望能够给你带来帮助
    2021-11-11
  • vue中el-table树状表格末行合计实现

    vue中el-table树状表格末行合计实现

    本文主要介绍了vue中el-table树状表格末行合计实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2023-11-11
  • Vue常见面试题整理【值得收藏】

    Vue常见面试题整理【值得收藏】

    本文是小编给大家收藏整理的Vue常见面试题,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下
    2018-09-09
  • Vue3响应式对象是如何实现的(1)

    Vue3响应式对象是如何实现的(1)

    这篇文章主要介绍了Vue3响应式对象是如何实现的,文章围绕主题展开详细的内容介绍具有一定的参考价值,需要的小伙伴可以参考一下
    2022-08-08

最新评论