跨域請求

module.exports = {

  publicPath: "./",

  devServer: {

    open: true,

    proxy: "http://106.15.179.105/api"  //跨域路徑

  },

};

// proxy是代理的意思

// 代理跨域就是在欺騙浏覽器 讓浏覽器認為你通路的還是 同源的localhost：8080 ，但是用代理把位址代理到了需要跨域的位址去了

// 首先第一步把vue.config.js放在項目的根目錄下

// 然後重新開機項目

// 在這裡代理的關鍵字是/api，也就是在之後請求的時候 在路徑前拼接/api

// 如果用http 必須要把baseurl删除

http.js 放在src根目錄下

import Axios from "axios";

var baseURL=('http://106.15.179.105/api');

// module.exports = {

//     publicPath: "./",

//     devServer: {

//       open: true,

//       proxy: "http://106.15.179.105/api"

//     },

//   };

const instance = Axios.create({

  baseURL,

  //請求的基本路徑

  timeout: 5000,

  //逾時時間  超過這個時間就不再執行

});

//建立axios執行個體

// 封裝http方法，如果請求成功就把請求到的資料return 如果響應失敗就執行失敗的catch函數

// data是post的傳參  params是get的傳參

export default function http(url, method, data = {}, params = {}) {

  return instance({

    url: url,

    method: method,

    data: data,

    params: params,

  })

    .then((res) => {

      // console.log(res);

      if (res.status >= 200 && res.status < 300) {

        return res;

      } else {

        return Promise.reject(res.data.meta.msg);

        //如果狀态碼不是200-300的之後就走失敗的回調

      }

    })

    .catch((err) => {

      return Promise.reject(err);

    });

}

// http.js就是封裝的一個 axios請求的方法 後期還要添加一個請求攔截 一個響應攔截

// http.js 是封裝的一個axios方法 比着直接用axios的好處是：可以設定baseurl和timeout

// 怎麼使用：

// 注意 使用http同樣要下載下傳axios

// 在main.js寫上

//import axios from 'axios'

//Vue.prototype.$axios=axios

// 在請求axios 的時候

 // this.$axios({ url: "/resources/carousel", method: "post" }).then((res) => {

      // console.log(res.data);

    });

跨域寫完後，一定要重新開機