前端Vue使用axios请求

前端Vue使用axios请求

使用npm安装axios

npm install axios

在需要的地方引用

import axios from 'axios';

解决跨域

在vue.config.js中增加配置。记得重启下。

module.exports = {
  devServer: {
    proxy: {
      '/api': {
        target: 'http://localhost:8011',
        pathRewrite: { '^/api': '' },  // 用于将请求中的 /api 字符串替换为空, 若不添加此行配置，那么访问地址就变成了：http://localhost:8011/api/request_url
        ws: true, // 是否支持 webstocket, 默认是 true
        changeOrigin: true // 用于控制请求头中的 host 值, 默认是 ture
      },
      '/api2': {//按需求配置，可以只配置一个。
        target: 'http://localhost:8022', // 配置访问的服务器地址
        pathRewrite: { '^/api2': '' },  // 用于将请求中的 /api2 字符串替换为空，若不添加此行配置，那么访问地址就变成了：http://localhost:8022/api/request_url
        ws: true, // 是否支持 webstocket, 默认是 true
        changeOrigin: true // 用于控制请求头中的 host 值, 默认是 ture
      }
    }
  }
}

怎么使用

这里使用的是简单的方法，url要加“api”，对应上面proxy的。

axios.post('/api/url',param).then(res => {console.log(res.data)})