增加webrtc功能

package.json

@@ -18,7 +18,6 @@
     "echarts": "^5.6.0",
     "naive-ui": "^2.40.1",
     "pinia": "^2.2.6",
-    "pinia-plugin-persist": "^1.0.0",
     "vue": "^3.5.13",
     "vue-router": "^4.4.0"
   },

src-tauri/Cargo.lock

@@ -250,16 +250,16 @@ dependencies = [
 
 [[package]]
 name = "cargo_metadata"
-version = "0.18.1"
+version = "0.19.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "2d886547e41f740c616ae73108f6eb70afe6d940c7bc697cb30f13daec073037"
+checksum = "8769706aad5d996120af43197bf46ef6ad0fda35216b4505f926a365a232d924"
 dependencies = [
  "camino",
  "cargo-platform",
  "semver",
  "serde",
  "serde_json",
- "thiserror 1.0.69",
+ "thiserror 2.0.9",
 ]
 
 [[package]]
@@ -274,9 +274,9 @@ dependencies = [
 
 [[package]]
 name = "cc"
-version = "1.2.6"
+version = "1.2.7"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "8d6dbb628b8f8555f86d0323c2eb39e3ec81901f4b83e091db8a6a76d316a333"
+checksum = "a012a0df96dd6d06ba9a1b29d6402d1a5d77c6befd2566afdc26e10603dc93d7"
 dependencies = [
  "shlex",
 ]
@@ -506,7 +506,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "13b588ba4ac1a99f7f2964d24b3d896ddc6bf847ee3855dbd4366f058cfcd331"
 dependencies = [
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -516,7 +516,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "32a2785755761f3ddc1492979ce1e48d2c00d09311c39e4466429188f3dd6501"
 dependencies = [
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -540,7 +540,7 @@ dependencies = [
  "proc-macro2",
  "quote",
  "strsim",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -551,7 +551,7 @@ checksum = "d336a2a514f6ccccaa3e09b02d41d35330c07ddf03a62165fcec10bb561c7806"
 dependencies = [
  "darling_core",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -580,7 +580,7 @@ dependencies = [
  "proc-macro2",
  "quote",
  "rustc_version",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -628,7 +628,7 @@ checksum = "97369cbbc041bc366949bc74d34658d6cda5621039731c6310521892a3a20ae0"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -651,7 +651,7 @@ checksum = "f2b99bf03862d7f545ebc28ddd33a665b50865f4dfd84031a393823879bd4c54"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -815,7 +815,7 @@ checksum = "1a5c6c585bc94aaf2c7b51dd4c2ba22680844aba4c687be581871a6f518c5742"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -889,7 +889,7 @@ checksum = "162ee34ebcb7c64a8abebc059ce0fee27c2262618d7b60ed8faf72fef13c3650"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -1133,7 +1133,7 @@ dependencies = [
  "proc-macro-error",
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -1212,7 +1212,7 @@ dependencies = [
  "proc-macro-error",
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -1485,7 +1485,7 @@ checksum = "1ec89e9337638ecdc08744df490b221a7399bf8d164eb52a665454e60e075ad6"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -1546,15 +1546,6 @@ dependencies = [
  "cfb",
 ]
 
-[[package]]
-name = "instant"
-version = "0.1.13"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "e0242819d153cba4b4b05a5a8f2a7e9bbf97b6055b2a002b395c96b5ff3c0222"
-dependencies = [
- "cfg-if",
-]
-
 [[package]]
 name = "ipnet"
 version = "2.10.1"
@@ -1947,7 +1938,7 @@ dependencies = [
  "proc-macro-crate 2.0.2",
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -2215,7 +2206,7 @@ checksum = "a948666b637a0f465e8564c73e89d4dde00d72d4d473cc972f390fc3dcee7d9c"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -2400,7 +2391,7 @@ dependencies = [
  "phf_shared 0.11.2",
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -2908,7 +2899,7 @@ dependencies = [
  "proc-macro2",
  "quote",
  "serde_derive_internals",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -2997,7 +2988,7 @@ checksum = "5a9bf7cf98d04a2b28aead066b7496853d4779c9cc183c440dbac457641e19a0"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -3008,7 +2999,7 @@ checksum = "18d26a20a969b9e3fdf2fc2d9f21eda6c40e2de84c9408bb5d3b05d499aae711"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -3031,7 +3022,7 @@ checksum = "6c64451ba24fc7a6a2d60fc75dd9c83c90903b19028d4eff35e88fc1e86564e9"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -3082,7 +3073,7 @@ dependencies = [
  "darling",
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -3296,9 +3287,9 @@ dependencies = [
 
 [[package]]
 name = "syn"
-version = "2.0.93"
+version = "2.0.94"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "9c786062daee0d6db1132800e623df74274a0a87322d8e183338e01b3d98d058"
+checksum = "987bc0be1cdea8b10216bd06e2ca407d40b9543468fafd3ddfb02f36e77f71f3"
 dependencies = [
  "proc-macro2",
  "quote",
@@ -3322,7 +3313,7 @@ checksum = "c8af7666ab7b6390ab78131fb5b0fce11d6b7a6951602017c35fa82800708971"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -3340,9 +3331,9 @@ dependencies = [
 
 [[package]]
 name = "tao"
-version = "0.30.8"
+version = "0.31.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "6682a07cf5bab0b8a2bd20d0a542917ab928b5edb75ebd4eda6b05cbaab872da"
+checksum = "cc6b53216f32e60efc27dfa111268481e4dfba53e553e4cdebcaed9db36c11bb"
 dependencies = [
  "bitflags 2.6.0",
  "cocoa",
@@ -3355,7 +3346,6 @@ dependencies = [
  "gdkwayland-sys",
  "gdkx11-sys",
  "gtk",
- "instant",
  "jni",
  "lazy_static",
  "libc",
@@ -3385,7 +3375,7 @@ checksum = "f4e16beb8b2ac17db28eab8bca40e62dbfbb34c0fcdc6d9826b11b7b5d047dfd"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -3396,9 +3386,9 @@ checksum = "61c41af27dd6d1e27b1b16b489db798443478cef1f06a660c96db617ba5de3b1"
 
 [[package]]
 name = "tauri"
-version = "2.1.1"
+version = "2.2.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "e545de0a2dfe296fa67db208266cd397c5a55ae782da77973ef4c4fac90e9f2c"
+checksum = "2e2e3349fbb2be7af9fad1b43d61ac83ba55ab48d47fbe1b2732f0c8211610a9"
 dependencies = [
  "anyhow",
  "bytes",
@@ -3446,9 +3436,9 @@ dependencies = [
 
 [[package]]
 name = "tauri-build"
-version = "2.0.3"
+version = "2.0.4"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "7bd2a4bcfaf5fb9f4be72520eefcb61ae565038f8ccba2a497d8c28f463b8c01"
+checksum = "b274ec7239ada504deb615f1c8abd7ba99631e879709e6f10e5d17217058d976"
 dependencies = [
  "anyhow",
  "cargo_toml",
@@ -3468,9 +3458,9 @@ dependencies = [
 
 [[package]]
 name = "tauri-codegen"
-version = "2.0.3"
+version = "2.0.4"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "bf79faeecf301d3e969b1fae977039edb77a4c1f25cc0a961be298b54bff97cf"
+checksum = "f77894f9ddb5cb6c04fcfe8c8869ebe0aded4dabf19917118d48be4a95599ab5"
 dependencies = [
  "base64 0.22.1",
  "brotli",
@@ -3484,7 +3474,7 @@ dependencies = [
  "serde",
  "serde_json",
  "sha2",
- "syn 2.0.93",
+ "syn 2.0.94",
  "tauri-utils",
  "thiserror 2.0.9",
  "time",
@@ -3495,23 +3485,23 @@ dependencies = [
 
 [[package]]
 name = "tauri-macros"
-version = "2.0.3"
+version = "2.0.4"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "c52027c8c5afb83166dacddc092ee8fff50772f9646d461d8c33ee887e447a03"
+checksum = "3240a5caed760a532e8f687be6f05b2c7d11a1d791fb53ccc08cfeb3e5308736"
 dependencies = [
  "heck 0.5.0",
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
  "tauri-codegen",
  "tauri-utils",
 ]
 
 [[package]]
 name = "tauri-plugin"
-version = "2.0.3"
+version = "2.0.4"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "e753f2a30933a9bbf0a202fa47d7cc4a3401f06e8d6dcc53b79aa62954828c79"
+checksum = "5841b9a0200e954ef7457f8d327091424328891e267a97b641dc246cc54d0dec"
 dependencies = [
  "anyhow",
  "glob",
@@ -3526,9 +3516,9 @@ dependencies = [
 
 [[package]]
 name = "tauri-plugin-mqtt"
-version = "0.1.0"
+version = "0.1.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "0124aaa93ad9a92b0bb172796db3c6f0042a3f3874194b8b91bc989a28bfeb4e"
+checksum = "e21bab7247ee3bbe66cb0896b6d7f8261234c7bbb20025ce7c9e68fad877c9d1"
 dependencies = [
  "anyhow",
  "debug_print",
@@ -3545,9 +3535,9 @@ dependencies = [
 
 [[package]]
 name = "tauri-runtime"
-version = "2.2.0"
+version = "2.3.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "cce18d43f80d4aba3aa8a0c953bbe835f3d0f2370aca75e8dbb14bd4bab27958"
+checksum = "2274ef891ccc0a8d318deffa9d70053f947664d12d58b9c0d1ae5e89237e01f7"
 dependencies = [
  "dpi",
  "gtk",
@@ -3564,9 +3554,9 @@ dependencies = [
 
 [[package]]
 name = "tauri-runtime-wry"
-version = "2.2.0"
+version = "2.3.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "9f442a38863e10129ffe2cec7bd09c2dcf8a098a3a27801a476a304d5bb991d2"
+checksum = "3707b40711d3b9f6519150869e358ffbde7c57567fb9b5a8b51150606939b2a0"
 dependencies = [
  "gtk",
  "http",
@@ -3590,9 +3580,9 @@ dependencies = [
 
 [[package]]
 name = "tauri-utils"
-version = "2.1.0"
+version = "2.1.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "9271a88f99b4adea0dc71d0baca4505475a0bbd139fb135f62958721aaa8fe54"
+checksum = "96fb10e7cc97456b2d5b9c03e335b5de5da982039a303a20d10006885e4523a0"
 dependencies = [
  "brotli",
  "cargo_metadata",
@@ -3637,12 +3627,13 @@ dependencies = [
 
 [[package]]
 name = "tempfile"
-version = "3.14.0"
+version = "3.15.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "28cce251fcbc87fac86a866eeb0d6c2d536fc16d06f184bb61aeae11aa4cee0c"
+checksum = "9a8a559c81686f576e8cd0290cd2a24a2a9ad80c98b3478856500fcbd7acd704"
 dependencies = [
  "cfg-if",
  "fastrand",
+ "getrandom 0.2.15",
  "once_cell",
  "rustix",
  "windows-sys 0.59.0",
@@ -3702,7 +3693,7 @@ checksum = "4fee6c4efc90059e10f81e6d42c60a18f76588c3d74cb83a0b242a2b6c7504c1"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -3713,7 +3704,7 @@ checksum = "7b50fa271071aae2e6ee85f842e2e28ba8cd2c5fb67f11fcb1fd70b276f9e7d4"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -3781,7 +3772,7 @@ checksum = "693d596312e88961bc67d7f1f97af8a70227d9f90c31bba5806eec004978d752"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -4163,7 +4154,7 @@ dependencies = [
  "log",
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
  "wasm-bindgen-shared",
 ]
 
@@ -4198,7 +4189,7 @@ checksum = "30d7a95b763d3c45903ed6c81f156801839e5ee968bb07e534c44df0fcd330c2"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
  "wasm-bindgen-backend",
  "wasm-bindgen-shared",
 ]
@@ -4278,9 +4269,9 @@ dependencies = [
 
 [[package]]
 name = "webview2-com"
-version = "0.33.0"
+version = "0.34.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "6f61ff3d9d0ee4efcb461b14eb3acfda2702d10dc329f339303fc3e57215ae2c"
+checksum = "823e7ebcfaea51e78f72c87fc3b65a1e602c321f407a0b36dbb327d7bb7cd921"
 dependencies = [
  "webview2-com-macros",
  "webview2-com-sys",
@@ -4298,14 +4289,14 @@ checksum = "1d228f15bba3b9d56dde8bddbee66fa24545bd17b48d5128ccf4a8742b18e431"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
 name = "webview2-com-sys"
-version = "0.33.0"
+version = "0.34.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "a3a3e2eeb58f82361c93f9777014668eb3d07e7d174ee4c819575a9208011886"
+checksum = "7a82bce72db6e5ee83c68b5de1e2cd6ea195b9fbff91cb37df5884cbe3222df4"
 dependencies = [
  "thiserror 1.0.69",
  "windows",
@@ -4397,7 +4388,7 @@ checksum = "2bbd5b46c938e506ecbce286b6628a02171d56153ba733b6c741fc627ec9579b"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -4408,7 +4399,7 @@ checksum = "053c4c462dc91d3b1504c6fe5a726dd15e216ba718e84a0e46a88fbe5ded3515"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -4697,9 +4688,9 @@ checksum = "1e9df38ee2d2c3c5948ea468a8406ff0db0b29ae1ffde1bcf20ef305bcc95c51"
 
 [[package]]
 name = "wry"
-version = "0.47.2"
+version = "0.48.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "61ce51277d65170f6379d8cda935c80e3c2d1f0ff712a123c8bddb11b31a4b73"
+checksum = "1e644bf458e27b11b0ecafc9e5633d1304fdae82baca1d42185669752fe6ca4f"
 dependencies = [
  "base64 0.22.1",
  "block2",
@@ -4727,7 +4718,7 @@ dependencies = [
  "sha2",
  "soup3",
  "tao-macros",
- "thiserror 1.0.69",
+ "thiserror 2.0.9",
  "url",
  "webkit2gtk",
  "webkit2gtk-sys",
@@ -4779,7 +4770,7 @@ checksum = "2380878cad4ac9aac1e2435f3eb4020e8374b5f13c296cb75b4620ff8e229154"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
  "synstructure",
 ]
 
@@ -4801,7 +4792,7 @@ checksum = "fa4f8080344d4671fb4e831a13ad1e68092748387dfc4f55e356242fae12ce3e"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]
 
 [[package]]
@@ -4821,7 +4812,7 @@ checksum = "595eed982f7d355beb85837f651fa22e90b3c044842dc7f2c2842c086f295808"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
  "synstructure",
 ]
 
@@ -4850,5 +4841,5 @@ checksum = "6eafa6dfb17584ea3e2bd6e76e0cc15ad7af12b09abdd1ca55961bed9b1063c6"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.93",
+ "syn 2.0.94",
 ]

src-tauri/Cargo.toml

@@ -21,4 +21,4 @@ tauri-build = { version = "2", features = [] }
 tauri = { version = "2", features = ["macos-private-api"] }
 serde = { version = "1", features = ["derive"] }
 serde_json = "1"
-tauri-plugin-mqtt = "0.1.0"
+tauri-plugin-mqtt = "0.1.1"

src/App.vue

@@ -28,17 +28,17 @@ const store = useStore()
 const router = useRouter()
 const show = computed(() => store.loading)
 const themeOverrides = Theme
-
+router.push('/room')
 watch(() => store.mqtt_message, (val) => {
   console.log('顶级监听', val)
 
-  if (val.type === 'leave' || val.type === 'disconnect') {
-    router.push('/')
-  }
+  // if (val.type === 'leave' || val.type === 'disconnect') {
+  //   router.push('/')
+  // }
 
-  if (val.type === 'connect') {
-    router.push('/room')
-  }
+  // if (val.type === 'connect') {
+  //   router.push('/room')
+  // }
 })
 
 provide('MQTT', mqtt)

src/main.ts

@@ -1,6 +1,5 @@
 import { createApp } from 'vue'
 import { createPinia } from 'pinia'
-import piniaPersist from 'pinia-plugin-persist'
 import {
   createRouter, createWebHistory, RouteRecordRaw
 } from 'vue-router'
@@ -10,7 +9,6 @@ import Icon from '@/components/icon.vue'
 import 'virtual:svg-icons-register'
 
 const store = createPinia()
-store.use(piniaPersist)
 
 // 动态路由
 const routes = Object.values(import.meta.glob('./pages/*/route.ts', { eager: true, import: 'default' })) as unknown as RouteRecordRaw[]

src/pages/login/index.vue

@@ -63,18 +63,21 @@ import {
 import topBar from '@/components/topBar.vue'
 import useStore from '@/store/index'
 
-const dic = { leave: '对方离开房间', disconnect: '连接断开' }
 const store = useStore()
 const mqtt = inject('MQTT')
-const name = ref('test123')
-const room = ref('test')
-const url = ref('mqtts://caner.top:49659')
+const name = ref(localStorage.getItem('NAME') || '')
+const room = ref(localStorage.getItem('ROOM') || '')
+const url = ref(localStorage.getItem('URL') || '')
+const dic = { leave: '对方离开房间', disconnect: '连接断开' }
 const disabled = computed(() => !name.value || !room.value || !url.value || !url.value.startsWith('mqtts:'))
 const err = computed(() => dic[store.mqtt_message.type])
 
 async function login() {
   if (disabled.value) return
   await mqtt.connect(url.value, room.value, name.value)
+  localStorage.setItem('NAME', name.value)
+  localStorage.setItem('ROOM', room.value)
+  localStorage.setItem('URL', url.value)
 }
 </script>
 <style scoped lang="scss">

src/pages/room/index.vue

@@ -1,43 +1,77 @@
 <template>
   <div class="room">
-    <topBar
-      class="room-bar"
-    >
+    <topBar class="room-bar">
       <signal :signal-value="signalValue" />
       <audiod :state="audioValue" />
       <battery :quantity="batteryValue" />
     </topBar>
-    <video
-      ref="remoteVideo"
-      autoplay
-      playsinline
-    />
+    <video ref="remoteVideo" autoplay playsinline />
     <div class="room-gauge">
-      <gauge
-        :value="SpeedValue"
-        :gears="conctrlNum % 2 ? '倒档' : '前进'"
-      />
+      <gauge :value="SpeedValue" :gears="conctrlNum % 2 ? '倒档' : '前进'" />
     </div>
   </div>
 </template>
 
 <script setup lang='ts'>
-import { ref } from 'vue'
+import { ref, onMounted, inject } from 'vue'
 import topBar from '@/components/topBar.vue'
 import signal from '@/components/signal.vue'
 import battery from '@/components/battery.vue'
 import gauge from '@/components/gauge.vue'
 import audiod from '@/components/audio.vue'
+import WebRtcService from '@/services/webrtc.service'
+import useStore from './store/index'
 
 const signalValue = ref(5)
 const batteryValue = ref(50)
 const SpeedValue = ref(60)
-const conctrlNum = ref(1)
+const conctrlNum = ref(0)
 const audioValue = ref(3)
+const remoteVideo = ref<HTMLVideoElement | null>(null)
+const RTC = new WebRtcService()
+const store = useStore()
+const mqtt = inject('MQTT')
 
-async function test() {
-  console.log(123)
-}
+onMounted(() => RTC.initRTC(remoteVideo, (event) => {
+  console.log(1111, event)
+  const { msg, code, data } = event
+  // 把自己的answer发送给对方
+  if (code === 200 && msg === 'answer') {
+    mqtt.send(JSON.stringify(data))
+  }
+
+  // 连接成功
+  if(code === 200 && msg === 'connected') {
+   console.log('可以发送控制数据');
+  }
+
+  // 连接失败
+  if(code === 500) {
+    console.log('连接失败');
+    RTC.distory()
+    mqtt.disconnect()
+  }
+
+}))
+
+watch(() => store.mqtt_message, (val) => {
+  // mqtt断开连接
+  if (val.type === 'leave' || val.type === 'disconnect') {
+    router.push('/')
+  }
+
+  // 对方加入告诉对方开始推流
+  if (val.type === 'join') {
+    mqtt.send(JSON.stringify({ type: 'startRTC' }))
+  }
+
+  // 对方发的offer
+  if (val.type === 'offer') {
+    await Peer.value?.setRemoteDescription(msg)
+    const answerd = await Peer.value?.createAnswer()
+    await Peer.value?.setLocalDescription(answerd)
+  }
+})
 
 </script>
 <style lang="scss" scoped>
@@ -46,15 +80,16 @@ async function test() {
   height: 100%;
   position: relative;
 
-&-bar{
-  :deep(.topBar-content){
-    display: flex;
-    align-items: flex-end;
-    &>*{
-      margin: 0 5px 0 10px;
+  &-bar {
+    :deep(.topBar-content) {
+      display: flex;
+      align-items: flex-end;
+
+      &>* {
+        margin: 0 5px 0 10px;
+      }
     }
   }
-}
 
   video {
     width: 100%;

src/services/webrtc.service.ts

@@ -0,0 +1,78 @@
+import { injectable, Service } from './service'
+
+/**
+ * WebRTC服务
+ */
+@injectable
+export default class WebRtcService extends Service {
+  private ICE = [
+    {
+      urls: [ 'stun:caner.top:3478' ]
+    },
+    {
+      urls: 'turn:caner.top:3478',
+      username: 'admin',
+      credential: '123456'
+    }
+  ]
+
+  public Peer: RTCPeerConnection | null = null
+
+  private sleep = (ms: number) => new Promise((res) => setTimeout(res, ms))
+
+  initRTC(DOM: HTMLVideoElement, callBack: (event: Any) => void) {
+    try {
+      if (!DOM) { callBack({ msg: 'DOM不存在', code: 500, data: null }); return }
+      console.log('start initRTC')
+
+      // create Peer
+      this.Peer = new RTCPeerConnection({
+        iceServers: this.ICE,
+        bundlePolicy: 'max-bundle'
+      })
+
+      // listen state
+      this.Peer.onicegatheringstatechange = () => {
+        console.log('GatheringState: ', this.Peer?.iceGatheringState)
+        if (this.Peer?.iceGatheringState === 'complete') {
+          const answer = this.Peer?.localDescription
+          console.log('send answer', answer)
+          callBack({ msg: 'answer', code: 200, data: answer?.toJSON() })
+        }
+      }
+
+      // listen track
+      this.Peer.ontrack = async (evt) => {
+        console.log('track', evt)
+        DOM.srcObject = evt.streams[0]
+      }
+
+      // listen changestate·
+      this.Peer.oniceconnectionstatechange = async () => {
+        const state = this.Peer?.iceConnectionState
+        console.log('StateChange', state)
+        if (state === 'failed' || state === 'disconnected' || state === 'closed') {
+          console.log('P2P通信失败')
+          callBack({ msg: 'P2P通信失败', code: 500, data: null })
+        }
+
+        // ICE连接成功
+        if (state === 'connected') {
+          await this.sleep(3000)
+          console.log('P2P通信成功, 开始发送控制数据')
+          callBack({ msg: 'connected', code: 200, data: null })
+        }
+      }
+
+      console.log('RTC success')
+    } catch (error) {
+      console.log('RTC 初始化失败', error)
+      callBack({ msg: `RTC 初始化失败${error}`, code: 500, data: null })
+    }
+  }
+
+  distory() {
+    this.Peer?.close()
+    this.Peer = null
+  }
+}

src/store/index.ts

@@ -1,11 +1,5 @@
 import { defineStore } from 'pinia'
 
-export interface UserInfo {
-  url: string,
-  name: string,
-  room: string
-}
-
 export interface MqttMessage {
   type: string;
   [key: string]: any
@@ -14,23 +8,12 @@ export interface MqttMessage {
 // id必填，且需要唯一
 const useStore = defineStore('index', {
   state: () => ({
-    userInfro: {
-      url: '',
-      name: '',
-      room: ''
-    },
     mqtt_message: { type: '' }
   }),
   actions: {
-    setUserInfo(data: UserInfo) {
-      this.userInfro = data
-    },
     setMqttMessage(data: MqttMessage) {
       this.mqtt_message = data
     }
-  },
-  persist: {
-    enabled: true // true 表示开启持久化保存
   }
 })
 export default useStore