前端ajax介面配置封裝

hahadelphi發表於2021-09-09

作為前端人員,前後端互動的時候頁面介面繁多,還不時的更改後端的IP、埠,為了節省工作量,便於日後更改,可以將所有的介面整合在一個檔案裡,統一修改,提高工作效率!

var hostName = "http://192.168.112.8/portalInterface";//介面公共的ip或者域名
//path裡定義了所有的介面
var path = {
    /*資料採集部分*/
    "collectionList": hostName + "/dataunit/list",//獲取採集列表
    "dataAccess": hostName + '/client/list',//查詢客戶端介面
    "collectcode": hostName + '/code',//獲取驗證碼
    "collectlogin": hostName + '/user/login',//登陸
    "collectupdate": hostName + '/user/update',//修改密碼
    "collectlogout": hostName + '/user/logout',//登出介面
    "collectuploadSubmit": hostName + '/upload/uploadSubmit',//檔案上傳
    "collectuplistDataUnit": hostName + '/dataunit/listDataUnit',//資料單元列表介面
    "collectupdataUnitInfo": hostName + '/dataunit/dataUnitInfo',//資料單元詳情介面
    "users": hostName + '/users/',
    "template": hostName + '/dataunit/template',//下載模板
    "checkname": hostName + '/dataunit/checkname',//新建名字查重介面
    "dataUnitSubmit": hostName + '/dataunit/dataUnitSubmit',//儲存單元介面
    "dataKvQuery": hostName + '/redis/query',//KV查詢介面
    "dataKvDelete1": hostName + '/redis/delete',//KV刪除介面
    "dataKvAdded": hostName + '/redis/add',//KV新增介面
    /*清洗加工/應用資訊/滲透測試*/
    "querycleanlists": hostName + '/api/processing/querycleanlists',//清洗列表
    "add": hostName + '/api/processing/add',//清洗新建
    "giveup": hostName + '/api/processing/giveup',//清洗放棄
    "querydetail": hostName + '/api/processing/querydetail',//清洗詳情
    "querylists": hostName + '/api/apply/querylists',//應用列表
    "addPly": hostName + '/api/apply/add',//應用新增新應用
    "upload": hostName + '/api/apply/upload',//應用上傳
    "cancel":hostName+"/upload/cancel",
    "delete": hostName + '/api/apply/delete',//應用單個刪除
    "bathdelete": hostName + '/api/apply/bathdelete',//應用批次刪除
    "securityapply": hostName + '/api/apply/securityapply',//滲透安全申請
    "modiy": hostName + '/api/apply/modiy',//應用修改
    "query": hostName + '/api/apply/query',//滲透單條記錄查詢
    "testreport": hostName + '/api/apply/testreport',//滲透測試報告
    "download": hostName + '/api/processing/download',//滲透下載
    "validate": hostName + '/api/apply/validate/name',//修改名稱
    "applist": hostName + '/api/apply/applist',//應用不登入
    "structure_dataList": hostName + "/structure/dataList",//結構化儲存列表查詢介面
    "structure_delData": hostName + "/structure/delData",//結構化資料刪除介面
    "structure_structureInfo": hostName + "/structure/structureInfo",//結構化資料基礎資訊查詢介面
    "structure_itemList": hostName + "/structure/itemList",//檢視資料介面
    "structure_newData": hostName + "/structure/newData",//新建結構化資料
    "structure_sqlSearch": hostName + "/structure/sqlSearch",//自定義查詢介面
    "apply_addApply": hostName + "/api/apply/addApply",//申請資源介面
    "apply_editApply": hostName + "/api/apply/editApply",//修改資源介面
    "apply_applyDetail": hostName + "/api/apply/applyDetail",//獲取應用資源詳情介面
    "apply_applyList": hostName + "/api/apply/applyList",//獲取資源列表
    "apply_cancelApply": hostName + "/api/apply/cancelApply",//撤回資源申請介面
    "apiquerylists": hostName + "/api/apply/querylists",
    "uploadSubmit": hostName + "/upload/uploadSubmit",
    "dataUnitInfo": hostName + "/dataunit/dataUnitInfo",
    //運算元演算法
    'arithmeticDetailList':hostName + '/algorithm/algorithmDetailList',
    'algorithmDownload':hostName + '/algorithm/algorithmDownload',
    //爬蟲資料
    'dirList': crawlerUrl + '/crawl/dirList',
    'dirDetail': crawlerUrl + '/crawl/dirDetail',
    //圖資料
    'getLabelAndType': hostName + '/graphService/getLabelAndType',//獲取節
};
var get = function (url, data, success, error) {
    var option = {
        method: 'get',
        url: url,
        async: 'false',
        contentType: "application/x-www-form-urlencoded; charset=UTF-8",
        data: data,
        success: success,
        error: error
    };
    $.ajax(option);
};
var post = function (url, data, success, error) {
    var option = {
        method: 'post',
        url: url,
        async: 'false',
        data: data,
        dataType: 'json',
        success: success,
        error: error
    };
    $.ajax(option);
};
var jsonp = function (url, data, success, error) {
    var option = {
        method: 'post',
        url: url,
        async: 'false',
        data: data,
        dataType: "jsonp",
        success: success,
        error: error,
    };
    $.ajax(option);
};
var jsonp1 = function (url, data, success, error) {
    var option = {
        type: 'get',
        url: url,
        async: 'false',
        data: data,
        dataType: "jsonp",
        success: success,
        error: error,
    };
    $.ajax(option);
};
};

以上列舉了json及jsonp請求的get與post方法,呼叫的時候直接傳參就行了!

來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/2471/viewspace-2799217/,如需轉載,請註明出處,否則將追究法律責任。

相關文章