vue学习--vue脚手架配置代理

val21

已于 2023-07-14 15:53:45 修改

阅读量82

点赞数

文章标签： vue.js 学习 javascript

于 2023-07-14 15:53:24 首次发布

本文链接：https://blog.csdn.net/val210607/article/details/131724919

版权

本文介绍了在Vue脚手架中配置代理的两种方法，包括各自优缺点和工作原理。方法一适用于简单配置，而方法二提供更灵活的代理控制，允许配置多个代理，但请求需加前缀。

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

方法一：

在vue.config.js中配置如下代码：

  //开启代理服务器
  devServer:{
    proxy:'http://localhost:5000'  //目标服务器地址
  },

组件中的内容如下：

<button @click="getStudent"> 获取学生信息</button>

<script>
import  axios from 'axios'

export default {
  name:'App',
  methods:{
    getStudent(){
      axios.get('http://localhost:8080/students').then(
        response => {
          console.log("请求成功了",response.data)
        },
        error => {
          console.log('请求失败了',error.message)
        }
      )
    },
 }
</script>