1: 建立一個 http.js

import Vue from 'vue';
   
let http={}
// nginx 作為代理伺服器，解決跨域問題
// let _baseURL="vpaas"


// 用 CorsFilter 解決前臺跨域
let _baseURL = 'http://localhost:8080/';
let ContentType = "application/json";
// http.baseURL = _baseURL;


http.request = function(opt) {
    opt = opt || {};
    opt.method = opt.method.toUpperCase() || 'POST';
    opt.url = _baseURL + (opt.url || '');
    opt.async = opt.async || true;
    opt.data = opt.data || null;
    opt.success = opt.success || function () {};
    // 建立ajax 物件
    var xmlHttp = null;
    if (XMLHttpRequest) {
        xmlHttp = new XMLHttpRequest();
    }
    else {
        xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');
    }
    // 將傳入的引數轉換成一個數組物件
    var params = [];
    for (var key in opt.data){
        params.push(key + '=' + opt.data[key]);
    }


    var postData = params.join('&');
    //post 方法
    if (opt.method.toUpperCase() === 'POST') {
        xmlHttp.open(opt.method, opt.url, opt.async);
        xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded;charset=utf-8');
        xmlHttp.send(postData);
    }
    // get 方法
    else if (opt.method.toUpperCase() === 'GET') {
        xmlHttp.open(opt.method, opt.url + '?' + postData, opt.async);
        xmlHttp.send(null);
    } 
    // 讀取請求相應的狀態
    xmlHttp.onreadystatechange = function () {
        if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
            //請求成功時，執行這個函式
            opt.success(xmlHttp.responseText);
        }
    };
}
// 態在AJAX中共有5種，分別是。
// 0 - (未初始化)還沒有呼叫send()方法
// 1 - (載入)已呼叫send()方法，正在傳送請求
// 2 - (載入完成)send()方法執行完成，
// 3 - (互動)正在解析響應內容
// 4 - (完成)響應內容解析完成，可以在客戶端呼叫了


//export與export default均可用於匯出常量、函式、檔案、模組等，
//你可以在其它檔案或模組中通過import+(常量 | 函式 | 檔案 | 模組)名的方式，將其匯入，
//以便能夠對其進行使用，但在一個檔案或模組中，export、import可以有多個，export default僅有一個。 
export default http;

2: 使用