vue实现前端反向代理

最新推荐文章于 2024-05-21 16:15:53 发布

wqww_1

最新推荐文章于 2024-05-21 16:15:53 发布

阅读量181

点赞数

分类专栏： vue 前端跨域文章标签： vue.js 前端 javascript

本文链接：https://blog.csdn.net/wqww_1/article/details/124948881

版权

vue 同时被 3 个专栏收录

15 篇文章 1 订阅

订阅专栏

前端

6 篇文章 0 订阅

订阅专栏

跨域

1 篇文章 0 订阅

订阅专栏

这篇博客介绍了如何在Vue项目中设置vue.config.js，将devServer代理设置为'http://localhost:8088/ydl'，以便于前端与后台接口的交互。同时，文章讲解了如何创建一个Axios实例，设定基础URL、超时时间和Content-Type，确保JSON格式的数据传输。

摘要由CSDN通过智能技术生成

在目录下创建vue.config.js

module.exports = {
    devServer: {
        port: 8088,
        proxy: 'http://localhost:8080/ydl'
    }
  }

修改url为前台端口

// 创建axios实例
const request = axios.create({
    // axios中请求配置有baseURL选项，表示请求URL公共部分
    baseURL: 'http://localhost:8088',
    // 超时取消
    timeout: 10000,
    // 设置Content-Type，规定了前后端的交互使用json
    headers: {'Content-Type': 'application/json;charset=utf-8'}
})