jeromeetienne / AR.js

Efficient Augmented Reality for the Web - 60fps on mobile!
MIT License
15.79k stars 2.22k forks source link

Playing videos from external server #383

Closed curtisboylan closed 5 years ago

curtisboylan commented 6 years ago

Do you want to request a feature or report a bug? bug

What is the current behavior? I am trying to play a video from an external server, I am getting the following error in the screenshot attached. I don't believe this is a CORs issue as I have tried at-least 100 servers along with with dropbox too.

screen shot 2018-07-19 at 13 50 16

If the current behavior is a bug, please provide the steps to reproduce.

<a-scene embedded arjs='sourceType: webcam; detectionMode: mono; trackingMethod: best; debugUIEnabled: false;'>
<a-assets>
 <video crossorigin="anonymous" id="BS0i6" autoplay loop="true" type="video/mp4" src="https://www.dropbox.com/s/9jaqjmijovrixe9/video.mp4?dl=0">
<!-- add video here -->     
</a-assets> 
<a-marker preset="custom" type="pattern" url="generatedmarkers/BS0i6.patt"><a-video src="#BS0i6" width="1.4375" height="1" rotation="270 0 0"></a-video></a-marker>
<!-- add marker here -->
<a-entity camera></a-entity>

What is the expected behavior?

I would like for this to load the video and have it playable, instead it loads a white screen.

Please mention other relevant information such as the browser version, Operating System and Device Name

Using Mac on Chrome but happens across all devices.

jwebking commented 6 years ago

Hi @curtisboylan

Try capitalizing the O in origin so it is crossOrigin="anonymous" and see if that works. If not, it might be related to the new video requirements in browsers to load videos muted. You would just add muted between autoplay and loop='true'

autoplay muted loop='true'

anilachary commented 6 years ago

You need to implement CORS. Go through this https://github.com/jeromeetienne/AR.js/issues/380#issuecomment-414053652