update

public/index.html

@@ -24,6 +24,7 @@
         <script src="<%= BASE_URL %><%= VUE_APP_STATIC_DIR %>/static/lib/vconsole.js"></script>
         <script src="<%= BASE_URL %><%= VUE_APP_STATIC_DIR %>/static/lib/swiper/swiper-bundle.min.js"></script>
         <script src="<%= BASE_URL %><%= VUE_APP_STATIC_DIR %>/static/lib/socket.io.min.js"></script>
+        <script src="<%= BASE_URL %><%= VUE_APP_STATIC_DIR %>/static/lib/lib-generate-test-usersig.min.js"></script>
 
 
         <script src="<%= BASE_URL %><%= VUE_APP_STATIC_DIR %>/static/lib/jweixin-1.6.0.js"></script>

src/components/RTC/PageRtcLive.vue

@@ -94,7 +94,7 @@
 </template>
 
 <script setup>
-import { onMounted, watch, defineEmits, ref, reactive, computed, nextTick } from "vue";
+import { onMounted,onUnmounted, watch, defineEmits, ref, reactive, computed, nextTick } from "vue";
 import { useApp, getApp } from "@/app";
 import { useStore } from "vuex";
 import { Dialog } from "@/global_components/";
@@ -146,7 +146,7 @@ let getUrl = (href, queryArr) => {
     if (!browser.hasURLParam(item.key)) {
       let ttt = href.split("index.html?");
       href = `${ttt[0]}index.html?${item.key}=${item.val}&${ttt[1]}`;
-      console.log(href,'------index.htmlindex.htmlindex.htmlindex.htmlindex.htmlindex.htmlindex.html----------');
+      console.log(href, "------index.htmlindex.htmlindex.htmlindex.htmlindex.htmlindex.htmlindex.html----------");
     } else {
       href = browser.replaceQueryString(href, item.key, item.val);
     }
@@ -461,7 +461,6 @@ watch(
   () => {
     if (role.value == "leader") {
       all_mute_mic.value = !user_list.value.some((item) => !item.IsMuted && item.Role == "customer");
-      console.log(all_mute_mic.value, "user_list,valueuser_list,valueuser_list,valueuser_list,valueuser_list,valueuser_list,value");
     }
   },
   {
@@ -537,6 +536,13 @@ const startFollow = (app) => {
       },
     ]);
 
+    wxShare({
+      title: `【好友推薦】一起雲逛店吧~`,
+      desc: "【好友推薦】一起雲逛店吧~",
+      link: shareLink.value,
+      imgUrl: "https://glp-vr.cdfmembers.com/cdf/file/91dd5305525f463286f03a31abd1c154.jpg",
+    });
+
     if (browser.detectWeixin()) {
       //ios的ua中无miniProgram，但都有MicroMessenger（表示是微信浏览器）
       wx.miniProgram.getEnv((res) => {
@@ -553,13 +559,6 @@ const startFollow = (app) => {
       });
     }
 
-    wxShare({
-      title: `【好友推薦】一起雲逛店吧~`,
-      desc: "【好友推薦】一起雲逛店吧~",
-      link: shareLink.value,
-      imgUrl: "https://glp-vr.cdfmembers.com/cdf/file/91dd5305525f463286f03a31abd1c154.jpg",
-    });
-
     console.log("分享", shareLink.value);
 
     let tmp = "";
@@ -669,20 +668,29 @@ const startFollow = (app) => {
   });
 };
 
