how can I use iframe for videos not from youtube in angular 8?

Question

I am using the below code for youtube embed url and it working perfectly fine. But now I have an url which is from my sharepoint account. I want to play that but its not working. Please help me out.

 <iframe frameborder="0" scrolling="no" marginheight="0" marginwidth="0" type="text/html" webkitallowfullscreen
            mozallowfullscreen allowfullscreen width="600" height="400" [src]="url">
        </iframe>

previously the code for url was like stated below which was running fine and i was able to play my video

const safeURL = https://www.youtube.com/embed/${this.data?.videoID}?autoplay=0&fs=1&iv_load_policy=3&showinfo=0&rel=0&cc_load_policy=0&start=0&end=0;
this.url = this.safePipe.transform(safeURL, 'resourceUrl');

but now i want to change the url's value like this

this.url = 'https://abc-my.sharepoint.com/:v:/p/abc/EZD14y8daXNMpxefWdmVOj8BxpWcHM7RHRq6GyCb8Dv0Gw';

but now I am not able to play my video. Can you please help me out in playing non-youtube videos in my angular 8 application.

Answer 1

The <iframe> tag will not intelligently digest the content and output markup like your browser does when you navigate to the SharePoint's hosted video.

The Youtube embed URLs are not URLs to a video file - they have markup in them, which is why the player is different to your default browser's video player.

If you were to go to that SharePoint video in your browser and view the page's source, you'd see that some stuff gets added, but if you were to run wget https://thevideourl.com/myvideo.mp4 you would download only the video, not a html document containing a video tag which references the video.

Consider using a <video> tag with a src attribute. For example:

<!-- Instead of... -->
<iframe src="https://sharepoint.com/thevideourl"></iframe>


<!-- Do... ->
<video src="https://sharepoint.com/thevideourl"></video>

Now, the fact that it's in SharePoint raises questions as to whether or not your browser will be able to access the video at all given the above code. I am not sure if it would authenticate you properly.