cloudinary-react

Add the upload-widget script tag to index.html, then poll with setInterval in useEffect until window.cloudinary.createUploadWidget is a function before creating the widget. Store the widget in a ref, add a timeout for failed loads, and open it from a button click handler.

This error is a race condition: the widget script loads asynchronously. Poll with setInterval checking typeof window.cloudinary?.createUploadWidget === 'function' instead of a single onload check, and ensure the script tag exists in index.html.

Unsigned uploads use only a cloud name and unsigned preset, requiring no backend but allowing anyone with the preset name to upload. Signed uploads generate a signature on a server using the API secret, giving control over who can upload in production apps.

Yes, all patterns work across bundlers; only environment variable access changes. Create React App uses the REACT_APP_ prefix with process.env, Next.js client code uses NEXT_PUBLIC_, and Vite uses VITE_ with import.meta.env.

Vite may cache old environment values. Delete node_modules/.vite, restart the dev server, and hard refresh the browser. Also confirm the variable uses the VITE_ prefix and is read via import.meta.env, not process.env.

Use AdvancedVideo from @cloudinary/react to simply display a video with native controls. Use the Cloudinary Video Player package when you need a styled player UI, custom controls, or playlists, which requires an imperative video element created with document.createElement.