zoukankan      html  css  js  c++  java
  • 原生ajax方法封装

    /**
    * @function ajax request
    * @fields ajaxName:请求名称,method:请求方法,headers:setRequestHeader自定义部分,url:接口地址,async:是否异步请求,withCredentials:是否支持跨域发送cookie,dataType:数据类型 ,data:post请求参数
    * @param data:{ajaxName:"ajaxNameString",headers:{},method:"GET/POST",url:"",async:true/false,withCredentials:true/false,dataType:"json",data:""}
    * @result ajaxName.responseText
    */
    function ajaxRequest (data, callback) {
    data = data || {}
    data.dataType = data.dataType || 'json'
    var sendParams = null
    var headers = data.headers || {}
    var ajax = data.ajaxName
    // 新建请求
    if (window.XMLHttpRequest) {
    ajax = new XMLHttpRequest()
    } else {
    ajax = new ActiveXObject('Microsoft.XMLHTTP')
    }
    // 打开请求
    ajax.open(data.method.toUpperCase(), data.url, data.async)
    // 是否支持跨域发送cookie
    ajax.withCredentials = data.withCredentials
    ajax.setRequestHeader("Content-type", data.contentType || "application/x-www-form-urlencoded")
    // POST请求设置
    if (data.method == 'POST') {
    for (var i in headers) {
    ajax.setRequestHeader(i, headers[i])
    }
    if (data.data) {
    sendParams = data.data
    }
    }
    // 发送请求
    ajax.send(sendParams ? sendParams : null)
    // 注册事件
    ajax.onreadystatechange = function () {
    if (window.location.origin + '/login/index' === ajax.responseURL) {
    window.location.reload()
    window.location.href = window.location.origin + '/login/index'
    return
    }
    callback(ajax)
    }
    }

    /**
    * GET
    * @param ajaxName 请求名称
    * @param requestUrl 请求接口地址
    * @param async 是否异步请求
    * @param callBack 回调函数
    * @param contentType 请求类型
    */
    function ajaxGetData (ajaxName, requestUrl, async, callBack, contentType) {
    ajaxRequest({
    ajaxName: ajaxName,
    contentType: contentType || "application/json;charset=utf-8",
    method: "GET",
    url: requestUrl,
    async: async,
    cache: false,
    withCredentials: true,
    dataType: "json"
    }, function callback (ajax) {
    if (ajax.status == 200 && ajax.readyState == 4) {
    callBack(ajax.responseText)
    }
    })
    }

    /**
    * 拼接GET请求url参数
    * @param url
    * @param params
    * @returns {string}
    */
    function formateGetUrl (url, params) {
    var resultParams = ''
    for (var key in params) {
    resultParams = resultParams + '&' + key + '=' + params[key]
    }
    return url + '?' + resultParams.substr(1)
    }

    /**
    * POST
    * @param ajaxName 请求名称
    * @param requestUrl 请求接口地址
    * @param async 是否异步请求
    * @param callBack 回调函数
    * @param contentType 请求类型
    */
    function ajaxPostData (ajaxName, requestUrl, params, async, callBack, contentType) {
    var resultParams = ''
    if (!contentType || contentType === "application/x-www-form-urlencoded;charset=utf-8") {
    for (var key in params) {
    resultParams = resultParams + '&' + key + '=' + encodeURIComponent(params[key])
    }
    } else {
    resultParams = params && JSON.stringify(params)
    }
    ajaxRequest({
    ajaxName: ajaxName,
    headers: {},
    contentType: contentType || "application/x-www-form-urlencoded;charset=utf-8",
    method: "POST",
    dataType: "json",
    url: requestUrl,
    processData: true,
    async: async,
    data: resultParams
    }, function callback (ajax) {
    if (ajax.status == 200 && ajax.readyState == 4) {
    callBack(ajax.responseText)
    }
    })
    }
  • 相关阅读:
    Tomcat控制台日志乱码
    springboot中使用poi读取Excel数据,导出数据
    Linux系统下ctrl+z挂起进程后怎么恢复
    JSONObject与String、实体类互相转换
    用xshell连接VMware中的Linux的方法步骤(2种)
    vm虚拟机的安装以及linux系统centos的装载
    mysql的安装
    IDEA中使用debug进行调试的简单介绍
    Springboot整合Mybatis
    java读取txt文件封装成对象批量插入数据库的实例
  • 原文地址:https://www.cnblogs.com/Man-Dream-Necessary/p/8659463.html
Copyright © 2011-2022 走看看