When the local video is played in html5 video tag.It throws warning as unsafe URL and video content is not playing.

sanitizing the URL withdomSanitizer.bypassSecurityTrustResourceUrl(url)in angular still has the same issue

Added the stackblitz ponent.ts

Please help me out..

When the local video is played in html5 video tag.It throws warning as unsafe URL and video content is not playing.

sanitizing the URL withdomSanitizer.bypassSecurityTrustResourceUrl(url)in angular still has the same issue

Added the stackblitz https://stackblitz./edit/angular-uodypm?file=app%2Fapp.ponent.ts

Please help me out..

• javascript
• angular

Share Improve this question Follow edited Apr 25, 2018 at 7:44 Vikas 12k77 gold badges4848 silver badges7171 bronze badges asked Apr 25, 2018 at 7:11 Harish98Harish98 48533 gold badges77 silver badges1818 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 6

use binding in video source element

<video *ngIf="playerSrc" width="100%" autoplay="autoplay" controls style="margin-top: 50px; margin-bottom: 20px;">
  <source [src]="playerSrc" type="video/mp4">
    </video>

stackblitz https://stackblitz./edit/angular-h5zawg?file=app/app.ponent.html

I have also faced similar kind of issue for video and here's a way how I resolved it. You can set SRC in HTML like mentioned below to resolve unsafe data issue for image/video.

<video *ngIf="playerSrc" width="100%" autoplay="autoplay" controls 
   style="margin-top: 50px; margin-bottom: 20px;">
   <source [src]="sanitizer.bypassSecurityTrustResourceUrl(src)" type="video/mp4">
</video>

Bind src like this: [src]="sanitizer.bypassSecurityTrustResourceUrl(src)"