<center>ajax同域跨域jsonp函数封装</center>

小灰灰 2021-11-23 03:38 386阅读 0赞

function ajax(opt) {
        opt = opt || {};                                     // 对实参处理
        var xmlhttp, method, url, async, dataType, data;
        method = opt.method || 'GET';                        // 默认method为GET
        method = trim(method).toUpperCase();                 //转换成大写并去除空格
        url = opt.url                                        //请求地址
        url = trim(url);
        async = opt.async || true;                           // 默认为异步请求
        dataType = opt.dataType || 'HTML';                   // 设置跨域
        dataType = trim(dataType).toUpperCase();
        data = opt.data || {};                              // 发送参数
        function trim(str) {
            return str.replace(/^\s+|\s+$/g, "");           // 删除左右空格
        };
        var formatParams = function () {                    // 定义格式化参数函数
            if (typeof (data) == "object") {
                var str = "";
                for (var key in data) {
                    str += key + "=" + data[pro] + "&";
                }
                data = str.substr(0, str.length - 1);
            }
            if (method == 'GET' || dataType == 'JSONP') {
                if (url.lastIndexOf('?') == -1) {
                    url += '?' + data;
                } else {
                    url += '&' + data;
                }
            }
        }
        if (window.XMLHttpRequest) {                       // 创建XMLHttpRequest对象
            //Chrome || Firefox
            xmlHttp = new XMLHttpRequest();
        } else {
            //IE
            xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
        }                                        
        if (dataType == 'JSONP') {                                                // 跨域请求
            if (typeof (opt.beforeSend) == 'function') opt.beforeSend(xmlHttp);
            var callbackName = ('jsonp_' + Math.random()).replace(".", "");
            var oHeader = document.getElementsByTagName('header')[0];
            data.callback = callbackName;
            var ele = document.createElement('script');
            ele.type = "text/javascript";
            ele.onerror = function () {
                console.log('failed');
                opt.error && opt.error("failed");
            };
            oHeader.appendChild(ele);
            window[callbackName] = function (json) {
                oHeader.removeChild(ele);
                window[callbackName] = null;
                opt.success && opt.success(json);
            };
            formatParams();
            ele.src = url;
            return;
        } else {
            formatParams();
            xmlHttp.open(method, url, async);
            xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded;charset=utf-8");     // 设置响应头
            if (typeof (opt.beforeSend) == 'function') opt.beforeSend(xmlHttp);
            xmlHttp.send(data);                                       // 发送请求
            xmlHttp.onreadystatechange = function () {                 // 响应处理
                if (xmlHttp.status != 200) {
                    console.log(xmlHttp.status + 'failed');
                    opt.error && opt.error(xmlHttp.status + 'failed');
                    return;
                }
                if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
                    if (dataType == 'JSON') {
                        try {
                            res = JSON.parse(xmlHttp.responseText);
                        } catch (e) {
                            console.log('json格式错误');
                            opt.error('json格式错误');
                        }
                    } else if (dataType == 'XML') {
                        res = xmlHttp.responseXML;
                    } else {
                        res = xmlHttp.responseText;
                    }
                    opt.success && opt.success(res);
                }
            }
        }
    }

发表评论取消回复

表情：

评论列表（有 0 条评论，386人围观）

还没有评论，来说两句吧...

相关阅读

相关 jsonp跨域

首先我们来说说什么是跨域　　跨域：是指从一个域名的网页去请求另一个域名的资源。比如从www.baidu.com 页面去请求 www.google.com 的资源。但

心已赠人/ 2023年06月05日 05:56/ 0 赞/ 29 阅读

相关 jsonp跨域

我是做的一个跨站显示信息！！鄙人文化不高，代码不严谨，仅供参考！题目：用户在a站访问过的商品足迹可以在登录b站之后查看足迹！首先创建两个域名www.a.com

谁借莪１个温暖的怀抱￠/ 2022年07月15日 13:52/ 0 赞/ 286 阅读

相关 jsonp跨域

jsonp跨域 Web页面上调用js文件时则不受是否跨域的影响（不仅如此，我们还发现凡是拥有”src这个属性的标签都拥有跨域的能力，比如`<script>、<img>、<

た入场券/ 2022年07月12日 02:26/ 0 赞/ 357 阅读

相关 JSONP跨域

$.getJSON("http://172.16.1.192:8081/common/common/getProjectList?date=1490776290436"

比眉伴天荒/ 2022年06月18日 04:10/ 0 赞/ 306 阅读

相关封装jsonp跨域请求

(function(window,document,undefined){ // url = http://ssss?dsf=sdfs&

以你之姓@/ 2022年06月11日 03:52/ 0 赞/ 283 阅读

相关原生JS封装jsonp跨域

// jsonp 跨域封装 // jsonp\_key => 前端发给后端函数名时使用的字段名; function jsonp(url, jsonp_key) {

桃扇骨/ 2022年04月23日 11:38/ 0 赞/ 250 阅读

相关 JSONP跨域和CORS跨域

什么是跨域？跨域：指的是浏览器不能执行其它网站的脚本，它是由浏览器的同源策略造成的，是浏览器的安全限制！同源策略同源策略：域名、协议、端口均相同。浏览器

喜欢ヅ旅行/ 2022年02月04日 11:27/ 0 赞/ 448 阅读

相关 jsonp跨域

1 (function(window, document, undefined) { 2 'use strict'; 3 var jsonp

╰半橙微兮°/ 2021年12月24日 02:17/ 0 赞/ 430 阅读

相关 <center>ajax同域跨域jsonp函数封装center>

function ajax(opt) { opt = opt || {}; //

小灰灰/ 2021年11月23日 03:38/ 0 赞/ 387 阅读

相关 jsonp跨域

域指的就是域名。域名对应的是一个IP地址。域名与IP地址的对应关系存储在域名服务器上。（DNS）所谓跨域　　1.就是跨域名，跨端口，跨协议

Love The Way You Lie/ 2021年09月20日 14:10/ 0 赞/ 522 阅读