I am getting CORS error while getting video analytics

rao_rabi
rao_rabi Member Posts: 1
edited September 19 in Developer APIs

Here is my code;
const fetchVideoAnalytics = async (publicId) => { try { const response = await fetch( `https://api.cloudinary.com/v1_1/${cloudName}/video/analytics/views?expression=video_public_id=${publicId}`, { method: "GET", headers: { mode: "no-cors", Authorization: `Basic ${basicAuth}`, }, } ); const analyticsData = await response.json(); const { views, plays, unique_viewers, total_watch_time } = analyticsData;
setAnalyticsInfo({ views, plays, uniqueViewers: unique_viewers, watchTime: total_watch_time, });
// Simulating the chart data for now setChartData({ labels: ["Day 1", "Day 2", "Day 3"], datasets: [ { label: "Views", data: [50, 80, 100], borderColor: "rgba(75,192,192,1)", backgroundColor: "rgba(75,192,192,0.4)", }, ], }); } catch (error) { console.error("Error fetching video analytics:", error); } };

Tagged:

Answers

  • Tom
    Tom Member, Cloudinary Staff Posts: 103

    Hi @rao_rabi ,

    Thanks for reaching out.

    Video analytics API uses basic authentication so we do not support making request to it via client-side as this will expose your API credentials which is why you get the CORS error.

    You should make the request to this API via a backend server and then relay the response back to the client.

    Please let me know if you have any other questions or queries.

    Kind Regards,

    Thomas