torchv-translate 1.0.5 → 1.0.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "torchv-translate",
-  "version": "1.0.5",
+  "version": "1.0.7",
   "description": "Two lines of js realize automatic html translation. No need to change the page, no language configuration file, no API key, SEO friendly!",
   "main": "index.js",
   "exports": {

package/translate.js/translate.js

@@ -2086,8 +2086,13 @@ var translate = {
 		20 浏览器缓存渲染完毕，ajax通过文本翻译接口开始请求，在发起ajax请求前，状态变为20，然后再发起ajax请求
 		至于翻译完毕后进行渲染，这个就不单独记录了，因为如果页面存在不同的语种，不同的语种是按照不同的请求来的，是多个异步同时进行的过程
 	*/
-	state:0,
-
+	state:0,
+
+	/*
+		取消翻译任务的版本号（路由切换时+1），用于忽略未完成的翻译请求
+	*/
+	cancelVersion:0,
+
 
 	/*
 		等待翻译队列  v3.12.6 增加
@@ -2095,45 +2100,72 @@ var translate = {
 		当执行 translate.execute() 时，会先判断状态 translate.state 是否是0空闲的状态，如果空闲，才会执行，如果不是空闲，则不会执行，而是进入到这里进行等待，等待执行完毕后 translate.state 变成0空闲之后，再来执行这里的
 		
 	*/
-	waitingExecute:{
-		use:true, //默认是使用，自有部署场景不担心并发的场景，可以禁用，以提高用户使用体验。
-
-		/*
-			一维数组形态，存放执行的翻译任务
-			二维对象形态，存放执行传入的 docs
-		*/
-		queue:[],
-		/*
-			增加一个翻译任务到翻译队列中
-			docs 同 translate.execute(docs) 的传入参数
-		 */ 
-		add:function(docs){
-			//向数组末尾追加
-			translate.waitingExecute.queue.push(docs);
-			//开启一个定时器进行触发
-			let intervalId = setInterval(function() {
-				if(translate.state == 0){
-					//清除定时器，结束循环
-					clearInterval(intervalId);
-					var docs = translate.waitingExecute.get();
-					translate.execute(docs);
-					//console.log('stop waitingExecute setInterval');
-				}
-			}, 500);
-		},
+	waitingExecute:{
+		use:true, //默认是使用，自有部署场景不担心并发的场景，可以禁用，以提高用户使用体验。
+
+		/*
+			一维数组形态，存放执行的翻译任务
+			二维对象形态，存放执行传入的 docs
+		*/
+		queue:[],
+		//等待队列使用的定时器id集合，便于取消
+		intervalIds:[],
+		/*
+			增加一个翻译任务到翻译队列中
+			docs 同 translate.execute(docs) 的传入参数
+		 */ 
+		add:function(docs){
+			//向数组末尾追加
+			translate.waitingExecute.queue.push(docs);
+			//开启一个定时器进行触发
+			let intervalId = setInterval(function() {
+				if(translate.state == 0){
+					//清除定时器，结束循环
+					clearInterval(intervalId);
+					//移除记录
+					for(var iid = translate.waitingExecute.intervalIds.length - 1; iid >= 0; iid--){
+						if(translate.waitingExecute.intervalIds[iid] === intervalId){
+							translate.waitingExecute.intervalIds.splice(iid, 1);
+							break;
+						}
+					}
+					if(translate.waitingExecute.queue.length < 1){
+						return;
+					}
+					var docs = translate.waitingExecute.get();
+					if(docs != null){
+						translate.execute(docs);
+					}
+					//console.log('stop waitingExecute setInterval');
+				}
+			}, 500);
+			translate.waitingExecute.intervalIds.push(intervalId);
+		},
 		/*
 			从 quque 中取第一个元素，同时将其从queue中删除掉它。
 			如果取的时候 quque已经没有任何元素了，会返回 null， 但是理论上不会出现null
 		 */
-		get:function(){
-			//使用 shift 方法删除数组的第一个元素，并将第一个元素的值返回
-			if(translate.waitingExecute.queue.length > 0){
-				return translate.waitingExecute.queue.shift();
-			}else{
-				translate.log('警告， translate.waitingExecute.get 出现异常，quque已空，但还往外取。');
-				return null;
-			}
-		},
+		get:function(){
+			//使用 shift 方法删除数组的第一个元素，并将第一个元素的值返回
+			if(translate.waitingExecute.queue.length > 0){
+				return translate.waitingExecute.queue.shift();
+			}else{
+				translate.log('警告， translate.waitingExecute.get 出现异常，quque已空，但还往外取。');
+				return null;
+			}
+		},
+		/*
+			清空等待队列，并取消定时器
+		*/
+		clear:function(){
+			translate.waitingExecute.queue = [];
+			if(typeof(translate.waitingExecute.intervalIds) != 'undefined' && translate.waitingExecute.intervalIds.length > 0){
+				for(var i = 0; i < translate.waitingExecute.intervalIds.length; i++){
+					clearInterval(translate.waitingExecute.intervalIds[i]);
+				}
+				translate.waitingExecute.intervalIds = [];
+			}
+		},
 		/*
 			当前 translate.translateRequest[uuid] 的是否已经全部执行完毕
 			这里单纯只是对 translate.translateRequest[uuid] 的进行判断
@@ -2151,28 +2183,38 @@ var translate = {
 			@param result 本次网络请求的结果， 1成功， 0失败。  网络不通，翻译结果返回result非1都是记入0
 			@param info 如果result为0，这里是失败信息
 		*/
-		isAllExecuteFinish:function(uuid, from, to, result, info){
-
-			translate.listener.execute.renderFinishByApiRun(uuid, from, to);
-
-			//通过 uuid、from 取得本次翻译相关的 texts、nodes , 触发 translateNetworkAfter_Trigger 钩子
-			//获取请求日志
-			var requestData = translate.request.data[uuid].list[from][to];
-			translate.lifecycle.execute.translateNetworkAfter_Trigger({
-				uuid: uuid,
-				from: from,
-				to: to,
-				texts: requestData.texts,
-				nodes: requestData.nodes,
-				result: result,
-				info: info
-			});
-
-			//console.log('uuid:'+uuid+', from:'+from+', to:'+to);
-			for(var lang in translate.translateRequest[uuid]){
-				if (!translate.translateRequest[uuid].hasOwnProperty(lang)) {
-		    		continue;
-		    	}
+		isAllExecuteFinish:function(uuid, from, to, result, info){
+
+			translate.listener.execute.renderFinishByApiRun(uuid, from, to);
+
+			//通过 uuid、from 取得本次翻译相关的 texts、nodes , 触发 translateNetworkAfter_Trigger 钩子
+			//获取请求日志
+			if(typeof(translate.request) === 'object'
+				&& typeof(translate.request.data) === 'object'
+				&& typeof(translate.request.data[uuid]) === 'object'
+				&& typeof(translate.request.data[uuid].list) === 'object'
+				&& typeof(translate.request.data[uuid].list[from]) === 'object'
+				&& typeof(translate.request.data[uuid].list[from][to]) === 'object'){
+				var requestData = translate.request.data[uuid].list[from][to];
+				translate.lifecycle.execute.translateNetworkAfter_Trigger({
+					uuid: uuid,
+					from: from,
+					to: to,
+					texts: requestData.texts,
+					nodes: requestData.nodes,
+					result: result,
+					info: info
+				});
+			}
+
+			//console.log('uuid:'+uuid+', from:'+from+', to:'+to);
+			if(typeof(translate.translateRequest) !== 'object' || typeof(translate.translateRequest[uuid]) !== 'object'){
+				return;
+			}
+			for(var lang in translate.translateRequest[uuid]){
+				if (!translate.translateRequest[uuid].hasOwnProperty(lang)) {
+		    		continue;
+		    	}
 				if(translate.translateRequest[uuid][lang].executeFinish == 0){
 					//这个还没执行完，那么直接退出，不在向后执行了
 					//console.log('uuid:'+uuid+'  lang:'+lang+'  executeFinish:0  time:'+translate.translateRequest[uuid][lang][i][addtime]);
@@ -2189,12 +2231,32 @@ var translate = {
 			//都执行完了，那么设置完毕
 			translate.state = 0;
 			translate.executeNumber++;
-		}
-
-	},
-	
-	//execute() 方法已经被执行过多少次了， 只有 translate.execute() 完全执行完，也就是界面渲染完毕后，它才会+1
-	executeNumber:0,
+		}
+
+	},
+
+	/*
+		路由切换时调用，取消未完成翻译任务并清理等待队列
+	*/
+	routeChange:function(){
+		//版本号递增，旧请求全部失效
+		translate.cancelVersion = translate.cancelVersion + 1;
+		//清空等待队列
+		translate.waitingExecute.clear();
+		//终止当前执行状态
+		translate.state = 0;
+		//中断未完成的翻译请求
+		if(typeof(translate.request) === 'object' && typeof(translate.request.abortTranslateRequests) === 'function'){
+			translate.request.abortTranslateRequests();
+		}
+		//清理本轮翻译请求记录
+		translate.translateRequest = {};
+		translate.request.data = {};
+		translate.nodeQueue = {};
+	},
+	
+	//execute() 方法已经被执行过多少次了， 只有 translate.execute() 完全执行完，也就是界面渲染完毕后，它才会+1
+	executeNumber:0,
 	//translate.execute() 方法已经被触发过多少次了， 只要 translate.execute() 被触发，它就会在触发时立即 +1 (translate.execute() 默认是同一时刻只能执行一次，这个触发是在这个同一时刻执行一次的判定之前进行++ 的，如果这个同一时刻执行一次不通过，还有其他在执行，进入排队执行时，这里也会++ ，当从排队的中顺序排到进行执行时，又会执行++ ) 。 当页面打开第一次触发执行translate.execute()，这里便是 1
 	executeTriggerNumber:0, 
 	
@@ -2496,9 +2558,10 @@ var translate = {
 		translate.executeTriggerNumber = translate.executeTriggerNumber + 1;
 		var triggerNumber = translate.executeTriggerNumber; //为了整个 translate.execute 的数据一致性，下面都是使用这个变量
 
-		//每次执行execute，都会生成一个唯一uuid，也可以叫做队列的唯一标识，每一次执行execute都会创建一个独立的翻译执行队列
-		var uuid = translate.util.uuid();
-		translate.time.log('创建uuid:'+uuid);
+		//每次执行execute，都会生成一个唯一uuid，也可以叫做队列的唯一标识，每一次执行execute都会创建一个独立的翻译执行队列
+		var uuid = translate.util.uuid();
+		translate.time.log('创建uuid:'+uuid);
+		var executeCancelVersion = translate.cancelVersion;
 
 		//如果页面打开第一次使用，先判断缓存中有没有上次使用的语种，从缓存中取出
 		if(translate.to == null || translate.to == ''){
@@ -3315,6 +3378,9 @@ var translate = {
 
 			var splitHashIndex = 0;
 			var splitRequestFinish = function(result, info, errorResult){
+				if(translate.cancelVersion != executeCancelVersion){
+					return;
+				}
 				if(typeof(translate.translateRequest[uuid]) != 'object' || typeof(translate.translateRequest[uuid][lang]) != 'object'){
 					return;
 				}
@@ -3365,10 +3431,14 @@ var translate = {
 					//text:JSON.stringify(translateTextArray[lang])
 					text:encodeURIComponent(JSON.stringify(splitTexts))
 				};
-				translate.request.post(url, data, function(responseData, requestData){
+				var xhr = translate.request.post(url, data, function(responseData, requestData){
 					//console.log(data); 
 					//console.log(translateTextArray[data.from]);
 
+					if(translate.cancelVersion != executeCancelVersion){
+						return;
+					}
+
 					//针对 giteeai 增加了账户余额、账户是否激活的拍的判定，所以增加了 401 这个参数，凡是账户异常的，参数值是 401~499 之间。所以只要不是1都是失败
 					if(responseData.result != 1){
 						splitRequestFinish(0, responseData.info, 2);
@@ -3458,6 +3528,9 @@ var translate = {
 
 					splitRequestFinish(1, '', 0);
 				}, function(xhr){
+					if(translate.cancelVersion != executeCancelVersion){
+						return;
+					}
 					var info = '';
 					if(typeof(xhr.status) != 'undefined'){
 						if(xhr.status < 1){
@@ -3470,6 +3543,12 @@ var translate = {
 					}
 					splitRequestFinish(0, info, 3);
 				});
+				if(xhr != null && typeof(xhr) == 'object' && typeof(translate.translateRequest[uuid]) == 'object' && typeof(translate.translateRequest[uuid][lang]) == 'object'){
+					if(typeof(translate.translateRequest[uuid][lang].xhrs) == 'undefined'){
+						translate.translateRequest[uuid][lang].xhrs = [];
+					}
+					translate.translateRequest[uuid][lang].xhrs.push(xhr);
+				}
 			}
 			/*** 翻译end ***/
 		}
@@ -8695,12 +8774,12 @@ var translate = {
 		 * 				注意，是响应数据是第一个参数，请求数据是第二个参数。 以向前兼容
 		 * @param abnormalFunc 响应异常所执行的方法，响应码不是200就会执行这个方法 ,传入如 function(xhr){}  另外这里的 xhr 会额外有个参数  xhr.requestURL 返回当前请求失败的url
 		 */
-		post:function(path, data, func, abnormalFunc){
-			var headers = {
-				'content-type':'application/x-www-form-urlencoded',
-			};
-			if(typeof(data) == 'undefined'){
-				return;
+		post:function(path, data, func, abnormalFunc){
+			var headers = {
+				'content-type':'application/x-www-form-urlencoded',
+			};
+			if(typeof(data) == 'undefined'){
+				return;
 			}
 
 			//企业级翻译自动检测
@@ -8711,26 +8790,25 @@ var translate = {
 			// ------- edge start --------
 			var url = translate.request.getUrl(path);
 			//if(url.indexOf('edge') > -1 && path == translate.request.api.translate){
-			if(translate.service.name == 'client.edge'){	
-				if(path == translate.request.api.translate){
-					translate.service.edge.translate(path, data, func, abnormalFunc);
-					return;
-				}
-				if(path == translate.request.api.language){
-					var d = {};
-					d.info = 'SUCCESS';
-					d.result = 1;
-					d.list = translate.service.edge.language.json;
-					func(d);
-					return;
-				}
-				
-				//return;
-			}
-			// ------- edge end --------
-
-			this.send(path, data, data, func, 'post', true, headers, abnormalFunc, true);
-		},
+			if(translate.service.name == 'client.edge'){	
+				if(path == translate.request.api.translate){
+					return translate.service.edge.translate(path, data, func, abnormalFunc);
+				}
+				if(path == translate.request.api.language){
+					var d = {};
+					d.info = 'SUCCESS';
+					d.result = 1;
+					d.list = translate.service.edge.language.json;
+					func(d);
+					return;
+				}
+				
+				//return;
+			}
+			// ------- edge end --------
+
+			return this.send(path, data, data, func, 'post', true, headers, abnormalFunc, true);
+		},
 		/**
 		 * 发送请求
 		 * url 请求的url或者path（path，传入的是translate.request.api.translate 这种的，需要使用 getUrl 来组合真正请求的url ）
@@ -8746,7 +8824,7 @@ var translate = {
 		 * abnormalFunc 响应异常所执行的方法，响应码不是200就会执行这个方法 ,传入如 function(xhr){}  另外这里的 xhr 会额外有个参数  xhr.requestURL 返回当前请求失败的url
 		 * showErrorLog 是否控制台打印出来错误日志，true打印， false 不打印
 		 */
-		send:function(url, data, appendXhrData, func, method, isAsynchronize, headers, abnormalFunc, showErrorLog){
+		send:function(url, data, appendXhrData, func, method, isAsynchronize, headers, abnormalFunc, showErrorLog){
 			//post提交的参数
 			var params = '';
 
@@ -8883,8 +8961,41 @@ var translate = {
 			        }
 			    }
 			}
-			return xhr;
-		},
+			return xhr;
+		},
+		/*
+			中断未完成的翻译请求（translate.json）
+		*/
+		abortTranslateRequests:function(){
+			if(typeof(translate.translateRequest) == 'undefined' || translate.translateRequest == null){
+				return;
+			}
+			for(var uuid in translate.translateRequest){
+				if (!translate.translateRequest.hasOwnProperty(uuid)) {
+		    		continue;
+		    	}
+				var langs = translate.translateRequest[uuid];
+				for(var lang in langs){
+					if (!langs.hasOwnProperty(lang)) {
+			    		continue;
+			    	}
+					var item = langs[lang];
+					if(typeof(item) !== 'object' || item == null){
+						continue;
+					}
+					if(typeof(item.xhrs) === 'object' && item.xhrs.length > 0){
+						for(var xi = 0; xi < item.xhrs.length; xi++){
+							try{
+								if(item.xhrs[xi] && typeof(item.xhrs[xi].abort) === 'function'){
+									item.xhrs[xi].abort();
+								}
+							}catch(e){}
+						}
+						item.xhrs = [];
+					}
+				}
+			}
+		},
 		/*
 
 			手动进行翻译操作。参数说明：
@@ -8928,10 +9039,11 @@ var translate = {
 				console.log(xhr);
 			});
 		*/
-		translateText:function(obj, func, abnormalFunc){
-			var texts = new Array();
-			var from = translate.language.getLocal();
-			var to = translate.language.getCurrent();
+		translateText:function(obj, func, abnormalFunc){
+			var texts = new Array();
+			var from = translate.language.getLocal();
+			var to = translate.language.getCurrent();
+			var executeCancelVersion = translate.cancelVersion;
 
 			if(typeof(obj) == 'string'){
 				//案例一的场景，传入单个字符串
@@ -9021,6 +9133,9 @@ var translate = {
 			var splitResponseErrorInfo = '';
 			var splitNetworkError = false;
 			var splitFinish = function(){
+				if(translate.cancelVersion != executeCancelVersion){
+					return;
+				}
 				splitFinishCount++;
 				if(splitFinishCount >= splitTextList.length){
 					if(splitNetworkError){
@@ -9054,6 +9169,9 @@ var translate = {
 				translate.request.post(url, data, function(responseData, requestData){
 					//console.log(responseData); 
 					//console.log(data); 
+					if(translate.cancelVersion != executeCancelVersion){
+						return;
+					}
 					if(responseData.result != 1){
 						splitResponseError = true;
 						if(typeof(responseData.info) === 'string' && responseData.info.length > 0 && splitResponseErrorInfo.length < 1){
@@ -9090,6 +9208,9 @@ var translate = {
 
 					splitFinish();
 				}, (function(xhr){
+					if(translate.cancelVersion != executeCancelVersion){
+						return;
+					}
 					splitNetworkError = true;
 					if(abnormalFunc && typeof(abnormalFunc) == 'function'){
 						abnormalFunc(xhr);