• Register
0 votes
1.8k views

Problem :

I am facing following error message:

DOMException: Failed to load because no supported source was found in video.play(); line.

I have started getting this issue only after adding following code:

video.setAttribute('crossorigin', 'anonymous');

I am trying to develop an app in the mobile so for the cross origin I must add this line. Also note that I am getting this issue only after the updating my chrome to 50 version before that it was working fine.

<!DOCTYPE html>

    <html>

    <head>

       <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

    </head>

    <body> 

    <script>    

     var video = document.createElement( 'video' );

     video.id = 'video';   

     video.type = ' video/mp4; codecs="theora, vorbis" ';  

     video.src = "http://abcde.com/img/videos/what_is_design_thinking.mp4";

     video.volume = .1;

     video.setAttribute('crossorigin', 'anonymous');   

     video.load(); // must call after setting/changing source  

     $('body').html(video);

     video.play(); 

     var canvas = document.createElement('canvas');

     var ctx = canvas.getContext('2d');

     $('body').append(canvas);

     video.addEventListener('play', function() {

       var $this = this; //cache

       (function loop() {

       if (!$this.paused && !$this.ended) {

       ctx.drawImage($this, 0, 0);

       setTimeout(loop, 1000 / 30); // drawing at 30fps

       }

       })();

      }, 0);

    </script>

    </body>

    </html>

6 5 3
7,540 points

Please log in or register to answer this question.

1 Answer

0 votes

Solution :

I had the same error in the recent past and it turned out to be a CORS issue.

So instead of below code:

video.setAttribute('crossorigin', 'anonymous'); 

Try the below correct code:

video.crossOrigin = 'anonymous';

And also please make sure that the server response must have the header as Access-Control-Allow-Origin:*. Instead of the asterisk wild card, you can specify the domain of the website that is allowed to access your video from the server.

9 7 4
38,600 points

Related questions

0 votes
1 answer 2.4K views
2.4K views
Problem : I am trying to execute bootstrap jquery code but getting below error uncaught error: bootstrap's javascript requires jquery at bootstrap.min.js:6
asked Oct 22, 2019 peterlaw 6.9k points
1 vote
1 answer 522 views
522 views
Problem : Trying to drag and drop an image on a div. but the image does not get dragged on to the div and gives the following error: uncaught typeerror: failed to execute 'appendchild' on 'node': parameter 1 is not of type 'node'.
asked Nov 11, 2019 peterlaw 6.9k points
0 votes
1 answer 379 views
379 views
Problem : I am unable to solve my link problem. Can anybody help on to this to link the CSS and JS File? I am facing below error : Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:8080/RetailSmart/jsp/ ... .js Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:8080/RetailSmart/jsp/Jquery/prettify.js
asked Jan 10, 2020 alecxe 7.5k points
0 votes
2 answers 29 views
29 views
Problem I am a bit confused what is a right way to link/include JavaScript file in HTML ? And hoe to do it right ?
asked Oct 17, 2020 alexh 2.2k points
1 vote
1 answer 84 views
84 views
How do I modify the URL without reloading the page?
asked Sep 28, 2020 Xaimax 9.5k points
0 votes
0 answers 23 views
0 votes
1 answer 131 views
131 views
Problem : I have the javascript application and when I try to run it on firefox I am facing the below error on the console: &ldquo;Because its mime type ('text/html') is not a supported stylesheet mime type&rdquo; Now I am completely confused because of this error. Kindly somebody let me know how can I resolve my above error?
asked Jan 29, 2020 jwilliam 3.9k points
0 votes
1 answer 14 views
14 views
Problem: I don&rsquo;t know how to open web browser in python, instead of research it would be great if someone could help me out. Thanks in advance.
asked Dec 25, 2020 sasha 5.3k points
0 votes
1 answer 7 views
7 views
I have a spreadsheet of database. In my database i need to include row in html table dynamically using jquery.
asked Oct 3, 2020 Daniel Anderson 4k points
0 votes
1 answer 9 views
9 views
I am finding the difficulty creating row value in html table using jquery. Can someone give me the correct script that should i execute to solve this issue?
asked Sep 14, 2020 Daniel Anderson 4k points