In my site settings on Cloudflare, SSL in the Crypto tab is on Full, SSL certificates are in place (Universal), and Automatic HTTPS Rewrites is ON. I also made a Page Rule to always use www.
Installing a TLS certificate in Cloudflare is not possible, as I'm on the free dyno from Heroku, where I'm not allowed to point to these.
In my heroku-apache.conf, I added a rewrite rule to enforce https
Still, jQuery tries to do the POST request over http, logically resulting in a cross origins bug..
Cloudflare should act transparently when it comes to SSL, expect in a few use-cases:
You are using Flexible SSL, in Flexible SSL will result in requests between Cloudflare and your origin server being unencrypted
Your server is redirecting away from HTTPS to the HTTP site, hence you aren't hitting the HTTPS version of your site
If you're using Flexible SSL
The quickest way to fix this is simply to set Cloudflare's SSL setting to Full mode, then ensure you have a Page Rule set-up to enforce SSL. See Configure CloudFlare and Heroku over HTTPS for details.
If Flexible SSL isn't the issue
Chances are that your web server is redirecting away from the HTTPS version of your site to the HTTP version. This could be as simple as the web server trying to add a missing "/" to the end of the URL, causing it to momentarily redirect to the non-HTTPS version of your site. Ensure all application side redirects (.htaccess, Apache config, PHP routing files) all ensure your site redirects to the HTTPS version.
If you're struggling to find out what's the case, try cURLing the HTTPS version of your endpoint and check if you get a 301 or 302 response back.
I fixed my initial problem. My routes file (web.php) was not well configured to handle the ajax request, after adding a language prefix to all routes. So the POST request was well sent, but as the route URL didn't exist it any longer, it somehow then tries to do a GET request to the same URL without https.
