//import { baseUrl } from '@/utils/global'
 
export default {
  method: 'get',
  // 基礎(chǔ)url前綴
  baseUrl: process.env.BASE_URL,
  // 請(qǐng)求頭信息
  headers: {
    'Content-Type': 'application/json;charset=UTF-8'
  },
  // 參數(shù)
  data: {},
  // 設(shè)置超時(shí)時(shí)間
  timeout: 10000,
  // 攜帶憑證
  withCredentials: true,
  // 返回?cái)?shù)據(jù)類型
  responseType: 'json'
}

import axios from 'axios'
 
const request = axios.create({
    baseURL: '/api',  // 注意！！ 這里是全局統(tǒng)一加上了 '/api' 前綴，也就是說所有接口都會(huì)加上'/api'前綴在，頁面里面寫接口的時(shí)候就不要加 '/api'了，否則會(huì)出現(xiàn)2個(gè)'/api'，類似 '/api/api/user'這樣的報(bào)錯(cuò)，切記?。?！
    timeout: 5000
})
 
// request 請(qǐng)求器
// 可以自請(qǐng)求發(fā)送前對(duì)請(qǐng)求做一些處理
// 比如統(tǒng)一加token，對(duì)請(qǐng)求參數(shù)統(tǒng)一加密
request.interceptors.request.use(config => {
    if(config && config.headers){
        config.headers['Content-Type'] = 'application/json;charset=utf-8';
    }
    // config.headers['token'] = user.token;  // 設(shè)置請(qǐng)求頭
    return config
}, error => {
    return Promise.reject(error)
});
 
// response 攔截器
// 可以在接口響應(yīng)后統(tǒng)一處理結(jié)果
request.interceptors.response.use(
    response => {
        let res = response.data;
        // 如果是返回的文件
        if (response.config.responseType === 'blob') {
            return res
        }
        // 兼容服務(wù)端返回的字符串?dāng)?shù)據(jù)
        if (typeof res === 'string') {
            res = res ? JSON.parse(res) : res
        }
        return res;
    },
    error => {
        console.log('err' + error) // for debug
        return Promise.reject(error)
    }
)
export default request

import axios from "../axios";
 
export const alldata=(data)=>{
  return axios({
    url:'/article/data',
    method:'post',
    data
  })
}
 
export default {alldata}

npm i axios -g

import axios from 'axios'
 
app.config.globalProperties.$http=axios;

// 配置跨域
const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true,
  // lintOnSave:false,
  devServer: {
    port: 8080, // 端口
    proxy: {
      '/api': {  //   若請(qǐng)求的前綴不是這個(gè)'/api'，那請(qǐng)求就不會(huì)走代理服務(wù)器
        target: 'http://156.61.146.85:8078',  //這里寫路徑 
        pathRewrite: { '^/api': '' }, //將所有含/api路徑的，去掉/api轉(zhuǎn)發(fā)給服務(wù)器
        ws: true,  //用于支持websocket
        changeOrigin: true   //用于控制請(qǐng)求頭中的host值
      },
    }
  }
 
})

import { reactive,onMounted} from "vue";
import {alldata} from "@/http/Home/home.js"
    export default {
    name: "app",
      setup(){
        const datas = reactive({
          value:[],
        })
        const methods = {
          requestall(){
            const data={
              pageNum:10,
              pageSize:5,
              articieId:100,
            };
            alldata(data).then(res => {
              datas.value=res
              console.log(res);
            }).catch(err => {
              console.log(err)
            })
          }
        }
        onMounted(()=>{
          methods.requestall()
        })
        return{
          ...methods
        }
      }
    }