跨域的方法

一、在scr文件下新建utils，并新建request.js和storage.js

request.js

// 第一步引入axios 
import axios from "axios"
// 第二步引入qs
import qs from "qs"

import storage from "@/utils/storage"

// 第三步 配置根路径 和 超时时间
let newAxios = axios.create({
    baseURL: process.env.VUE_APP_BASE_API,
    timeout: 10000,
})

// 第四步:
// 配置拦截器
// 添加请求拦截器
newAxios.interceptors.request.use(function (config) {
    // 在发送请求之前做些什么
    let token = storage.get("sell_token")
    if (token) {
        config.headers.Authorization = token
    }
    return config;
}, function (error) {
    // 对请求错误做些什么
    return Promise.reject(error);
});

// 添加响应拦截器
newAxios.interceptors.response.use(function (response) {
    // 对响应数据做点什么
    // 响应拦截
    //将返回的数据过滤 留下有用的数据返回
    return response.data;
}, function (error) {
    // 对响应错误做点什么
    return Promise.reject(error);
});


//第五步:
// 封装方法解决 method对应的传值问题
// 因为这个方法需要将axios返回给别人用
function request(url, method, aaa) {

    return newAxios({
        url,
        method,
        data: method == "post" ? qs.stringify(aaa) : '',
        params: method == "get" ? aaa : ''

    })
}
// 请求有四种
// post登录 / 注册
// get 列表
// delete 删除
// put  修改
// 第六步
function post(url, aaa) {

    return request(url, "post", aaa)
}
function get(url, aaa) {

    return request(url, "get", aaa)
}

// 第七步暴露
export default {
    post,
    get
}

storage.js

//定义一个变量
const storage = window.localStorage
// 设置值
function set(key, value) {
    // JSON.stringify(value) 将value值变成字符串模式
    // 因为本地或者回话存储空间是有限的
    storage.setItem(key, JSON.stringify(value))
}
// 获取值
function get(key) {
    // JSON.parse(storage.getItem(key)) 在获取的时候需要解开
    return JSON.parse(storage.getItem(key))
}
// 清空
function clear() {
    storage.clear()
}
// 清除一个
function remove(key) {
    storage.removeItem(key)
}

// 判断 
function isKey(key) {
    return storage.getItem(key) ? true : false
}


export default {
    set,
    get,
    clear,
    remove,
    isKey
}

二、在scr同级添加

.env.development

# 开发环境配置
ENV = 'development'
 
#设置端口号
port=8080
 
# 前端请求路径
VUE_APP_BASE_API = '/api'
 
# #后端服务器地址不要忘记添加http或https
# BASE_URL_REAR='http://127.0.0.1:8080/'

.env.production

# just a flag
ENV = 'production'

# base api
VUE_APP_BASE_API = 'http://127.0.0.1:8080'

.env.test

ENV = 'test'
NODE_ENV='test'

三、scr同级添加

vue.config.js

module.exports = {
    devServer: {
        // 默认值 为localhost 127.0.0.1
        // 端口默认为8080
        // host: "localhost",
        // port: "8080",
        // 默认有的
        proxy: {
            "/api": { // 配置你要让那些路径要跨域
                // 你可以让该路径前面添加api
                // login
                // 是后台路径
                target: "http://119.23.246.178:6000", // 38
                // true 代表跨域
                changOrigin: true,
                pathRewrite: { //忽略api ,将api变成空格
                    "^/api": ""
                }
            }
        }
    }
}