Skip to content

Commit

Permalink
Fix type errors in Vite example app (#555)
Browse files Browse the repository at this point in the history
* fix type errors in Vite example app

* replace semicolons
  • Loading branch information
zhougsoft authored Aug 20, 2023
1 parent d9710f7 commit 3b63973
Showing 1 changed file with 10 additions and 7 deletions.
17 changes: 10 additions & 7 deletions apps/react-vite-app/src/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,14 +5,14 @@ import { toBlobURL, fetchFile } from "@ffmpeg/util";
function App() {
const [loaded, setLoaded] = useState(false);
const ffmpegRef = useRef(new FFmpeg());
const videoRef = useRef(null);
const messageRef = useRef(null);
const videoRef = useRef<HTMLVideoElement | null>(null)
const messageRef = useRef<HTMLParagraphElement | null>(null)

const load = async () => {
const baseURL = "https://unpkg.com/@ffmpeg/[email protected]/dist/esm";
const ffmpeg = ffmpegRef.current;
ffmpeg.on("log", ({ message }) => {
messageRef.current.innerHTML = message;
if (messageRef.current) messageRef.current.innerHTML = message;
});
// toBlobURL is used to bypass CORS issue, urls with the same
// domain can be used directly.
Expand All @@ -35,10 +35,13 @@ function App() {
const ffmpeg = ffmpegRef.current;
await ffmpeg.writeFile("input.avi", await fetchFile(videoURL));
await ffmpeg.exec(["-i", "input.avi", "output.mp4"]);
const data = await ffmpeg.readFile("output.mp4");
videoRef.current.src = URL.createObjectURL(
new Blob([data.buffer], { type: "video/mp4" })
);
const fileData = await ffmpeg.readFile('output.mp4');
const data = new Uint8Array(fileData as ArrayBuffer);
if (videoRef.current) {
videoRef.current.src = URL.createObjectURL(
new Blob([data.buffer], { type: 'video/mp4' })
)
}
};

return loaded ? (
Expand Down

0 comments on commit 3b63973

Please sign in to comment.