Chrome MJPEG CORS "invalid response" when img.crossOrigin="Anonymous"

Question

Image from origin 'http://192.168.1.67:5555' has been blocked from loading by Cross-Origin Resource Sharing policy: Invalid response. Origin 'http://127.0.0.1:8000' is therefore not allowed access.

I need to allow cross origin for this MJPEG stream as the user must be able to capture the image with a button and without CORS the canvas is tainted.

I'm struggling with this issue in FF and Chrome (IE uses a different video source as it doesn't support MJPEG).

My server also returns the Access-Control-Allow-Origin: * when serving the page. The image src is being set in Javascript (if that could be related) after setting img.crossOrigin = "Anonymous";. If i remove the crossOrigin="Anonymous", the stream loads but i get the tainted canvas error.

Thanks edit: from wireshark, the MJPEG request:

GET /2d HTTP/1.1 Host: 192.168.1.67:5555 Connection: keep-alive Accept: image/webp,image/*,*/*;q=0.8 Origin: http://127.0.0.1:8000 User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/48.0.2564.109 Safari/537.36 Referer: http://127.0.0.1:8000/ Accept-Encoding: gzip, deflate, sdch Accept-Language: en-US,en;q=0.8,it;q=0.6,pt;q=0.4

HTTP/1.0 200 OK Access-Control-Allow-Origin: * Access-Control-Allow-Methods: GET Access-Control-Allow-Headers: Content-Type Content-Type: multipart/x-mixed-replace; boundary=--myboundary

Answer 1

run your chrome with this command chrome.exe --disable-web-security should get rid of the cross-origin problems

I have a chrome shortcut and this is the target for it:

"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --disable-web-security