通过简单的AJAX递归请求进行多任务的数据自动处理

今天在处理图片时，需要批量对图片进行压缩、加水印等操作，因为程序自动处理次数比较多，图片比较少还好，当有大量图片的时候，系统处理时间会很长，这时异步自动多次请求就是一个比较好的解决方案。

先定制个结构，JS代码如下:

var data = {
    'status'     : 1,
    'code'      : 0,
    'next_url'   : "www.xxx.com",
    'info'      : '开始进行图片解压...'
};

这即是初始化设置，也是后端返回的JSON串标准结构，重要的参数有两个，status是状态，next_url是下次请求的地址，这个是重点，服务端每个处理方法都返回下次请求地址。

接下来是递归方法recursion:

function recursion(data){
	$.ajax({
		url: data.next_url,
		dataType: "json",
		success: function (data) {
			if (data.status == 1) {
				$('.aotuinfo').append('<li class="text-info">'+ data.info +'</li>');
				//递归请求，这里调用自己
				recursion(data);
			} else {
				if(data.status == 99){
					//流程正常结束
					$('.aotuinfo').append('<li class="text-success">'+ data.info +'</li>');
					window.location.reload();
				} else {
					//出现错误终止
					$('.aotuinfo').append('<li class="text-error">'+ data.info +'</li>');                                    
				}
			}
		},
		error: function () {
		  //出现错误终止
		  $('.aotuinfo').append('<li class="text-error">服务器出错！</li>');
		}
	});
}

简言之，通过不断调用自身进行不间断请求，直到所有任务处理完毕。后端代码最后的任务处理成功后返回status=99，用于结束递归调用。

以上就是最简单的实现，也可以在后端任务中加入分页处理，适配大量数据处理等等，灵活加入各种任务进行数据的批量处理。