[vuejs/vuepress]vuepress中配置devserver跨域

2023-12-14 283 views
8

使用版本:V1.9.7 场景:通过config.js配置跨域使axios能够提交到node开发的后端 问题:config中配置跨域不生效 报错:

GET http://localhost:8080/api/editor 404 (Not Found)

具体配置如下:

configureWebpack: {
        devServer: {
            proxy: {
                '/api': {
                    target: 'http://localhost:8085/api',
                    changeOrigin: true,
                    pathRewrite: {
                        '^/api': ''
                    }
                }
            }
        }
    },
    devServer: {
        proxy: {
            '/api': {
                target: 'http://localhost:8085/api',
                changeOrigin: true,
                pathRewrite: {
                    '^/api': ''
                }
            }
        }
    },

回答

8

其实就和我的问题一样,在config.js文件中配置devServer就可以了。我一开始无法ping通是因为node后端应该接收get请求却写成了接收post请求而已。

9

是否在+module.exports对象中直接添加 devServer: { proxy: { '/api': { target: 'http://localhost:8085/api', changeOrigin: true, pathRewrite: { '^/api': '' } } } } 这样就可以实现代理了?

3

image 但是我这样配置 重跑项目也没生效 在Response Header中也没看到映射真实的url o(╥﹏╥)o

9

你指的是请求url没有转换成你想要的跨域地址?这个url是不会变化的,我这里保留的还是原来的url。没有联通不仅会是跨域的问题,可能还会有其他问题。最好可以看一下报错信息

5

我知道请求的url会是我本地 但是它如果代理成功的话 是会在response Header中会有映射的真实url,我使用的vuepress版本为 1.7.1

1

建议可以根据报错信息排查原因,还有个就是你的proxy写的有点问题,/api/转换成对应的网站,可能写多了一个‘/’导致路径出错。如果不是这个报错的话还是需要报错信息才能知道原因。

2

好的 我继续排查一下 十分感谢

8

大佬,devServer跨域好像只在开发环境有效,问下要怎么配置在build后放tomcat里跑也有效

1

我这边后端处理跨域情况了