-onMounted(() => {
-  useApp().then((app) => {
-    startFollow(app);
-    app.Connect.follow.on("data", (data) => {
-      if (isJoined.value) {
-        socket.value.emit("sync", data);
-      }
-    });
+let onfollowData = (data) => {
+  console.log(111111111111, data);
+  if (isJoined.value) {
+    socket.value.emit("sync", data);
+  }
+};
 
-    app.Connect.paint.on("data", (data) => {
-      canUndo.value = app.Connect.paint.records.length > 0;
-      socket.value.emit("paint", data);
-    });
-  });
+let onfollowPaint = (data) => {
+  canUndo.value = app.Connect.paint.records.length > 0;
+  socket.value.emit("paint", data);
+};
+
+onMounted(async () => {
+  let app = await getApp();
+  startFollow(app);
+  app.Connect.follow.on("data", onfollowData);
+  app.Connect.paint.on("data", onfollowPaint);
+});
+
+onUnmounted(async () => {
+  let app = await getApp();
+  app.Connect.follow.off("data", onfollowData);
+  app.Connect.follow.off("data", onfollowData);
 });
 </script>
 

src/components/RTC/Trtccom.vue

@@ -41,7 +41,7 @@ import { ref, computed, watch, defineEmits, defineProps, nextTick, onUnmounted }
 import Device from "./trtc/Device";
 import { useStore } from "vuex";
 import browser from "@/utils/browser";
-import * as apis from "@/apis/index.js";
+// import * as apis from "@/apis/index.js";
 
 const emit = defineEmits(["audioMuted", "videoMuted"]);
 
@@ -62,7 +62,7 @@ const videoDeviceId = computed(() => store.getters["rtc/videoDeviceId"]);
 const initParamsStates = computed(
   () => !!(store.getters["rtc/sdkAppId"] && store.getters["rtc/secretKey"] && store.getters["rtc/roomId"] && store.getters["rtc/userId"])
 );
-
+const userSig = computed(() => store.getters["rtc/userSig"]);
 let localClient = "";
 let localStream = "";
 let shareClient = "";
@@ -143,12 +143,12 @@ async function handleJoin() {
   }
 
   try {
-    let res = await apis.getSign({ userId: store.getters["rtc/userId"] });
+    // let res = await apis.getSign({ userId: store.getters["rtc/userId"] });
     localClient = TRTC.createClient({
       mode: "rtc",
       sdkAppId: parseInt(store.getters["rtc/sdkAppId"], 10),
       userId: store.getters["rtc/userId"],
-      userSig: res.data.sign,
+      userSig: userSig.value,
       useStringRoomId: true,
       enableAutoPlayDialog: false,
     });

src/store/modules/rtc.js

@@ -1,17 +1,18 @@
 
 
 
+import { genTestUserSig } from '@/utils/generateTestUserSig';
 export default {
     namespaced: true,
     state() {
         return {
             socket: null,
             showdaogou: false,
-            sdkAppId: 1400709402,
+            sdkAppId: "1400709402",
             userId: '',
             roomId: '',
             role:'',
-            secretKey: 'ef391b02e6423a6db15eea3d9a0c131f2abac921204246bbe3f36fcea7d111d',
+            secretKey: 'def391b02e6423a6db15eea3d9a0c131f2abac921204246bbe3f36fcea7d111d',
             userSig: 'eJw1jlELgjAURv-LnkPunXNToZceosB6SPsBwVbelrLpFCH675XW43c*Dpwnq4oyMpOjzrBcgkgBVjMbTcdyxiNgy*61vThHmuUoABRkAvjykDZtoCvNAsbAUaWA8u-R7YttFno-JNPou7LBuH0MQR6t2tp6cz-5sy75zrXV3heH9U8M1HySUCapirnC7PUGl3Ix6g__',
             audioDeviceId: '',
             videoDeviceId: '',
@@ -32,14 +33,19 @@ export default {
         showdaogou: state => {
             return state.showdaogou
         },
+        userSig: state => {
+            const { userSig } = genTestUserSig({
+                sdkAppId: parseInt(state.sdkAppId, 10),
+                userId:state.userId,
+                secretKey: state.secretKey,
+            });
+            return userSig
+        },
         sdkAppId: state => state.sdkAppId,
         role: state => state.role,
         userId: state => state.userId,
         roomId: state => state.roomId,
         secretKey: state => state.secretKey,
-        userSig: state => {
-            return state.userSig
-        },
         audioDeviceId: state => state.audioDeviceId,
         videoDeviceId: state => state.videoDeviceId,
         cameraList: state => state.cameraList,