Browse Source

修复浏览器限制

1
mo 1 year ago
parent
commit
98d5699867
5 changed files with 160 additions and 39 deletions
  1. 1 1
      dev-dist/sw.js
  2. 66 19
      index.html
  3. 66 15
      src/App.tsx
  4. 2 2
      src/views/login/index.tsx
  5. 25 2
      src/views/notation/index.tsx

+ 1 - 1
dev-dist/sw.js

@@ -82,7 +82,7 @@ define(['./workbox-5357ef54'], (function (workbox) { 'use strict';
     "revision": "6137f3202e711e407da62c90631d3729"
   }, {
     "url": "index.html",
-    "revision": "0.4248ndag8lg"
+    "revision": "0.78n63d427ro"
   }], {});
   workbox.cleanupOutdatedCaches();
   workbox.registerRoute(new workbox.NavigationRoute(workbox.createHandlerBoundToURL("index.html"), {

+ 66 - 19
index.html

@@ -106,6 +106,23 @@
         window.open('https://appstore.ks3-cn-beijing.ksyuncs.com/googlechrome-mac.dmg');
       }
     }
+    const check360 = () => {
+      console.log(navigator)
+      const result = false;
+      for (const key in navigator.plugins) {
+        // np-mswmp.dll只在360浏览器下存在
+        if (navigator.plugins[key].filename == 'internal-nacl-plugin') {
+          console.log('来到插件')
+          return !result;
+        }
+        if (navigator.plugins[key].filename == 'np-mswmp.dll') {
+          console.log('来到插件')
+          return !result;
+        }
+
+      }
+      return result;
+    };
     function getChromeVersion() {
       var arr = navigator.userAgent.split(' ');
       var chromeVersion = '';
@@ -127,21 +144,54 @@
       return false;
     }
 
-    function isChrome() {
-      var isChromium = window.chrome;
-      var winNav = window.navigator;
-      var vendorName = winNav.vendor;
-      var isOpera = typeof window.opr !== 'undefined';
-      var isIEedge = winNav.userAgent.indexOf('Edge') > -1;
-      var isIOSChrome = winNav.userAgent.match('CriOS');
-      return (
-        isIOSChrome ||
-        (isChromium !== null &&
-          typeof isChromium !== 'undefined' &&
-          vendorName === 'Google Inc.' &&
-          isOpera === false &&
-          isIEedge === false)
-      );
+    const isChrome = () => {
+
+      const isChromium = window.chrome,
+        winNav = window.navigator,
+        vendorName = winNav.vendor,
+        isOpera = winNav.userAgent.indexOf('OPR') > -1,
+        isIEedge = winNav.userAgent.indexOf('Edge') > -1,
+        isIOSChrome = winNav.userAgent.match('CriOS'),
+        // QQ
+        isQQBriwser =
+          winNav.userAgent.indexOf('QQBrowser') > -1 ||
+          winNav.userAgent.indexOf('QQ') > -1,
+        // 搜狗
+        isSouggou =
+          winNav.userAgent.indexOf('se 2.x') > -1 ||
+          winNav.userAgent.indexOf('MetaSr') > -1,
+        // 360
+        is360 = check360(),
+        // 遨游
+        isMaxthon = winNav.userAgent.indexOf('Maxthon') > -1,
+        // 是否为2345浏览器
+        is2345Explorer = winNav.userAgent.includes('2345Explorer'),
+        // 世界之窗
+        isTheWorld = winNav.userAgent.indexOf('TheWorld') > -1,
+        // 猎豹
+        isLiebao = winNav.userAgent.indexOf('LBBROWSER') > -1;
+      console.log(winNav.userAgent)
+      console.log(isQQBriwser, isSouggou, is360, isMaxthon, is2345Explorer, isTheWorld, isLiebao)
+      if (isIOSChrome) {
+        return true;
+      } else if (
+        isChromium !== null &&
+        typeof isChromium !== 'undefined' &&
+        vendorName === 'Google Inc.' &&
+        isOpera === false &&
+        isIEedge === false &&
+        isQQBriwser === false &&
+        isSouggou === false &&
+        is360 === false &&
+        isMaxthon === false &&
+        is2345Explorer === false &&
+        isTheWorld === false &&
+        isLiebao === false
+      ) {
+        return true;
+      } else {
+        return false;
+      }
     };
     function IEVersion() {
       var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
@@ -174,19 +224,16 @@
     (function (window) {
       if (!isChrome()) {
         // document.writeln("<div class='imgWrap'><img src='https://gyt.ks3-cn-beijing.ksyuncs.com/basic/1688699993534.png' class='bgImg' alt=''><img src='https://gyt.ks3-cn-beijing.ksyuncs.com/basic/1688699779209.png' class='btnImg' alt=''></div>");
-
-
         if (IEVersion() < 9 && IEVersion() != -1) {
-
           document.writeln(" <div class='textWrap'><h1>当前浏览器版本过低</h1><p class='subMsg'>为了保证良好的上课体验,推荐您使用谷歌浏览器</p> <button class='subBtn' onclick='gotoLinlk()'>下载谷歌浏览器</button>");
           document.execCommand("Stop");
         } else {
           document.writeln(" <div class='imgWrap'><img onabort='this.src=this.src' src='https://gyt.ks3-cn-beijing.ksyuncs.com/basic/1688699993534.png' class='bgImg' alt=''><img src='https://gyt.ks3-cn-beijing.ksyuncs.com/basic/1688699779209.png'  onabort='this.src=this.src' onclick='gotoLinlk()' class='btnImg' alt=''></div>");
           document.execCommand("Stop");
+          window.stop()
         }
       } else {
         if (getChromeVersion() < 90) {
-
           document.writeln(" <div class='imgWrap'><img src='https://gyt.ks3-cn-beijing.ksyuncs.com/basic/1688699993534.png' class='bgImg' alt=''><img src='https://gyt.ks3-cn-beijing.ksyuncs.com/basic/1688699779209.png' onclick='gotoLinlk()' class='btnImg' alt=''></div>");
           document.execCommand("Stop");
           window.stop()

+ 66 - 15
src/App.tsx

@@ -1,4 +1,10 @@
-import { computed, defineComponent, onMounted, ref, onBeforeUnmount } from 'vue';
+import {
+  computed,
+  defineComponent,
+  onMounted,
+  ref,
+  onBeforeUnmount
+} from 'vue';
 import { NConfigProvider, zhCN, dateZhCN, NModal } from 'naive-ui';
 import { AppProvider } from './components/Application';
 import { RouterView } from 'vue-router';
@@ -29,21 +35,65 @@ export default defineComponent({
     // const showModal = ref(false);
     const showModalMsg = ref('');
     // 判断浏览器
+    // 是否是360
+    const check360 = () => {
+      const result = false;
+      for (const key in navigator.plugins) {
+        // np-mswmp.dll只在360浏览器下存在
+        if (navigator.plugins[key].filename == 'internal-nacl-plugin') {
+          return !result;
+        }
+      }
+      return result;
+    };
+    //
+
     const isChrome = () => {
-      const isChromium = (window as any).chrome;
-      const winNav = window.navigator;
-      const vendorName = winNav.vendor;
-      const isOpera = typeof (window as any).opr !== 'undefined';
-      const isIEedge = winNav.userAgent.indexOf('Edge') > -1;
-      isIOSChrome.value = winNav.userAgent.match('CriOS');
-      return (
-        isIOSChrome.value ||
-        (isChromium !== null &&
-          typeof isChromium !== 'undefined' &&
-          vendorName === 'Google Inc.' &&
-          isOpera === false &&
-          isIEedge === false)
-      );
+      const isChromium = window.chrome,
+        winNav = window.navigator,
+        vendorName = winNav.vendor,
+        isOpera = winNav.userAgent.indexOf('OPR') > -1,
+        isIEedge = winNav.userAgent.indexOf('Edge') > -1,
+        isIOSChrome = winNav.userAgent.match('CriOS'),
+        // QQ
+        isQQBriwser =
+          winNav.userAgent.indexOf('QQBrowser') > -1 ||
+          winNav.userAgent.indexOf('QQ') > -1,
+        // 搜狗
+        isSouggou =
+          winNav.userAgent.indexOf('se 2.x') > -1 ||
+          winNav.userAgent.indexOf('MetaSr') > -1,
+        // 360
+        is360 = check360() && winNav.userAgent.indexOf('Safari') > -1,
+        // 遨游
+        isMaxthon = winNav.userAgent.indexOf('Maxthon') > -1,
+        // 是否为2345浏览器
+        is2345Explorer = winNav.userAgent.includes('2345Explorer'),
+        // 世界之窗
+        isTheWorld = winNav.userAgent.indexOf('TheWorld') > -1,
+        // 猎豹
+        isLiebao = winNav.userAgent.indexOf('LBBROWSER') > -1;
+      console.log(isQQBriwser, isSouggou, is360, isMaxthon, is2345Explorer, isTheWorld, isLiebao)
+      if (isIOSChrome) {
+        return true;
+      } else if (
+        isChromium !== null &&
+        typeof isChromium !== 'undefined' &&
+        vendorName === 'Google Inc.' &&
+        isOpera === false &&
+        isIEedge === false &&
+        isQQBriwser === false &&
+        isSouggou === false &&
+        is360 === false &&
+        isMaxthon === false &&
+        is2345Explorer === false &&
+        isTheWorld === false &&
+        isLiebao === false
+      ) {
+        return true;
+      } else {
+        return false;
+      }
     };
 
     // 获取谷歌版本
@@ -61,6 +111,7 @@ export default defineComponent({
     };
 
     const isChromeFlag = isChrome();
+    console.log('isChromeFlag', isChromeFlag);
     if (isChromeFlag) {
       const chromeVersion = getChromeVersion();
       if (!chromeVersion || (chromeVersion && chromeVersion < 100)) {

+ 2 - 2
src/views/login/index.tsx

@@ -82,8 +82,8 @@ export default defineComponent({
     })
 
     onMounted(async () => {
-      const relatedApps = await navigator.getInstalledRelatedApps();
-      console.log(relatedApps)
+      // const relatedApps = await navigator?.getInstalledRelatedApps();
+
 
       //
 

+ 25 - 2
src/views/notation/index.tsx

@@ -18,12 +18,32 @@ export default defineComponent({
     const data = reactive({
       src: `${
         /(192|localhost)/.test(location.origin)
-          ? // ? 'https://test.lexiaoya.cn'
+          ? // ?
+          // 'https://test.lexiaoya.cn'
             'http://localhost:3050'
           : location.origin
       }/notation/#/create?Authorization=${Authorization}`
       //   src: `http://localhost:3050/#/create?Authorization=${Authorization}`
     });
+    const fscreen=()=> {
+      const el = document.documentElement
+      const isFullscreen = document.fullScreen || document.mozFullScreen || document.webkitIsFullScreen
+      if (!isFullscreen) {
+        //进入全屏
+        (el.requestFullscreen && el.requestFullscreen()) ||
+        (el.mozRequestFullScreen && el.mozRequestFullScreen()) ||
+        (el.webkitRequestFullscreen && el.webkitRequestFullscreen()) ||
+        (el.msRequestFullscreen && el.msRequestFullscreen())
+      } else {
+        //退出全屏
+        document.exitFullscreen
+          ? document.exitFullscreen()
+          : document.mozCancelFullScreen
+          ? document.mozCancelFullScreen()
+          : document.webkitExitFullscreen
+          ? document.webkitExitFullscreen()
+          : ''
+      }}
     const handleOpen = (e: MessageEvent) => {
       console.log(e.data, 'data');
       if (e.data.api === 'notation_open') {
@@ -33,6 +53,7 @@ export default defineComponent({
           previewParams.value = {
             url: e.data.url
           };
+          fscreen()
         } else {
           window.open(e.data.url);
         }
@@ -86,7 +107,9 @@ export default defineComponent({
                     },
                     '*'
                   );
-                }}>
+                  if (state.application) {
+                    fscreen()
+                }}}>
                 确定
               </NButton>
               <NButton round onClick={() => (removeVisiable.value = false)}>