When I was testing this out in development mode it was working fine but for some reason it doesn't work in production? I have searched online and cant find a solution, Any help would be greatly appreciated

[example url](https://api-six-jet.vercel.app/video/hPB_l7MVbpg)

Code:

// page.tsx (Server Component)

import { getVideo } from "@/lib/actions";
import VideoPlayer from "@/lib/vp";
import { Suspense } from "react";
import 'ldrs/lineWobble';

interface HomeProps {
  params: { id: string };
}

const Home = async ({ params }: HomeProps) => {
  const { id } = params;
  const videoData = await getVideo(id);

  return (
    <div className="flex w-screen h-screen justify-center items-center">
      <Suspense fallback={<div className="container">Loading ...</div>}>
        <VideoPlayer videoBase64={videoData.toString("base64")} />
      </Suspense>
    </div>
  );
};

export default Home;

// videoPlayer.tsx (client component)
"use client";

import React, { useEffect, useRef, useState } from "react";

interface VideoPlayerProps {
  videoBase64: string; // Base64 encoded video buffer
}

const VideoPlayer: React.FC<VideoPlayerProps> = ({ videoBase64 }) => {
  const videoRef = useRef<HTMLVideoElement>(null);
  const [loading, setLoading] = useState(true);

  useEffect(() => {
    const base64ToBlob = (base64: string, mimeType: string): Blob => {
      const byteCharacters = atob(base64);
      const byteArrays = [];

      for (let offset = 0; offset < byteCharacters.length; offset += 512) {
        const slice = byteCharacters.slice(offset, offset + 512);
        const byteNumbers = new Array(slice.length);

        for (let i = 0; i < slice.length; i++) {
          byteNumbers[i] = slice.charCodeAt(i);
        }

        const byteArray = new Uint8Array(byteNumbers);
        byteArrays.push(byteArray);
      }

      return new Blob(byteArrays, { type: mimeType });
    };

    try {
      const videoBlob = base64ToBlob(videoBase64, "video/mp4");
      const videoUrl = URL.createObjectURL(videoBlob);

      if (videoRef.current) {
        videoRef.current.src = videoUrl;
        // Set loading to false once the video data is loaded
        videoRef.current.onloadeddata = () => {
          setLoading(false);
        };
      }

      return () => {
        if (videoRef.current) {
          videoRef.current.onloadeddata = null;
        }
        URL.revokeObjectURL(videoUrl);
      };
    } catch (error) {
      console.error("Error converting base64 to Blob:", error);
    }
  }, [videoBase64]);

  return (
    <div>
      {loading && <div className="container"></div>}
      <video
        ref={videoRef}
        controls
        style={{ display: loading ? 'none' : 'block' }}
      />
    </div>
  );
};

export default VideoPlayer;