I am trying to use my aws to host some videos for my site but when I paste the link in the video component it wont let me. Is there a trick to doing this?
If not what else is out there for a more professional way to show videos? You tube looks bad imo. I did this no problem with cargo collective so figured this cant be too hard.
I also would like to have the video looping on my site if possible, is there a way to do this besides the background video, I am not sure that will work for what i have in mind. I have maybe 3 or 4 different size videos that I want to showcase on my portfolio site looping over and over. 2 have audio, so that i know wont work.
Depends on what you want to do. You would have to be very specific. Look at the API above to figure out what you are trying to accomplish. You can search in the topics here and find many examples.
So basically I just want to host videos that are screen grabs of my prototypes or websites ive designed. I spent a lot of time making nice movies and I dont want any screen overlays from youtube or vimeo etc. Id like the ability to just have the video autoplay and loop when the page loads for some, some just want to trigger to play when the user wants to. I did this easily with a bit of code with cargo collective, is it as simple as that? I think the loop and auto play and volume on mute or not are just html tags? Also having the video size is important as all my videos are a bit different ratios. Let me know thoughts, thanks!
The variables used were to add a poster image and to complete the video url.
In a way, it replicates what Webflow do but it’s not as slick as drag and drop.
Hey hey, I am working on a project for a client that I used the exact same method (Cloudfront>s3) embedded within a video tag in CMS. It works great in the front-end.
My concerns are the performance and cost for implementing a solution like this, do you find that there are significant data transfer charges when the CMS requests the S3 object?
I also used a JS to add an event listener such that my videos will play when it is hovered
<script>
let portList= document.querySelectorAll(".port-video")
portList.forEach(function(hover){hover.addEventListener("mouseover",function(){this.firstElementChild.play();})})
portList.forEach(function(hover){hover.addEventListener("mouseleave",function(){this.firstElementChild.load();})})
</script>```
*my embed has a class name "port-video"
The problem for me now:
When I loaded the page, there seems to be more than 1 request per video to the CDN when I observed my network tab on my chrome developer console
Whenever I hover over the video it seems to additionally send a request for the resource so there yet again significant transfers from my CDN.
I am still waiting to see if my billing will be affected. My video snippets are only <30mb each so i expected to fully run this without any AWS charges as it should still be within the free Tier, but I am worried about this now because in my CDN the data transfers seem significant
Did you come across any issues or were you able to mitigate this? Thank god I was able to find someone who had implemented the same method
