tumblr/tumblr.js

Is it possible to post a video that is not hosted using its DATA URL?

Bovine4826 opened this issue · 1 comments

I have a Next.js app with the goal of crossposting from Reddit to Tumblr. The major issue I encounter is that some gifs are over the file size limit so I sought to use FFMPEG WASM to run the conversion on the client to go from gif to mp4.

Some relevant code I have.

// run the conversion
await ffmpeg.writeFile(
    "bbx96pfdfsjc1.gif",
    await fetchFile("https://i.redd.it/bbx96pfdfsjc1.gif")
);
await ffmpeg.exec(["-i", "bbx96pfdfsjc1.gif", "video.mp4"]);

const data = await ffmpeg.readFile("video.mp4");
const {buffer} = new Uint8Array(data);

const b64 = Buffer.from(buffer).toString("base64");
const b64Url = `data:video/mp4;base64,${b64}`;

console.log(b64Url); // works fine

// throws 401
await client.createPost(blog, {
    content: [{
        type: 'video',
        url: b64Url
    }]
});

// creates the post but with no video
await client.createLegacyPost(blog, {
    type: "video",
    data: b64Url,
    embed: b64,
});

Any pointers on how I can deal with this?

What you're trying to do should be possible by using a readable stream as the media. There's an integration test for video you might follow as an example:

await client.createPost(blogName, {
content: [
...postContent,
{
type: 'image',
media: createReadStream(new URL('../test/fixtures/image.jpg', import.meta.url)),
caption: 'Arches National Park',
alt_text: 'A mountain landsacpe',
attribution: {
type: 'link',
url: 'https://openverse.org/image/38b9b781-390f-4fc4-929d-0ecb4a2985e3',
},
},
{
type: 'video',
media: createReadStream(new URL('../test/fixtures/video.mp4', import.meta.url)),
width: 92,
height: 69,
title:
'Phosphatidylinositol (4,5) Bisphosphate Controls T Cell Activation by Regulating T Cell Rigidity and Organization',
attribution: {
type: 'link',
url: 'https://commons.wikimedia.org/wiki/File:Phosphatidylinositol-(45)-Bisphosphate-Controls-T-Cell-Activation-by-Regulating-T-Cell-Rigidity-and-pone.0027227.s020.ogv',
},
},
],
tags: [
'tumblr.js-test',
`tumblr.js-version-${client.version}`,
'test-npf',
'test-npf-media-upload',
],
}),