前端技术

原生js发送ajax请求

2019-11-04  本文已影响0人  时间走了光
var Ajax = {
    get: function (url, fn) {
        // 创建 XMLHttpRequest 对象
        var xhr = new XMLHttpRequest();
        // 使用open()方法发送请求,请求方式有两种 - get,post
        // open(method, url, async, username, password)
        /* method 参数是用于请求的 HTTP 方法。值包括 GET、POST 和 HEAD。
        url 参数是请求的主体。大多数浏览器实施了一个同源安全策略,
        并且要求这个 URL 与包含脚本的文本具有相同的主机名和端口。
         async 参数指示请求使用应该异步地执行。如果这个参数是 false,请求是同步的,
         后续对 send() 的调用将阻塞,直到响应完全接收。如果这个参数是 true 或省略,请求是异步的,
         且通常需要一个onreadystatechange 事件句柄。
        username 和 password 参数是可选的,为 url 所需的授权提供认证资格。
        如果指定了,它们会覆盖 url 自己指定的任何资格。*/
        xhr.open('GET', url, true);
        xhr.setRequestHeader('Content-Type','application/x-www-form-urlencode;charset=utf-8');
        // 每当readyState改变时就会触发onreadystatechange函数
        // 0: 请求未初始化
        // 1: 服务器连接已建立
        // 2: 请求已接收
        // 3: 请求处理中
        // 4: 请求已完成,且响应已就绪
        xhr.onreadystatechange = function () {
            if (xhr.readyState === 4 && xhr.status === 200) {
                fn.call(this, xhr.responseText)
            }
        };
        xhr.send()
    },
    post: function (url, data, fn) {
                var xhr = new XMLHttpRequest();
                xhr.open("POST", url, true);
                // 添加http头,发送信息至服务器时内容编码类型
                xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
                xhr.onreadystatechange = function() {
                    if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 304)) {
                        fn.call(this, xhr.responseText);
                    }
                };
                //发送数据
                xhr.send(data);
            }
}
// http://192.168.107.230:8608/emu
Ajax.get('/emu/mf/resourceinfo.do?method=getMapIp', getDatas)
var bmapcfg = {};
function getDatas (val) {
    let resData = JSON.parse(val);
    console.log('///', resData);
}
上一篇 下一篇

猜你喜欢

热点阅读