crossOrigin error (but no issues with mat-video)

[born2net]

so I am getting an error of:

Access to video at 'https://oregon-xxxx-resources.s3-us-west-2.amazonaws.com/business391067/resources/492.mp4' from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

via

<video [vgMedia]="media"  [crossOrigin]="'anonymous'" #media  id="singleVideo" preload="auto" crossorigin>
                        <source src="{{m_playResource}}" type="video/mp4">
                    </video>

even though I have setup

 [crossOrigin]="'anonymous'" 

and I know it is possible to play videos off this link in HTML5 as the angular lib of:

<mat-video #video src="{{m_playResource}}" [autoplay]="false"></mat-video>-->

does work (but I want to switch over to this lib

any ideas?

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/

Angular CLI: 10.0.5
Node: 10.15.0
OS: win32 x64

Angular: 10.0.8
... animations, common, compiler, compiler-cli, core, forms
... language-service, localize, platform-browser
... platform-browser-dynamic, platform-server, router
... service-worker
Ivy Workspace: Yes

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.1000.5
@angular-devkit/build-angular      0.1000.5
@angular-devkit/build-optimizer    0.1000.5
@angular-devkit/build-webpack      0.1000.5
@angular-devkit/core               8.3.29
@angular-devkit/schematics         8.3.29
@angular/cdk                       10.1.2
@angular/cli                       10.0.5
@angular/flex-layout               10.0.0-beta.32
@angular/google-maps               9.2.4
@angular/http                      7.2.16
@angular/material                  10.1.2
@angular/material-moment-adapter   10.1.2
@angular/pwa                       0.803.29
@ngtools/webpack                   10.0.5
@schematics/angular                8.3.29
@schematics/update                 0.1000.5
rxjs                               6.6.2
typescript                         3.9.7
webpack                            4.43.0

regards

Sean

[born2net]

Thank you @Elecash

I got it working (at last!). I had to remove the crossorigin attribute from the video tag - like this:

<video vgMedia #media id="singleVideo" preload="auto">
    <source *ngFor="let video of sources" [src]="video.src" [type]="video.type">

I assumed that the crossorigin attribute would be needed because the video is not hosted on the same server/domain as the angular app. Should the server send specific CORS headers when I set this?

Thanks again!