HTML video missing in Staging (webflow.io), but visible in Designer / Preview?!

Design help Custom code
#1

Hi there

I previously had an video embedded on the site to auto play on Desktop and Tablet. Did this through using HTML component:

  1. Adding a Background Video component, then use the s3.amazon link that WebFlow generated for my HTML code.
  2. Hide the Background Video
  3. HTML component code
<video autoplay loop muted style="max-width: 100%; max-height: 100%; display: block; overflow: hidden; border-radius: 1px;"> 
  <source src="https://s3.amazonaws.com/webflow-prod-assets/5c182f30d07234bb8d958aa5/5d34253f6b1d5c5b531f3f94_Inviited%20Create%20Meeting%20Demo%20-%20with%20Music%20-%20540p.mp4" type="video/mp4">
</video>

The hidden background video:
image

This worked fine till I uploaded a new video to replace the old today (i.e. and generated a new Webflow / S3.Amazon URL). Now it:

I’m not sure if it’ll be resolved if we publish to Production site. So thought best to fix it before I publish.

On Designer & Preview:

image
image.jpg1324×806 155 KB

On Staging site:

image
image.jpg1106×384 68 KB

Read Only Site

Any idea why this is?

Thanks!
Johnathan

#2

The video not working (chrome).

https://s3.amazonaws.com/webflow-prod-assets/5c182f30d07234bb8d958aa5/5d34253f6b1d5c5b531f3f94_Inviited%20Create%20Meeting%20Demo%20-%20with%20Music%20-%20540p.mp4

image
image.png1920×625 15.1 KB 

Failed to load resource: the server responded with a status of 403 (Forbidden)

Maybe upload the video again and/or check the permissions for this file.

This is not related to webflow. Maybe the answer her:

https://aws.amazon.com/premiumsupport/knowledge-center/s3-website-cloudfront-error-403/

#3

Hi @Siton_Systems (Ezra), it does seem to be the video.
In one of my old Webflow backups, I had this link:

which works.

I wonder if Webflow has shifted the storage from uploads-ssl.webflow.com to Amazon S3 since then.

Any video I upload as Background video goes to S3.Amazon and fails to play.

I switched over to Dropbox for the video which has solved the issue.

Anyone reading this, you’ll need to replace dropbox.com with dl.dropboxusercontent.com in your url

Thanks!

1 Like