0

I was writing a code to upload a video to the Stream API in BunnyCDN, but I get a CORS error

My Code:

const apiKey = 'API_KEY';
const libraryId = 'LIBRARY_ID';

const createVideoUrl = `https://video.bunnycdn.com/library/${libraryId}/videos`;

const fileInput = document.getElementById('file-input');

const title = document.getElementById('title');
const collectionId = document.getElementById('collection-id');

const createButton = document.getElementById('create-button');

let videoId;

createButton.addEventListener('click', async () => {
    console.log('Creating video...');

    const response = await fetch(createVideoUrl, {
        method: 'POST',
        headers: {
            accept: 'application/json',
            'Content-Type': 'application/*+json',
            AccessKey: apiKey
        },
        body: JSON.stringify({
            title: title.value,
            collectionId: collectionId.value,
        }),
        mode: 'cors' // I tried no-cors and without that value too. But nothing changes
    });

    const data = await response.json();
    videoId = data.guid;
    document.write('Video created with ID:', videoId);
});

My CORS settings: BunnyCDN Stream Panel Settings

Network Tab: Network Tab

My Console: Console Tab

Normally, this request should be sent and the id of the video should be returned.

Documentation: Create Video

Wraith
  • 82
  • 2
  • 7
  • Your title indicates a misunderstanding of CORS. CORS is a mechanism for lifting some of the Same-Origin Policy's restrictions. The absence, rather than the presence, of CORS is likely to cause issues if your server has cross-origin clients. You should familiarise yourself with CORS; start with https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS – jub0bs Jul 10 '23 at 10:11

0 Answers0