index.js 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466
  1. "use strict";
  2. var isWebRTCSupported = false;
  3. ['RTCPeerConnection', 'webkitRTCPeerConnection', 'mozRTCPeerConnection', 'RTCIceGatherer'].forEach(function(item) {
  4. if (isWebRTCSupported) {
  5. return;
  6. }
  7. if (item in window) {
  8. isWebRTCSupported = true;
  9. }
  10. });
  11. try {
  12. window.AudioContext = window.AudioContext || window.webkitAudioContext;
  13. var audioContext = new AudioContext();
  14. } catch (e) {
  15. console.log('Failed to instantiate an audio context, error: ' + e);
  16. }
  17. function onTitleClick(id) {
  18. var targetId = "#";
  19. if (id == "camera-title") {
  20. targetId += "camera-detail";
  21. } else if (id == "mic-title") {
  22. targetId += "mic-detail";
  23. } else if (id == "connection-title") {
  24. targetId += "connection-detail";
  25. } else if (id == "support-title") {
  26. targetId += "support-detail";
  27. } else if (id == "browser-title") {
  28. targetId += "browser-detail";
  29. } else {
  30. console.error("wrong id : " + id);
  31. return;
  32. }
  33. if ($(targetId).is(":visible")) {
  34. $(targetId).hide();
  35. } else {
  36. $(targetId).show();
  37. }
  38. }
  39. function resetUI() {
  40. var camera = $("#camera-title");
  41. var mic = $("#mic-title");
  42. var connection = $("#connection-title");
  43. var support = $("#support-title");
  44. var browser = $("#browser-title");
  45. camera.off("click").on("click", function () {
  46. onTitleClick(this.id);
  47. });
  48. mic.off("click").on("click", function () {
  49. onTitleClick(this.id);
  50. });
  51. connection.off("click").on("click", function () {
  52. onTitleClick(this.id);
  53. });
  54. support.off("click").on("click", function () {
  55. onTitleClick(this.id);
  56. });
  57. browser.off("click").on("click", function () {
  58. onTitleClick(this.id);
  59. });
  60. camera[0].innerText = text.Camera;
  61. mic[0].innerText = text.Mic;
  62. connection[0].innerText = text.Connection;
  63. support[0].innerText = text.Support;
  64. camera.css("background", "#E2E2E2");
  65. mic.css("background", "#E2E2E2");
  66. connection.css("background", "#E2E2E2");
  67. support.css("background", "#E2E2E2");
  68. $("#camera-detail").hide();
  69. $("#browser-detail").hide();
  70. $("#mic-detail").hide();
  71. $("#connection-detail").hide();
  72. $("#support-detail").hide();
  73. $("#camera-detail")[0].innerText = "";
  74. $("#mic-detail")[0].innerText = "";
  75. $("#connection-detail")[0].innerText = "";
  76. $("#support-detail")[0].innerText = "";
  77. $("#browser-detail")[0].innerText = "";
  78. }
  79. function checkTBSVersion(ua) {
  80. //ua = "Mozilla/5.0 (Linux; Android 7.1.1; vivo X9 Build/NMF26F; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/53.0.2785.49 Mobile MQQBrowser/6.2 TBS/043501 Safari/537.36 MicroMessenger/6.5.13.1100 NetType/WIFI Language/zh_CN";
  81. var list = ua.split(" ");
  82. for (var i = 0; i < list.length; i++) {
  83. var item = list[i];
  84. if (item.indexOf("TBS") !== -1 || item.indexOf("tbs") !== -1) {
  85. var versionStr = item.split("/")[1];
  86. var version = parseInt(versionStr) || 0;
  87. if (version <= 43600) {
  88. alert("您的TBS版本号(" + versionStr + ")过低,不支持WebRTC,请升级!");
  89. }
  90. }
  91. }
  92. }
  93. function init() {
  94. resetUI();
  95. // $("#us")[0].innerText = navigator.userAgent;
  96. $("#stunserver").val("stun:webrtc.qq.com:8800");
  97. $("#start-btn").off("click").on("click", function () {
  98. resetUI();
  99. startAudioTest();
  100. startBrowserTest();
  101. });
  102. checkTBSVersion(navigator.userAgent);
  103. }
  104. function startLoadingInner(text, dom, step) {
  105. for (var i = 0; i < step; i++) {
  106. text += ".";
  107. }
  108. dom.innerText = text;
  109. }
  110. function startLoading(text, dom) {
  111. intervalID = setInterval(function (text, dom) {
  112. startLoadingInner(text, dom, intervalStep);
  113. intervalStep++;
  114. if (intervalStep > 3) {
  115. intervalStep = 1;
  116. }
  117. }, 500, text, dom)
  118. }
  119. function stopLoading() {
  120. clearInterval(intervalID);
  121. }
  122. var audioMessage = "";
  123. var videoMessage = "";
  124. var supportMessage = "";
  125. var connectionMessage = "";
  126. var intervalID = 0;
  127. var intervalStep = 1;
  128. var text = {
  129. Mic : "音频输入",
  130. MicTest : "音频输入设备检测",
  131. Camera : "视频输入",
  132. CameraTest : "视频输入检测",
  133. Support : "分辨率",
  134. SupportTest : "支持的分辨率检测",
  135. Connection : "连通性",
  136. ConnectionTest : "连通性测试",
  137. Browser : "浏览器"
  138. };
  139. init();
  140. function onAudioTestMessage(str) {
  141. audioMessage += str + "\r\n";
  142. }
  143. function onAudioTestDone(result) {
  144. stopLoading();
  145. $("#mic-detail")[0].innerText = audioMessage;
  146. audioMessage = "";
  147. var titleText = null;
  148. if (result == 0) {
  149. $("#mic-title").css("background", "#90dc90");
  150. titleText = text.MicTest + " 成功 !!!";
  151. audioInputTest()
  152. } else {
  153. $("#mic-title").css("background", "#dc9090");
  154. titleText = text.MicTest + " 失败 !!!";
  155. }
  156. $("#mic-title")[0].innerText = titleText;
  157. startVideoTest();
  158. }
  159. function onVideoTestMessage(str) {
  160. videoMessage += str + "\r\n";
  161. }
  162. function onVideoTestDone(result) {
  163. stopLoading();
  164. $("#camera-detail")[0].innerText = videoMessage;
  165. videoMessage = "";
  166. var titleText = null;
  167. if (result == 0) {
  168. $("#camera-title").css("background", "#90dc90");
  169. titleText = text.CameraTest + " 成功 !!!";
  170. } else {
  171. $("#camera-title").css("background", "#dc9090");
  172. titleText = text.CameraTest + " 失败 !!!";
  173. }
  174. $("#camera-title")[0].innerText = titleText;
  175. startSupportTest();
  176. }
  177. function onSupportTestMessage(str) {
  178. supportMessage += str + "\r\n";
  179. }
  180. function onSupportTestDone(result) {
  181. stopLoading();
  182. $("#support-detail")[0].innerText = supportMessage;
  183. supportMessage = "";
  184. var titleText = null;
  185. if (result == 0) {
  186. $("#support-title").css("background", "#90dc90");
  187. titleText = text.SupportTest + " 成功 !!!";
  188. } else {
  189. $("#support-title").css("background", "#dc9090");
  190. titleText = text.SupportTest + " 失败 !!!";
  191. }
  192. $("#support-title")[0].innerText = titleText;
  193. startConnectionTest();
  194. }
  195. function onConnectionTestMessage(str) {
  196. connectionMessage += str + "\r\n";
  197. }
  198. function onConnectionTestDone(result) {
  199. stopLoading();
  200. $("#connection-detail")[0].innerText = connectionMessage;
  201. connectionMessage = "";
  202. var titleText = null;
  203. if (result == 0) {
  204. $("#connection-title").css("background", "#90dc90");
  205. titleText = text.ConnectionTest + " 成功 !!!";
  206. } else {
  207. $("#connection-title").css("background", "#dc9090");
  208. titleText = text.ConnectionTest + " 失败 !!!";
  209. }
  210. $("#connection-title")[0].innerText = titleText;
  211. disableButton(false, "start-btn");
  212. }
  213. function disableButton(isDisable, id) {
  214. var queryId = "#" + id;
  215. $(queryId).prop("disable", isDisable);
  216. }
  217. function startAudioTest() {
  218. disableButton(true, "start-btn");
  219. startLoading(text.MicTest, $("#mic-title")[0]);
  220. if(!isWebRTCSupported){
  221. onAudioTestDone(-1);
  222. return;
  223. }
  224. if(false && isMobile.iOS()){
  225. //IOS无法遍历设备,默认认为支持
  226. onAudioTestDone(0);
  227. return;
  228. }
  229. var audioTest = new WebRTCTest();
  230. audioTest.setListener({
  231. onMessage : onAudioTestMessage,
  232. done : onAudioTestDone
  233. });
  234. var micTest = new MicTest(audioTest);
  235. micTest.run();
  236. }
  237. function startVideoTest() {
  238. if(!isWebRTCSupported){
  239. onVideoTestDone(-1);
  240. return;
  241. }
  242. startLoading(text.CameraTest, $("#camera-title")[0]);
  243. var videoTest = new WebRTCTest();
  244. videoTest.setListener({
  245. onMessage : onVideoTestMessage,
  246. done : onVideoTestDone
  247. });
  248. var camTest = new CameraTest(videoTest, [ [640,360], [640,480]]);
  249. camTest.run();
  250. }
  251. function startSupportTest() {
  252. if(!isWebRTCSupported || (!isMobile.safari() && isMobile.iOS() )){
  253. onSupportTestDone(-1);
  254. return;
  255. }
  256. startLoading(text.SupportTest, $("#support-title")[0]);
  257. var supportTest = new WebRTCTest();
  258. supportTest.setListener({
  259. onMessage : onSupportTestMessage,
  260. done : onSupportTestDone
  261. });
  262. var resolutionArray = [
  263. // [160, 120], [320, 180], [320, 240], [640, 360], [640, 480], [768, 576],
  264. // [1024, 576], [1280, 720], [1280, 768], [1280, 800], [1920, 1080],
  265. // [1920, 1200], [3840, 2160], [4096, 2160]
  266. [1280,720],[960,540], [640,360], [640,480], [480,264], [320,180]
  267. ];
  268. var supTest = new CameraTest(supportTest, resolutionArray);
  269. supTest.run();
  270. }
  271. var FetchSigCgi = 'https://sxb.qcloud.com/sxb_dev/?svc=doll&cmd=fetchsig';
  272. function getUserSig( callback ){
  273. $.ajax({
  274. type: "POST",
  275. url: FetchSigCgi,
  276. dataType: 'json',
  277. data:JSON.stringify({
  278. appid: 1400027849,
  279. id : "neallin"
  280. }),
  281. success: function (json) {
  282. if(json && json.errorCode === 0 ){
  283. //一会儿进入房间要用到
  284. var url = "wss://webrtc.qq.com:8687/?userSig="+json.data.userSig+"&sdkAppid=1400027849&identifier=neallin";
  285. callback(url );
  286. }else{
  287. console.error(json);
  288. }
  289. },
  290. error: function (err){
  291. console.error(err);
  292. }
  293. })
  294. }
  295. var websocket = null;
  296. function getRelayIp(callback ,error){
  297. if (websocket) {
  298. try {
  299. websocket.close();
  300. websocket = null;
  301. } catch (e) {
  302. console.error(e);
  303. }
  304. }
  305. getUserSig( function(url){
  306. websocket = new WebSocket(url);
  307. websocket.onmessage = callback;
  308. websocket.onopen = wsonopen;
  309. websocket.onerror = error;
  310. websocket.onclose = wsonclose;
  311. })
  312. }
  313. // getRelayIp();
  314. function wsonopen(data){
  315. console.debug(data);
  316. }
  317. function wsonclose(data){
  318. console.debug(data);
  319. }
  320. function wsonclose(data){
  321. console.debug(data);
  322. }
  323. function wsonclose(data){
  324. console.debug(data);
  325. }
  326. function startConnectionTest() {
  327. if(!isWebRTCSupported){
  328. onConnectionTestDone(-1);
  329. return;
  330. }
  331. getRelayIp(function(data){
  332. //IOS默认认为支持
  333. if(isMobile.iOS() && isMobile.safari()){
  334. onConnectionTestDone(0);
  335. return;
  336. }
  337. var json = JSON.parse(data.data);
  338. var ip = json.content.relayip;
  339. startLoading(text.ConnectionTest, $("#connection-title")[0]);
  340. var connectionTest = new WebRTCTest();
  341. connectionTest.setListener({
  342. onMessage : onConnectionTestMessage,
  343. done : onConnectionTestDone
  344. });
  345. var conTest = new ConnectionTest(connectionTest , 'stun:'+ip+":8800");
  346. conTest.run();
  347. },function(){
  348. onConnectionTestDone(-1);
  349. });
  350. }
  351. function checkTBSVersion(ua) {
  352. var list = ua.split(" ");
  353. for (var i = 0; i < list.length; i++) {
  354. var item = list[i];
  355. if (item.indexOf("TBS") !== -1 || item.indexOf("tbs") !== -1) {
  356. var versionStr = item.split("/")[1];
  357. var version = parseInt(versionStr) || 0;
  358. return version
  359. }
  360. }
  361. return null;
  362. }
  363. function startBrowserTest(){
  364. $("#browser-detail")[0].innerText = "";
  365. var titleText = null;
  366. $("#browser-title")[0].innerText = titleText;
  367. $("#browser-detail")[0].innerText = navigator.userAgent;
  368. var isMobileBrowser = false;
  369. for(var a in isMobile){
  370. if( isMobile[a]() ){
  371. isMobileBrowser = true
  372. console.debug(a)
  373. console.debug(isMobile[a]())
  374. titleText = a + ":";
  375. var version = checkTBSVersion(navigator.userAgent);
  376. if( a === 'Android' && version && version < 43600 ){
  377. $("#browser-title").css("background", "#dc9090");
  378. titleText = "TBS (version:"+ version + ") 不支持 !!!";
  379. }
  380. else if(!isWebRTCSupported || (!isMobile.safari() && isMobile.iOS())) {
  381. $("#browser-title").css("background", "#dc9090");
  382. titleText = a + "当前浏览器不支持 !!!";
  383. onVideoTestDone(-1);
  384. onSupportTestDone(-1);
  385. }else{
  386. if( isMobile.safari() && isMobile.iOS() ){
  387. //ios 11 版本 11.0.3 以下不支持
  388. var matches = (navigator.userAgent).match(/OS (\d+)_(\d+)_?(\d+)?/);
  389. if(matches && matches[1]>=11 && (matches[2]>=1 || matches[3] >= 3) ){
  390. $("#browser-title").css("background", "#90dc90");
  391. titleText = matches[0] + " 当前浏览器支持 !!!";
  392. }else{
  393. $("#browser-title").css("background", "#dc9090");
  394. titleText = matches[0] + " 不支持 !!!";
  395. }
  396. }else{
  397. $("#browser-title").css("background", "#90dc90");
  398. titleText = a + " 当前浏览器支持 !!!";
  399. }
  400. }
  401. $("#browser-title")[0].innerText = titleText;
  402. break;
  403. }
  404. }
  405. if( !isMobileBrowser){
  406. if(isWebRTCSupported){
  407. titleText = "当前浏览器 支持 !!!";
  408. $("#browser-title").css("background", "#90dc90");
  409. $("#browser-title")[0].innerText = titleText;
  410. }else{
  411. titleText = "当前浏览器 不支持 !!!";
  412. $("#browser-title").css("background", "#dc9090");
  413. $("#browser-title")[0].innerText = titleText;
  414. }
  415. }
  416. }