问题
I'm working on a project which requires HTTPS, so I startup a HTTPS server with self-signed certificate. I also have an HTTP API Server with CORS enabled.
I'm able to fetch API request on Chrome. Here the header of preflight response(with HTTP status code 204):
Access-Control-Allow-Credentials: true
Access-Control-Allow-Headers: appversion,channel,content-type,language
Access-Control-Allow-Methods: GET,HEAD,PUT,PATCH,POST,DELETE
Access-Control-Allow-Origin: https://localhost:3001
Connection: keep-alive
Content-Length: 0
Date: Thu, 23 Aug 2018 04:04:45 GMT
Vary: Origin, Access-Control-Request-Headers
But I got error on Firefox.
If I stop my HTTPS server and run a HTTP server, my project works on Firefox. Is there anyway to fix this on my dev environment?
回答1:
The problem is that you are serving through HTTPS content that also comes from HTTP. In this case you will have mixed-content issues in very strict browsers like firefox.
The fix for this is making requests only throught HTTPS as pointed out in this article https://developer.mozilla.org/en-US/docs/Web/Security/Mixed_content/How_to_fix_website_with_mixed_content#How_to_fix_your_website
Chrome is working because usually is less error prone and actually "accepts" almost anything that you will give it to work with.
Keep in mind that this works in HTTP because there is no issue if you go from non secure to more secure, but if you go the other way the browser should complain!! And it's actually a good thing it does so. Otherwise the site shouldn't be so trusty
来源：https://stackoverflow.com/questions/51978207/cross-origin-request-and-mixed-content-only-on-firefox