I am currently working on a shopify embedded app that uses python flask and the shopifyapi library in the backend. The app is working fine and is visible in any browser except (macos and ios) safari.
The error I recieve when using safari is the following:
Blocked mixed content
http://app-domain.com/shopify?hmac=xxx..&protocol=https://&shop=shopify-store-name because 'block-all-mixed-content' appears in the Content Security Policy
Somehow safari tries to load something via http when visiting the app in shopify admin, however when using google chrome, firefox etc. this is not the case and everything works fine. Shopify embedded apps load the app content in an iframe, where it is displayed embedded in the shopify admin page.
When I look at the iframe src value within the chrome/firefox debugger I can see that it is correctly pointing to:
https://app-domain.com/shopify?hmac=xxx..&protocol=https://&shop=hopify-store-name
The app redirects and adresses set in the shopify partner settings are also all using https.
What I already tried without success is:
- Using SSLify in the backend to redirect any requests to https
- Enabling CORS
I am using:
- Python 3.6.6
- Flask 1.0.2
- ShopifyAPI 3.1.0
- Werkzeug 0.14.1
As I only recieve the error when using safari I have no clue what might be the problem and hope that somebody can help me with this.
Best regards Dominik
