前端技术

请求防重处理方法

2018-08-16  本文已影响263人  忍不住的k

请求防重处理

请求防重思路:用url,params生成一个hash值,放再一个数组里面存起来,每次调用ajax请求函数,发送请求之前,生成hash值,判断是否已经在数组里面,如果存在就不发请求,如果不存在就存入数组并发出请求,有响应之后再从数组里删掉,

         //生成hash随机字符串
        function hash(input){
            var I64BIT_TABLE =
                'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789_-'.split('');
            var hash = 5381;
            var i = input.length - 1;
    
            if(typeof input == 'string'){
                for (; i > -1; i--)
                    hash += (hash << 5) + input.charCodeAt(i);
            }
            else{
                for (; i > -1; i--)
                    hash += (hash << 5) + input[i];
            }
            var value = hash & 0x7FFFFFFF;
    
            var retValue = '';
            do{
                retValue += I64BIT_TABLE[value & 0x3F];
            }
            while(value >>= 6);
    
            return retValue;
        }
        var xhrRequest = $.ajax;//jquery的ajax请求
        var ajaxUrl = [];//把哈希值缓存在数组里
        
             function ajax(options) {
                var ajaxUrlItem = hash(options.url + JSON.stringify(options.data));//拼接url地址和json字符串参数
                if (ajaxUrl.indexOf(ajaxUrlItem) != -1) return;//如果哈希值在数组里面,则不发请求
                ajaxUrl.push(ajaxUrlItem);//否则放进数组
                xhrRequest({
                    data: options.data || {},
                    url: options.url,
                    contentType: options.contentType,
                    type: options.type,
                    beforeSend: function beforeSend(request) {
                        options.beforeSend && options.beforeSend(request);
                    },
                    success: function success(data) {
                        ajaxUrl.splice(ajaxUrl.indexOf(ajaxUrlItem), 1);//有相应了,从数组删除对应的hash
                            options.success && options.success(data);//请求成功调用回调函数
                    },
                    error: function error(data) {
                        //失败操作
                        console.log(data);
                    }
                });
            }
      
上一篇下一篇

猜你喜欢

热点阅读