Browse Source

fix: streaming example

Lucas Nogueira 3 năm trước cách đây
mục cha
commit
f37a36f58b

Những thai đổi đã bị hủy bỏ vì nó quá lớn
+ 0 - 0
core/tauri/scripts/bundle.js


+ 29 - 34
examples/streaming/index.html

@@ -1,36 +1,31 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <style>
-      video {
-        width: 100vw;
-        height: 100vh;
-      }
-    </style>
-  </head>
-  <body>
-    <video
-      id="video_source"
-      controls=""
-      autoplay=""
-      name="media"
-    >
-      <source src="stream://example/test_video.mp4" type="video/mp4" />
-    </video>
-    <script>
-      ;(function () {
-        if (navigator.userAgent.includes('Windows')) {
-          const video = document.getElementById('video_source')
-          const sources = video.getElementsByTagName('source')
-          // on windows the custom protocl should be the host
-          // followed by the complete path
-          sources[0].src = 'https://stream.example/test_video.mp4'
-          video.load()
-        }
-      })()
-    </script>
-  </body>
-</html>
+
+<head>
+  <meta charset="UTF-8" />
+  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <style>
+    video {
+      width: 100vw;
+      height: 100vh;
+    }
+  </style>
+</head>
+
+<body>
+  <video id="video_source" controls="" autoplay="" name="media">
+    <source type="video/mp4" />
+  </video>
+  <script>
+    const { convertFileSrc } = window.__TAURI__.tauri
+    const video = document.getElementById('video_source')
+    const source = document.createElement('source')
+    source.type = 'video/mp4'
+    source.src = convertFileSrc('example/test_video.mp4', 'stream')
+    video.appendChild(source)
+    video.load()
+  </script>
+</body>
+
+</html>

+ 2 - 1
examples/streaming/src-tauri/tauri.conf.json

@@ -3,7 +3,8 @@
     "distDir": ["../index.html"],
     "devPath": ["../index.html"],
     "beforeDevCommand": "",
-    "beforeBuildCommand": ""
+    "beforeBuildCommand": "",
+    "withGlobalTauri": true
   },
   "tauri": {
     "bundle": {

+ 10 - 7
tooling/api/src/tauri.ts

@@ -93,7 +93,8 @@ async function invoke<T>(cmd: string, args: InvokeArgs = {}): Promise<T> {
  * Additionally, the `asset` must be allowlisted under `tauri.conf.json > tauri > allowlist > protocol`,
  * and its access scope must be defined on the `assetScope` array on the same `protocol` object.
  *
- * @param  filePath the file path.
+ * @param  filePath The file path.
+ * @param  protocol The protocol to use. Defaults to `asset`. You only need to set this when using a custom protocol.
  * @example
  * ```typescript
  * import { appDir, join } from '@tauri-apps/api/path'
@@ -102,18 +103,20 @@ async function invoke<T>(cmd: string, args: InvokeArgs = {}): Promise<T> {
  * const filePath = await join(appDir, 'assets/video.mp4')
  * const assetUrl = convertFileSrc(filePath)
  * 
- * const video = document.getElementById('video_source')
- * const sources = video.getElementsByTagName('source')
- * sources[0].src = assetUrl
+ * const video = document.getElementById('my-video')
+ * const source = document.createElement('source')
+ * source.type = 'video/mp4'
+ * source.src = assetUrl
+ * video.appendChild(source)
  * video.load()
  * ```
  *
  * @return the URL that can be used as source on the webview.
  */
-function convertFileSrc(filePath: string): string {
+function convertFileSrc(filePath: string, protocol = 'asset'): string {
   return navigator.userAgent.includes('Windows')
-    ? `https://asset.localhost/${filePath}`
-    : `asset://${filePath}`
+    ? `https://${protocol}.localhost/${filePath}`
+    : `${protocol}://${filePath}`
 }
 
 export type { InvokeArgs }

Một số tệp đã không được hiển thị bởi vì quá nhiều tập tin thay đổi trong này khác