How to embed Youtube Video in ASP.NET Core 6 - asp.net-core

<iframe width="560" height="315"
src="https://www.youtube.com/embed/5LJgSQbZ9o4"
title="YouTube video player"
frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen>
</iframe>
This tag doesn't display on my page for some reason:
It says content is blocked. Contact the site owner to fix the issue.

I tried your codes and it works well in my case:
Have you blocked the video with your own chrome settings?check the settings or try with other browser.

Related

Buffering video

Stack:
"#ionic/vue": "^6.0.0",
"vue": "^3.2.21",
"#capacitor/cli": "3.3.4",
PROBLEM:
IOS: the video is not buffered. the user has to wait until the entire video is downloaded before playing it. the video is saved in vimeo platform.
ANDROID: this problem does not exist here
CODE:
<video controls>
<source src="https://player.vimeo.com/progressive_redirect/playback/111/rendition/1080p/file.mp4" type="video/mp4">
</video>
expected solution:
I would need to buffer this video. to start immediately after opening and loading the video part
Thanks for help.
you can use this:
<iframe src="https://player.vimeo.com/video/731378604?h=555b720291" width="640"
height="360" frameborder="0" allow="autoplay; fullscreen; picture-in-picture"
allowfullscreen></iframe>
<p><a href="https://vimeo.com/731378604">ADIDAS FT. RICK & MORTY - X
SPEEDPORTAL</a> from <a href="https://vimeo.com/user30235767">Elise
Hagedoorn</a> on Vimeo.</p>

jQuery.Lazy Vimeo Issues

I'm using jQuery.Lazy to make images load a little smoother on my website. It works like a charm on images, but I'm having some trouble with embedded Vimeo videos.
I have the full packaged jquery.lazy.min.js uploaded and I call it using the following scripts:
$('.lazy').lazy({
effect: "fadeIn",
effectTime: 300,
threshold: 0
});
$("iframe").lazy({
effect: "fadeIn",
effectTime: 300,
threshold: 0
});
All images with a class of .lazy and the data-src tag load perfectly. But when I try to embed Vimeo using the example from their GitHub document notes nothing happens.
Here's the code they show as an example:
<iframe data-loader="vimeo" data-src="176894130" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
And this is what I'm embeding on my site:
<iframe class="lazy" data-loader="vimeo" data-src="254984504" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

playing .swf file with videojs

I am trying to play .swf file using Videojs but getting message that media could not be loaded either the server or network failed or because the format is not supported. Here is my code:
<link href="/html/js/video/videojs/video-js-5.17.0/video-js.css" rel="stylesheet">
<script type="text/javascript" src="/html/js/video/videojs/video-js-5.17.0/video.min.js"></script>
<script>videojs.options.flash.swf = "/html/js/vendor/video-js-swf-5.3.0/dist/video-js.swf"</script>
<div style="display:block; margin-top: [[margin_top]]px; color: #fff; border:none;">
<video id="vidojs-player-swf"
class="video-js vjs-default-skin vjs-big-play-centered"
controls
preload="auto"
width="[[width]]"
height="[[height]]"
data-setup="{}">
<source src="/path/to/swf/file" type="video/x-flv"></source>
<p class="vjs-no-js">
To view this video please enable JavaScript, and consider upgrading to a
web browser that
<a href="http://videojs.com/html5-video-support/" target="_blank">
supports HTML5 video
</a>
</p>
</video>
</div>

Using Flow Player with ASP.NET MVC 4, "html5: Video file not found"

Here is some code from the view:
<div class="flowplayer">
<video>
<source type="video/mp4" src="~/Content/Videos/HowItWorksRegistration1.mp4">
</video>
</div>
I get the error: "html5: Video file not found"
But if I link to a web url for a random .mp4 video, it works. Also, earlier in the view, I have images with the same relative path and that works. I've double checked the path and even tried to put the video in the same directory (with updated path), and that did not work.
Any help appreciated.
The first thing to check is can you browse to the video url and play it in the browser.
If you get a 404 it's because the path is wrong.
If it does not play it is because the browser does not support that video.
HTML5 wiki shows what video formats what browsers support.
Some Chrome versions have issues with playing MP4 content. Workaround: List a WEBM before the MP4 source and/or set preload="none" as video tag attribute.
you should add :
<link href="~/Scripts/Video2/flowplayer-5.4.6/skin/minimalist.css" rel="stylesheet" />
<link href="~/Scripts/Video2/x/demo.css" rel="stylesheet" />
<link href="~/Scripts/Video2/x/pygments.css" rel="stylesheet" />
<link href="~/Scripts/Video2/x/playlist.css" rel="stylesheet" />
<script src="~/Scripts/jquery-1.7.1.js"></script>
<script src="~/Scripts/Video/jquery.min.js"></script>
<script src="~/Scripts/Video2/flowplayer-5.4.6/flowplayer.min.js"></script>
Then you should use this :
<div class="flowplayer" style="width: 450px; height: 260px" data-ratio="0.416" data-swf="//releases.flowplayer.org/5.4.6/flowplayer.swf">
<video style="width: 450px; height: 260px" src="~/Content/Videos/HowItWorksRegistration1.mp4"></video>
</div>

html5 video canceled

I'm trying to embed a video on my website:
<video width="320" height="240" controls="controls">
<source src="new-slideshow.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
For some reason, the video is not loading, and I can see this information when I inspect the network request:
https://dl.dropbox.com/u/2241201/locker/Screen%20Shot%202012-11-14%20at%201.49.39%20PM.png
Why is the video being canceled?