I have a video element of an mp4 video in my astro site that loads and displays just fine when i run the dev server. However once i deploy the site using cloud build to a cloud run instance and go to the website the video is no longer loading/displaying. Does anyone know why this might be?
#Video not loading on cloud run
tired scroll
pastel matrixBOT
drifting cedar
Do you have any code you can share?
tired scroll
Sure
One sec
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="/New Project (2).png" />
<title>testing</title>
</head>
<body>
<p>Testing</p>
<video id="myVideo" muted autoplay loop>
<source src="/White Flower.mp4" type = "video/mp4">
</video>
<style>
#myVideo {
position: fixed;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
z-index: -1;
object-fit: cover;
}
</style>
</body>
</html>
i have this in /src/pages
the video is in my public folder along with the new project (2).png
drifting cedar
I think this may be happening because you have spaces in the file names, you can try renaming the files so they don't have spaces or try replacing the spaces in your paths (src and href) with %20
tired scroll
ill try that, thank you
the image loads fine in both the cloud run instance and the dev server its only the video though
drifting cedar
Are you getting any console errors?
tired scroll
none
google cloud build says it builds alright
tried the spaces and got the same results unfortunatly
im doing cloud build from a github repo if that makes a difference
the videos are with git lfs
drifting cedar
Ah ya that may be what is causing the problem, I don't have a lot of experience with git lfs but AFAIK it stores a reference to the video file in your repo not the actual video file