返回列表

前端MVC框架[01] 发送JSONP请求

默认分类 2012-11-06 15:02:33

    /** 
     * 发送JSONP请求
     * 
     * @public
     * @param {url String} 请求的地址
     * @param {data String|Object} 发送的参数
     * @param {onsuccess String} 回调函数
     * @param {action String|Object} 发送请求的Action
     * @return {void} 
     */
    Requester = {};  
    /** 
     * JSONP回调接口MAP 
     */  
    Requester.proxy = {};  
    Requester.JSONP = function (url, data, onsuccess, action) {
        var me = this,
        //获取可用JSONP对象, 不存在则自动生成
        proxy = me.getValidProxy(action);
        
        proxy['action'] = action;
        proxy['onsuccess'] = onsuccess;
        proxy['status'] = 'send';
        document.getElementById(proxy['id']).src = url + '?rand='+Math.random()+'&callback=Requester.proxy["'+proxy['id']+'"].callback';  
    };
    /**
     * 返回可用JSONP对象
     * 
     * @private
     * @return {Object}
     */
    Requester.getValidProxy = function() {
        var me = this;
        return me.createProxy();
    };
    /**
     * 工厂模式创建JSONP对象
     *
     * @param {id String} 唯一标识
     * @return {void} 
     */
    Requester.createProxy = function(id){
        //this->window.Requester
        var me = this,
            proxy = {};

        proxy.id = id || (new Date()).getTime() + '' + Math.random();
        proxy.status = 'finished';
        proxy.callback = me.creatProxyCallback();
        
        var script = document.createElement('script');       
        script.id = proxy.id;
        script.type = 'text/javascript';
        script.charset = 'utf-8';
        document.getElementsByTagName('head')[0].appendChild(script);
        script = null;

        Requester.proxy[proxy.id] = proxy;

        return proxy;
    };
    /**
     * 工厂模式创建JSONP对象回调接口
     *
     * @return {void} 
     */
    Requester.creatProxyCallback = function(){
        return function(data) {
            //this->JSONP Object
            var proxy = this,
                errorMap,
                key, 
                input, 
                formMap = {}; 

            proxy.status="finished";
            
            //当后端验证失败时, 调用系统验证接口
            if (data && proxy.action && String(data.success).replace(/\s/ig,'').toLowerCase() !== 'true' ) { 
                if (Requester.backendError) {
                    Requester.backendError(data);
                }
            } 
            
            //调用用户传入的回调接口
            if (proxy.onsuccess) {
                proxy.onsuccess(data);
            }
        }
    };
    
    /*============================================
     * Requester扩展模块 - JSONP请求池[可选功能]
     ============================================*/
    /**
     * 返回可用JSONP对象
     * 
     * @private
     * @return {id String} 唯一标识
     */
    Requester.getValidProxy = function() {
        var me = this,
            i,
            proxy = null,
            script;
        
        //查找可用JSONP对象
        for (i in me.proxy) {
            if (i && me.proxy[i] && me.proxy[i].status == 'finished') {
                script = document.getElementById(i);
                if (script && window.addEventListener) {
                    script.parentNode.removeChild(script);
                    proxy = me.createProxy(i);
                }
                break;
            }
        }
        
        return (proxy || me.createProxy());
    };
    
    Requester.JSONP('http://www.5imemo.com/other/ajax/jsonp.php','',function(data){  
        alert(data.id)
    });