CODEWITHSUNDEEP
serverhtml5-videocross-domainplyr.js
Adam
Adam

Reputation: 1383

I'm getting an error message related to Access-Control-Allow-Origin

I'm working with a landing page that uses cdn plyr 

<script src="https://cdn.plyr.io/3.3.10/plyr.js"></script> 
    <script>const player = new Plyr('#player');</script>

I moved a video from local files to a server and changed the src="to new address form server", but the video stopped working and I'm getting this error:

page.html:1 Failed to load https://www.video.mp4: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://111.0.0.0:12121' is therefore not allowed access.

I tired different things, and even added another videos from other servers and it worked. except my video. The only thing that work is to add crossOrigin="anonymous" to the video tag and install Chrome extension But this wont work for other users, I need something permanent.

I also looked in to many answers:

How does Access-Control-Allow-Origin header work?

Videos not playing due to no Access Control Allow Origin

HTML5 video doesn't play with crossOrigin=“anonymous”

Please any ideas how to make this work?

Upvotes: 0

Views: 1095

Answers (2)

Stand__Sure
Stand__Sure

Reputation: 278

Try this for a reference on how to enable on your server W3C CORS Enabled

Upvotes: 0

Aliakbar sultani
Aliakbar sultani

Reputation: 38

This is a problem caused when you try to send request from a server that is different from the server you send request to. As in the comment was indicated, only the server you have uploaded your video to can control the header. But if it's your own server you can easily manipulate the code to allow request from different servers.

Upvotes: 0

Related Questions