search

yanwsh / videojs-panorama

a plugin for videojs run a full 360 degree panorama video.
http://yanwsh.github.io/videojs-panorama/
Other
492 stars 160 forks source link

Safari (Mac + iOS): SecurityError (DOM Exception 18): The operation is insecure. #79

Open kuehn-sba opened 7 years ago

kuehn-sba commented 7 years ago

SecurityError (DOM Exception 18): The operation is insecure. texImage2D texImage2D — three.js:30938 uploadTexture — three.js:27361 setTexture — three.js:27397 loadUniform — three.js:26917 loadUniformsGeneric — three.js:26990 setProgram — three.js:26275 renderBufferDirect — three.js:25138 renderObjects — three.js:25822 render — three.js:25606 render — Canvas.js:150 animate — BaseCanvas.js:216

I've already added the crossorigin tag to the video: Crossorigin = "anonymous"

So ... the video plays, but only black and I always get this error.

The demo is working fine for safari on mac/ios: https://yanwsh.github.io/videojs-panorama/ what's the secret behind?

yanwsh commented 7 years ago

This is because you are trying to use an external video source, which causes cross domain issue, you have to consider to use proxy to solve this issue.

Samuel-Ayvazyan commented 6 years ago

Thanks @yanwsh , your advice helped to go deeper in proxy direction.

I found some good option for the proxy to solve CORS issue: https://www.npmjs.com/package/cors-anywhere

So, instead of using this in "src" of the video tag http://static.videogular.com/assets/videos/videogular.mp4 you can use this: https://cors-anywhere.herokuapp.com/http://static.videogular.com/assets/videos/videogular.mp4 (Don't try to open this link in a browser, it will not work, but it will work in src of video tag) This above link in src of video will work on Safari(Desktop/Mobile).

Also, you can create your own node server with "cors-anywhere" package linked above and host it.