JS跨域获取数据

最新推荐文章于 2023-06-25 12:17:23 发布

原创最新推荐文章于 2023-06-25 12:17:23 发布 · 277 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #ViewUI

Web前端专栏收录该内容

20 篇文章

订阅专栏

项目中遇到一个需求，数据是通过跨域获取的，在百度查了下，跨域获取数据主要有以下几种方式：

A. 嵌套iframe；

B.服务器端充当中转代理方式有很多可以由服务器端程序实现，也可以修改服务器配置实现，下面举例Apache 重写（ mod_rewrite proxy 模式）方式：

在Apache 的安装目录下的 conf/httpd.conf 文件添加如下语句：

LoadModule proxy_module modules/mod_proxy.so

LoadModule proxy_http_module modules/mod_proxy_http.so

LoadModule rewrite_module modules/mod_rewrite.so

RewriteEngine On

RewriteRule ^/_proxy/(.*)$ http://$1 [P,L]

C.JS文件注入,因为script的src属性可以跨域的，Jquery.ajax()也是用这种方式实现跨域。

以下C方式的实现代码：

TEST.JsLoader.scriptId = 1;
TEST.JsLoader.prototype.load = function(src, doc, charset) {
    var sId = TEST.JsLoader.scriptId;
    TEST.JsLoader.scriptId++;
    var o = this;
    setTimeout(function() {
        o._load2.apply(o, [sId, src, doc, charset]);
        o = null;
    },
    0);
}
TEST.JsLoader.prototype._load2 = function(sId, src, doc, charset) {
    _doc = doc || document;
    charset = charset || "gb2312";
    var _ie = TEST.userAgent.ie,
    _js = _doc.createElement("script");
    TEST.event.addEvent(_js, (_ie ? "readystatechange": "load"), (function(o) {
        return (function() {
            if (_ie) {
                if (_js && !(_js.readyState == "complete" || _js.readyState == "loaded")) {
                    return;
                }
            }
            o.onload();
            if (!o.debug) {
                TEST.dom.removeElement(_js);
            }
            _js = null;
        });
    })(this));
    if (!_ie) {
        TEST.event.addEvent(_js, "error", (function(o) {
            return (function() {
                o.onerror();
                if (!o.debug) {
                    TEST.dom.removeElement(_js);
                }
                _js = null;
            });
        })(this));
    }
    _js.id = "js_" + sId;
    _js.defer = true;
    _js.charset = charset;
    _js.src = src;
    _doc.getElementsByTagName("head")[0].appendChild(_js);
};
TEST["js" + "Loader"] = TEST.JsLoader;

调用列子：

var jsLoader = new TEST.JsLoader(); 
//onload加载完JS后响应
jsLoader.onload = function(){
	
}
jsLoader.load('http://test.js');