Skip to main content
Language:

Deserialization

VideoEditor SDK for React Native supports serialization and deserialization, allowing your users to save and revise their work at any time.

Loading a serialization#

To restore a previously saved state, we first need to retrieve the serialization. For this example, we have a local serialization file that should be used.

To open the editor with the selected serialization, you need to pass it to the VESDK.openEditor method as the serialization parameter.

File:
import { VESDK } from "react-native-videoeditorsdk";
export const videoDeserializationExample = async (): Promise<void> => {
// Add a video from the assets directory.
const video = require("../../../../assets/vesdk/Skater.mp4");
// Load the serialized settings from the app bundle. You could also load this from a remote URL for example.
const serialization = require("../../../../assets/vesdk/video_serialization.json");
try {
// Open the video editor and handle the export as well as any occuring errors.
// Pass the serialization to the editor as well.
const result = await VESDK.openEditor(video, undefined, serialization);
if (result != null) {
// The user exported a new video successfully and the newly generated video is located at `result.video`.
console.log(result?.video);
} else {
// The user tapped on the cancel button within the editor.
return;
}
} catch (error) {
// There was an error generating the video.
console.log(error);
}
};