Tauri + Svelte + TypeScript 学习(二)
- 使用二进制文件 此处以FFmpeg为例
$ 复制FFmpeg的二进制文件到src-tauri/bin目录
$ 配置src-tauri/tauri.conf.json文件中的tauri.allowlist与externalBin
$ 文章最后会包含tauri.conf.json的全部配置
- 通过TypeScript调用
import { Command } from "@tauri-apps/api/shell";
const ffmpeg = Command.sidecar("bin/ffmpeg", ['-i', 'input.mp4', 'out.mp4']);
await ffprobe.execute();
- 访问系统文件,并通过前端访问到
$ 配置src-tauri/tauri.conf.json文件中的build.withGlobalTauri、tauri.allowlist.protocol、
security.scp
$ 具体配置再文章最后
- TypeScript使用
import { convertFileSrc } from "@tauri-apps/api/tauri";
let srcUrl = convertFileSrc(playerFile);
const video = document.getElementById('my-video');
const source = document.createElement('source');
source.type = 'video/mp4';
source.src = srcUrl;
video.appendChild(source);
video.load();
- src-tauri/tauri.conf.json文件配置如下
{
"$schema": "../node_modules/@tauri-apps/cli/schema.json",
"build": {
"beforeBuildCommand": "yarn build",
"beforeDevCommand": "yarn dev",
"devPath": "http://localhost:8080",
"distDir": "../public",
"withGlobalTauri": true
},
"package": {
"productName": "ave",
"version": "0.1.0"
},
"tauri": {
"allowlist": {
"notification": {
"all": true
},
"path": {
"all": true
},
"shell": {
"sidecar": true,
"execute": true,
"open": "",
"scope": [
{ "name": "bin/ffmpeg", "args": true, "sidecar": true },
{ "name": "bin/ffprobe", "args": true, "sidecar": true }
]
},
"protocol": {
"asset": true,
"assetScope": ["*"]
}
},
"bundle": {
"active": true,
"category": "DeveloperTool",
"copyright": "",
"deb": {
"depends": []
},
"externalBin": [
"bin/ffmpeg",
"bin/ffprobe"
],
"icon": [
"icons/32x32.png",
"icons/128x128.png",
"icons/128x128@2x.png",
"icons/icon.icns",
"icons/icon.ico"
],
"identifier": "com.schizobulia.ave",
"longDescription": "",
"macOS": {
"entitlements": null,
"exceptionDomain": "",
"frameworks": [],
"providerShortName": null,
"signingIdentity": null
},
"resources": [],
"shortDescription": "",
"targets": "all",
"windows": {
"certificateThumbprint": null,
"digestAlgorithm": "sha256",
"timestampUrl": ""
}
},
"security": {
"csp": "default-src: 'self'; media-src 'self' asset:"
},
"updater": {
"active": false
},
"windows": [
{
"fullscreen": false,
"height": 600,
"resizable": true,
"title": "ave",
"width": 800
}
]
}
}
参考项目: github.com/schizobulia/ave-v1
如果你喜欢我的作品,请考虑赞助我,以保持它们的可持续性。
本作品采用《CC 协议》,转载必须注明作者和本文链接