Front-end and back-end local joint debugging across domains

Front-end and back-end local joint debugging cross-domain issues

The front-end and back-end encounter some pitfalls during local joint debugging, that is, when requesting the interface of the local service, they will encounter cross-domain problems. In fact, it is easy to solve. I use vue2.x, and refer to the configuration of Vue CLI also explained in
insert image description here

Just configure it in the vue.config.js file according to the documentation

module.exports = {
    
    
	devServer: {
    
    
		proxy: {
    
    
          '/local': {
    
    
            target: 'url', // url:需要代理的域名,也就是联调接口的域名
            changeOrigin: true, // 需要跨域要配置为true
            pathRewrite: {
    
    
              '^/local': ''  // 类似替换字符串,将/local字符替换为空
            }
          }
        }	
	}
}
// 请求案例
axios.get('/local/XXXX').then(res => {
    
    
	console.log(res)
})
注意:如果在axios中配置了baseUrl需要将baseUrl设置为空,否则接口请求会返回404,在请求拦截中同理
config.baseURL = ''

After completing the above configuration, try to request to see if the cross-domain problem is solved. After the request is successful, the data will be returned successfully, but you will find that the path of the request is still the local service address. This does not affect it, and the proxy has actually been successful.

Guess you like

Origin blog.csdn.net/m0_46496355/article/details/123353962