29

I'm forcing https to access my website, but some of the contents must be loaded over http (for example video contents can not be over https), but the browsers block the request because of mixed-contents policy.

After hours of searching I found that I can use Content-Security-Policy but I have no idea how to allow mixed contents with it.

<meta http-equiv="Content-Security-Policy" content="????">
1
  • I have the same problem. I think it's not an issue to provide a way of enabling mixed content server side. The developer can then do checksums on the loaded data to figure out if the content hasn't been tampered with. Just like for example Debian packages are downloaded via HTTP and then checksumed, I don't understand why my CDN has to be HTTPS. The programmer (sometimes) knows what he's doing.
    – jg6
    Nov 22, 2020 at 12:16

3 Answers 3

30

You can't.

CSP is there to restrict content on your website, not to loosen browser restrictions.

Secure https sites given users certain guarantees and it's not really fair to then allow http content to be loaded over it (hence the mixed content warnings) and really not fair if you could hide these warnings without your users consent.

You can use CSP for a couple of things to aid a migration to https, for example:

  1. You can use it to automatically upgrade http request to https (though browser support isn't universal). This helps in case you missed changing a http link to https equivalent. However this assumes the resource can be loaded over https and sounds like you cannot load them over https so that's not an option.

  2. You can also use CSP to help you identify any http resources on you site you missed by reporting back a message to a service you can monitor to say a http resource was attempted to be loaded. This allows you identify and fix the http links to https so you don't have to depend on above automatic upgrade.

But neither is what you are really looking for.

2
  • can the security be loosened via the origin response header? I was looking into the meta tag as it sounded easier to add. Mar 9, 2017 at 19:07
  • No. It's only used to tighten security policy - not loosen it. As mentioned in my answer. Mar 9, 2017 at 19:21
15

You shouldn't... but you CAN, the feature is demonstrated here an HTTP PNG image converted on-the-fly to HTTPS.

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">

There's also a new permissions API, described here, that allows a Web server to check the user's permissions for features like geolocation, push, notification and Web MIDI.

7
  • I have added this in header section of master page but it wont help, is there any IIS Configuration that I supposed to do? coz I heard that chrome wont allow us to convert from HTTP file to HTTPS
    – PK-1825
    May 28, 2019 at 11:02
  • 5
    I don't think it will help in your case, this solution assumes that you already have a valid secured URL with 'https', then this tag will help the browser to automatically call those ulrs will 'https' instead of 'http' without your need to manually change it in your page code, while if you don't have that secured URL, I believe you can this method.
    – Green
    Nov 20, 2019 at 16:39
  • 2
    Huge -1, cuz upgrade-insecure-requests has nothing to do with allowing mixed content, it just changes request scheme to https, and that's what happening in the attached example, not "conversion on-the-fly to HTTPS"
    – lucifer63
    Dec 14, 2020 at 16:24
  • Irrelevant,OP wanted to know HOW to use the meta tag
    – nodws
    Dec 15, 2020 at 15:15
  • 1
    no, the question he asked was "How can I allow Mixed contents". that meta tag doesn't allow it.
    – stt
    Jul 1, 2021 at 14:12
1

Although you cannot allow mixed content in the browser, you may be able to wrap the endpoint in a local endpoint that's served over HTTPS. Thus, HTTP/HTTPS mixing occurs backend-to-backend, which is allowed and should be safe enough. The wrapper endpoint could look like this in PHP:

<?php
    $endp = !isset($_GET['endp']) ? '' : $_GET['endp'];
    if ($endp === 'doit') {
        header('Content-Type: application/json');
        echo file_get_contents('http://problematic-server/doit');
    } else {
        echo '{"err":"unsupported-endpoint"}';
    }
// Don't close php tag to avoid unwanted whitespace in response.

In your case with video content, it may not be possible, though.

1
  • This is a clever solution, but does mean increased traffic on your server, and if you don't control problematic-server then you open up a number of new potential attack surfaces. Just something to be aware of before using this solution Jun 21 at 17:17

Your Answer

Reminder: Answers generated by Artificial Intelligence tools are not allowed on Stack Overflow. Learn more

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.