I don't know if the following ideas are correct. If there are any mistakes, please correct them.
requirement analysis
There are a lot of devices, a lot of them need to open the remote driver (that is, call the remote driver interface of the background). The problem is that the remote driver of the background processing can only be handled by one device. If the number of devices is large, the php of the background processing will be out of time within 30 seconds.
Initially, all the devices were handed over to the background and the interface was requested only once. As a result, the request was often timed out (unavailable).
Because the background can't process so much data at one time, the request timeoutThe second idea is to group all devices, such as three groups, and then loop through the grouped list array to make access requests with closures inside the loop.
As a result, many ajax requests are made at the same time, and no hooks are available for all requests to end.The third idea (our boss's idea): Simulate threading operations, simulate opening multiple threads at the same time, all requests, i.e. device lists, are placed in a thread pool (array). The work of each thread can only continue to get new tasks (i.e. sending new requests) in the thread pool after the completion of this work, so that the number of simultaneous requests (threads) can be controlled. ) And the hook at the end of the request.
Code
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <!-- A panel that drives the results (requests from each thread) to be displayed in real time --> <div id="drivepanel"></div> </body> <script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script> <script> /* * Parameter List: List Array of Drivers, Driving Time */ var drivelist = [1,2,3,4,5,6,7,8,9,10]; // List of devices to be driven var drivetime = 5; // Driving time var dom = $("#drivepanel"); // Get the object return ed by the underlying function var runui = rundeviceui(); //Pass in the panel that needs to be displayed to the underlying function runui.init(dom); //Starter function runui.start(drivelist,drivetime,function(){ //Program in operation console.log('The program is running!'); },function(){ //End of Program Running ____________ console.log("The program is finished!"); }) //Bottom Function of Driving Equipment function rundeviceui() { return { init:function(context){ this.context = context; this.r_init(); this.c_init(); }, list:[], // List array, thread pool (each item in the list corresponds to a task) drivetime:0, //Driving time onrun:null, //Runtime function onend:null, //End-of-run function runnumber:3, //Number of threads open at the same time c_init:function(){ //Initialize some operations }, r_init:function(){ //Binding event operation }, start:function(list,drivetime,onrun,onend){ //Starter function var me = this; this.list = list; this.drivetime = drivetime; this.onrun = onrun; this.onend = onend; //Open panel display this.context.show(); this.run(me.runnumber,function(){ me.onend(); }) }, run:function(number,onend){ //Runtime function var me = this; var runnow = 0; //Number of threads running for(var i=0; i<number; i++){ runnow++; setTimeout(_run); //Open pre-set threads (runnumber) in turn } function _run(){ var data = me.list.shift(); //Tasks taken from the thread pool if(!data){ //If there is no task in the thread pool, call the end function _runend() }else{ console.log('run',data); var selfFun = arguments.callee; //Current function me.showStatus(data,'It has been submitted for processing!'); // Hook in Program Running me.onrun && me.onrun(); //Call request interface me.ajaxFn(data,drivetime,function(){ var status = "Handle successfully!"; me.showStatus(data,status); setTimeout(selfFun); //Call yourself again }) } } // End function // When the task in the thread pool is processed, the _runend function is executed, and then the thread thread decreases. When the number of running threads is zero, the task completion function is invoked. function _runend(){ runnow--; if(runnow <= 0){ onend && onend(); } } }, showStatus:function(devicecode,status){ //The panel displays the real-time status of the request var me = this; //Create list dom elements, using devicecode as the name value var dom = this.context.find("[name="+ devicecode +"]"); if(dom.length <= 0){ //If the dom element does not exist, create dom = this.c_getrow(devicecode,status); } //If the dom element already exists, attach the appropriate status value to it dom.html(devicecode + ":" + status); }, c_getrow:function(devicecode,status){ //Create dom elements var me = this; var dom = $("<div></div>").attr('name',devicecode); this.context.append(dom); return dom; }, //Analog Background Request Interface ajaxFn:function(data,time,fn,fnerr){ // Da Da, Da Da, Send an ajax request. Failure of the request is not considered for the time being. setTimeout(function(){ fn && fn(); },3000); } } } </script> </html>