dumtruck/konowebcodecs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Move .lfsconfig and update usage

Browse Source
This commit is contained in:
Jerome Wu 2023-07-27 00:08:03 +08:00
parent de1f32542e
commit 7d499dd4ff
3 changed files with 17 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

0
apps/website/.lfsconfig → .lfsconfig
View File

20
apps/website/docs/getting-started/usage.md
View File

@ -17,17 +17,19 @@ a ~31 MB ffmpeg-core.wasm.
// import { FFmpeg } from '@ffmpeg/ffmpeg'; // import { FFmpeg } from '@ffmpeg/ffmpeg';
// import { fetchFile } from '@ffmpeg/util'; // import { fetchFile } from '@ffmpeg/util';
function() { function() {
const baseURL = 'https://unpkg.com/@ffmpeg/core@0.12.1/dist/umd'
const [loaded, setLoaded] = useState(false); const [loaded, setLoaded] = useState(false);
const ffmpegRef = useRef(new FFmpeg()); const ffmpegRef = useRef(new FFmpeg());
const videoRef = useRef(null); const videoRef = useRef(null);
const messageRef = useRef(null); const messageRef = useRef(null);
const load = async () => { const load = async () => {
const baseURL = 'https://unpkg.com/@ffmpeg/core@0.12.1/dist/umd'
const ffmpeg = ffmpegRef.current; const ffmpeg = ffmpegRef.current;
ffmpeg.on("log", ({ message }) => { ffmpeg.on("log", ({ message }) => {
messageRef.current.innerHTML = message; messageRef.current.innerHTML = message;
}); });
// toBlobURL is used to bypass CORS issue, urls with the same
// domain can be used directly.
await ffmpeg.load({ await ffmpeg.load({
coreURL: await toBlobURL(`${baseURL}/ffmpeg-core.js`), coreURL: await toBlobURL(`${baseURL}/ffmpeg-core.js`),
wasmURL: await toBlobURL(`${baseURL}/ffmpeg-core.wasm`), wasmURL: await toBlobURL(`${baseURL}/ffmpeg-core.wasm`),
@ -138,11 +140,17 @@ function() {
const messageRef = useRef(null); const messageRef = useRef(null);
const load = async () => { const load = async () => {
const baseURL = 'https://unpkg.com/@ffmpeg/core@0.12.1/dist/umd'
const ffmpeg = ffmpegRef.current; const ffmpeg = ffmpegRef.current;
ffmpeg.on("log", ({ message }) => { ffmpeg.on("log", ({ message }) => {
messageRef.current.innerHTML = message; messageRef.current.innerHTML = message;
}); });
await ffmpeg.load(); // toBlobURL is used to bypass CORS issue, urls with the same
// domain can be used directly.
await ffmpeg.load({
coreURL: await toBlobURL(`${baseURL}/ffmpeg-core.js`),
wasmURL: await toBlobURL(`${baseURL}/ffmpeg-core.wasm`),
});
setLoaded(true); setLoaded(true);
} }
@ -186,12 +194,18 @@ function() {
const messageRef = useRef(null); const messageRef = useRef(null);
const load = async () => { const load = async () => {
const baseURL = 'https://unpkg.com/@ffmpeg/core@0.12.1/dist/umd'
const ffmpeg = ffmpegRef.current; const ffmpeg = ffmpegRef.current;
// Listen to progress event instead of log. // Listen to progress event instead of log.
ffmpeg.on("progress", ({ progress }) => { ffmpeg.on("progress", ({ progress }) => {
messageRef.current.innerHTML = `${progress * 100} %`; messageRef.current.innerHTML = `${progress * 100} %`;
}); });
await ffmpeg.load(); // toBlobURL is used to bypass CORS issue, urls with the same
// domain can be used directly.
await ffmpeg.load({
coreURL: await toBlobURL(`${baseURL}/ffmpeg-core.js`),
wasmURL: await toBlobURL(`${baseURL}/ffmpeg-core.wasm`),
});
setLoaded(true); setLoaded(true);
} }

1
apps/website/netlify.toml
View File

@ -3,4 +3,3 @@
[headers.values] [headers.values]
Cross-Origin-Opener-Policy = "same-origin" Cross-Origin-Opener-Policy = "same-origin"
Cross-Origin-Embedder-Policy = "require-corp" Cross-Origin-Embedder-Policy = "require-corp"
Access-Control-Allow-Origin = "*"