☰

YouTube 直播聊天实时翻译

Same as the name

  1. // ==UserScript==
  2. // @name        YouTube 直播聊天实时翻译
  3. // @version     1.5
  4. // @author      lslqtz
  5. // @license     GPL
  6. // @grant       GM.xmlHttpRequest
  7. // @inject-into content
  8. // @run-at      document-end
  9. // @match       *://*.youtube.com/live_chat*
  10. // @namespace https://gf.qytechs.cn/users/155581
  11. // @description Same as the name
  12. // ==/UserScript==
  13.  
  14. window.YTGMFetch = function (url, options = {}) {
  15. 	return new Promise((resolve, reject) => {
  16. 		const method = options.method || 'GET';
  17. 		const headers = options.headers || {};
  18. 		const body = options.body || null;
  19.  
  20. 		GM.xmlHttpRequest({
  21. 			method: method,
  22. 			url: url,
  23. 			headers: headers,
  24. 			data: body,
  25. 			responseType: options.responseType || 'text',
  26. 			onload: function (response) {
  27. 				const fetchResponse = {
  28. 					ok: response.status >= 200 && response.status < 300,
  29. 					status: response.status,
  30. 					statusText: response.statusText,
  31. 					url: response.finalUrl,
  32. 					text: () => Promise.resolve(response.responseText),
  33. 					json: () => Promise.resolve(JSON.parse(response.responseText)),
  34. 					blob: () => Promise.resolve(new Blob([response.response])),
  35. 					arrayBuffer: () => Promise.resolve(response.response),
  36. 					headers: {
  37. 						get: (header) => {
  38. 							const headersArray = response.responseHeaders.split('\r\n');
  39. 							const headerMap = headersArray.reduce((acc, curr) => {
  40. 								const [key, value] = curr.split(': ');
  41. 								if (key && value) acc[key.toLowerCase()] = value;
  42. 								return acc;
  43. 							}, {});
  44. 							return headerMap[header.toLowerCase()] || null;
  45. 						},
  46. 					},
  47. 				};
  48.  
  49. 				resolve(fetchResponse);
  50. 			},
  51. 			onerror: function () {
  52. 				reject(new TypeError('Network request failed.'));
  53. 			},
  54. 			ontimeout: function () {
  55. 				reject(new TypeError('Network request timed out.'));
  56. 			},
  57. 			onabort: function () {
  58. 				reject(new DOMException('The operation was aborted.', 'AbortError'));
  59. 			},
  60. 		});
  61. 	});
  62. };
  63. window.ytTextEncoder = new TextEncoder();
  64. window.ytIsSolvingCaptcha = false;
  65. window.ytSymbolRegex = /^([\u{2190}-\u{21FF}]|[\u{2300}-\u{23FF}]|[\u{2460}-\u{24FF}]|[\u{2500}-\u{25FF}]|[\u{2600}-\u{26FF}]|[\u{2700}-\u{27BF}]|[\u{2B00}-\u{2BFF}]|[\u{1F000}-\u{1F02F}]|[\u{1F0A0}-\u{1F0FF}]|[\u{1F100}-\u{1F6FF}]|[\u{1F900}-\u{1FAFF}]|[\u{1FB00}-\u{1FBFF}]|[ !"#$%&'()*+,-./:;<=>?@\[\\\]^_`\{|\}~。，“”、：；？！〝〞〟～〜])+$/u;
  66.  
  67. // 停止翻译脚本.
  68. function StopYouTubeLiveChatTranslator() {
  69. 	console.log("停止 YouTube 直播聊天翻译脚本");
  70.  
  71. 	if (window.ytLiveChatInterval) {
  72. 		clearInterval(window.ytLiveChatInterval);
  73. 		console.log("已清除计时器");
  74. 	}
  75.  
  76. 	if (window.ytObserver) {
  77. 		window.ytObserver.disconnect();
  78. 		window.ytObserver = null;
  79. 		console.log("已清除观察器");
  80. 	}
  81. 	
  82. 	window.chatContainerNotFoundCount = 0;
  83. 	window.ytIsSolvingCaptcha = false;
  84. }
  85.  
  86. // 启动翻译脚本.
  87. function StartYouTubeLiveChatTranslator() {
  88. 	console.log("启动 YouTube 直播聊天翻译脚本");
  89.  
  90. 	// 启动定时器.
  91. 	window.ytLiveChatInterval = setInterval(CheckAndObserveChatContainer, 1000);
  92. }
  93.  
  94. function ShowReCaptchaPrompt(onResolved) {
  95. 	if (window.ytIsSolvingCaptcha) {
  96. 		return;
  97. 	}
  98.  
  99. 	window.ytIsSolvingCaptcha = true;
  100.  
  101. 	// 创建提示框 HTML.
  102. 	var promptBox = document.createElement("div");
  103. 	promptBox.style = `
  104. 		position: fixed; top: 20%; left: 50%; transform: translateX(-50%);
  105. 		padding: 5px; width: 70%; background: white; border: 1px solid gray; box-shadow: 0 4px 8px rgba(0,0,0,0.2);
  106. 		z-index: 10000; text-align: center; font-size: 16px;
  107. 	`;
  108. 	promptBox.innerHTML = `
  109. 		<h3 style="margin-bottom: 15px;">YouTube 直播聊天实时翻译</h3>
  110. 		<p style="margin-bottom: 15px;">HTTP 429: 检测到疑似频繁请求触发 reCaptcha 验证码验证.</p>
  111. 		<p style="margin-bottom: 15px;">手动访问 <a href="https://translate.googleapis.com/translate_a/single" target="_blank" style="color: blue;">Google Translate API</a> 并完成验证码验证.</p>
  112. 		<p style="margin-bottom: 15px;">完成验证后, 点按"我已完成", 即可继续开始翻译.</p>
  113. 		<button id="ytRecaptchaResolvedButton">我已完成</button> <button id="ytDisableTranslation">停用翻译</button>
  114. 	`;
  115.  
  116. 	document.body.appendChild(promptBox);
  117.  
  118. 	document.getElementById("ytRecaptchaResolvedButton").addEventListener("click", () => {
  119. 		promptBox.remove();
  120. 		window.ytIsSolvingCaptcha = false;
  121. 	});
  122. 	document.getElementById("ytDisableTranslation").addEventListener("click", () => {
  123. 		promptBox.remove();
  124. 		StopYouTubeLiveChatTranslator();
  125. 	});
  126. }
  127.  
  128. // Google Translate API 调用.
  129. async function TranslateText(text, targetLang = 'zh-CN') {
  130. 	console.log("翻译消息: " + text);
  131.  
  132. 	if (window.ytIsSolvingCaptcha) {
  133. 		return "[翻译失败: 等待解决验证码]";
  134. 	}
  135.  
  136. 	try {
  137. 		var response = await YTGMFetch('https://translate.googleapis.com/translate_a/single?client=gtx&sl=auto&tl=' + targetLang + '&dt=t&q=' + encodeURIComponent(text));
  138. 		if (!response.ok) {
  139. 			console.error("翻译 API 请求失败", response.status, response.statusText);
  140. 			if (response.status === 429) {
  141. 				ShowReCaptchaPrompt();
  142. 				return "[翻译失败: 疑似频繁请求触发 reCaptcha 验证码]";
  143. 			}
  144. 			return `[翻译失败: HTTP ${response.status} ${response.statusText}]`;
  145. 		}
  146.  
  147. 		var result = await response.json();
  148. 		if (!result || !result[0] || !Array.isArray(result[0])) {
  149. 			return "[翻译失败: 无法解析翻译 API 返回的内容]";
  150. 		}
  151.  
  152. 		return result[0].map(segment => segment[0]).join('');
  153. 	} catch (error) {
  154. 		console.error("翻译出错", error);
  155. 		return "[翻译出错]";
  156. 	}
  157. }
  158.  
  159. // 解析消息内容, 过滤表情和图片, 并将它们替换为占位符.
  160. function ExtractTextContent(element) {
  161. 	var text = '';
  162. 	var elements = element.childNodes;
  163. 	var placeholders = []; // 存储占位符与原始内容的对应关系.
  164. 	var hasText = false;
  165.  
  166. 	elements.forEach(function (node, index) {
  167. 		if (node.nodeType === Node.TEXT_NODE) {
  168. 			if (!hasText && !node.nodeValue.trim().split(/\r?\n/).every(line => window.ytSymbolRegex.test(line))) {
  169. 				hasText = true;
  170. 			}
  171. 			text += node.nodeValue.trim();
  172. 		} else if (node.nodeType === Node.ELEMENT_NODE) {
  173. 			if (node.tagName.toLowerCase() === 'img' || (node.tagName.toLowerCase() === 'span' && node.classList.contains('emoji'))) {
  174. 				var placeholder = `{{ytPH${index}}}`; // 使用占位符.
  175. 				placeholders.push({ placeholder: placeholder, html: node.outerHTML });
  176. 				text += placeholder; // 将表情或图片替换为占位符.
  177. 			}
  178. 		}
  179. 	});
  180.  
  181. 	if (!hasText || (text.trim().length <= 2 && window.ytTextEncoder.encode(text.trim()).length <= 4)) {
  182. 		return { text: "", placeholders: [] };
  183. 	}
  184. 	return { text: text.trim(), placeholders: placeholders };
  185. }
  186.  
  187. // 重新将占位符替换为表情和图片.
  188. function InsertPlaceholdersIntoTranslation(translatedMessage, placeholders) {
  189. 	translatedMessage = translatedMessage.replace('{ {', '{{').replace('} }', '}}');
  190. 	placeholders.forEach(function (placeholder) {
  191. 		translatedMessage = translatedMessage.replace(new RegExp(placeholder.placeholder, 'gi'), placeholder.html);
  192. 	});
  193. 	return translatedMessage;
  194. }
  195.  
  196. // 插入翻译后的消息.
  197. function InsertTranslatedMessage(messageElement, translatedMessage) {
  198. 	var translationElement = document.createElement('div');
  199. 	translationElement.style.color = 'gray';
  200. 	translationElement.style.fontSize = 'small';
  201. 	translationElement.className = 'translated-message';
  202. 	translationElement.innerHTML = "[翻译]: " + translatedMessage;
  203.  
  204. 	// 在原消息下方插入翻译内容.
  205. 	messageElement.appendChild(translationElement);
  206. }
  207.  
  208. // 检查并观察聊天容器.
  209. function CheckAndObserveChatContainer() {
  210. 	var chatContainer = document.querySelector('yt-live-chat-app');
  211. 	if (chatContainer) {
  212. 		if (!window.ytObserver) {
  213. 			console.log("聊天容器找到: ", chatContainer);
  214. 			ObserveChatUpdates(chatContainer);
  215. 			TranslateInitialMessages(chatContainer);
  216. 		}
  217. 	} else if (window.ytObserver) {
  218. 		if (window.chatContainerNotFoundCount++ >= 3) {
  219. 			window.chatContainerNotFoundCount = 0;
  220. 			window.ytObserver.disconnect();
  221. 			window.ytObserver = null;
  222. 			console.log("聊天容器已丢失, 停止以前监听的聊天更新");
  223. 		}
  224. 	}
  225. }
  226.  
  227. // 翻译已有的最新 20 条消息.
  228. async function TranslateInitialMessages(chatContainer) {
  229. 	console.log("开始翻译已有消息...");
  230.  
  231. 	// 获取所有聊天消息节点.
  232. 	var messages = chatContainer.querySelectorAll('yt-live-chat-text-message-renderer, yt-live-chat-paid-message-renderer');
  233. 	var totalMessages = messages.length;
  234.  
  235. 	// 只处理最后的 10 条消息.
  236. 	for (var i = Math.max(0, totalMessages - 10); i < totalMessages; i++) {
  237. 		var messageNode = messages[i];
  238. 		var messageElement = messageNode.querySelector('#message');
  239. 		if (messageElement) {
  240. 			// 跳过已翻译消息.
  241. 			if (messageElement.querySelector('.translated-message')) {
  242. 				console.log("消息已翻译，跳过: ", messageElement.textContent);
  243. 				continue;
  244. 			}
  245. 			var { text, placeholders } = ExtractTextContent(messageElement);
  246. 			if (text.length === 0) {
  247. 				console.log("已有消息内容为空，跳过翻译");
  248. 				continue;
  249. 			}
  250. 			console.log("已有消息: " + text);
  251. 			var translatedMessage = await TranslateText(text);
  252. 			if (translatedMessage.length === 0) {
  253. 				console.log("翻译消息内容为空，跳过翻译");
  254. 				continue;
  255. 			}
  256. 			console.log("翻译消息: " + text);
  257. 			var finalMessage = InsertPlaceholdersIntoTranslation(translatedMessage, placeholders);
  258. 			InsertTranslatedMessage(messageElement, finalMessage);
  259. 		}
  260. 	}
  261. }
  262.  
  263. // 监听聊天消息更新.
  264. function ObserveChatUpdates(chatContainer) {
  265. 	window.ytObserver = new MutationObserver(async function (mutations) {
  266. 		for (var i = 0; i < mutations.length; i++) {
  267. 			var mutation = mutations[i];
  268. 			if (mutation.type !== 'childList') {
  269. 				continue;
  270. 			}
  271. 			mutation.addedNodes.forEach(async function (node) {
  272. 				// 检查是否为聊天消息.
  273. 				if (node.nodeType === 1 && (node.tagName.toLowerCase() === 'yt-live-chat-text-message-renderer' || node.tagName.toLowerCase() === 'yt-live-chat-paid-message-renderer')) {
  274. 					var messageElement = node.querySelector('#message');
  275. 					if (messageElement) {
  276. 						// 跳过已翻译消息.
  277. 						if (messageElement.querySelector('.translated-message')) {
  278. 							console.log("消息已翻译，跳过: ", messageElement.textContent);
  279. 							return;
  280. 						}
  281. 						// 提取文本并替换表情或图片为占位符.
  282. 						var { text, placeholders } = ExtractTextContent(messageElement);
  283. 						if (text.length === 0) {
  284. 							console.log("消息内容为空, 跳过翻译");
  285. 							return;
  286. 						}
  287. 						console.log("检测到新消息: " + text);
  288. 						var translatedMessage = await TranslateText(text);
  289.  
  290. 						// 将翻译后的文本和表情或图片组合.
  291. 						var finalMessage = InsertPlaceholdersIntoTranslation(translatedMessage, placeholders);
  292. 						InsertTranslatedMessage(messageElement, finalMessage);
  293. 					} else {
  294. 						console.warn("未找到消息内容元素");
  295. 					}
  296. 				}
  297. 			});
  298. 		}
  299. 	});
  300.  
  301. 	console.log("开始监听聊天更新...");
  302. 	window.ytObserver.observe(chatContainer, { childList: true, subtree: true });
  303. }
  304.  
  305. StopYouTubeLiveChatTranslator();
  306. StartYouTubeLiveChatTranslator();

欢迎访问Greasy Fork镜像

土豆服务器，请按需使用

镜像地址随时可能被墙，建议加群获取最新地址

加入Q群

QingJ © 2025

镜像随时可能失效，请加Q群300939539或关注我们的公众号极客氢云获取最新地址