Wie localstorage auf der gleichen Domain aber anderes Protokoll (http vs https)

Question

Ich brauche die localstorage auf https://example.com-http://example.com

Die Website läuft auf https teilen, zu teilen, aber es gibt einen bestimmten Pfad (/viewer), die sein muss http, so dass es andere Seiten in einen iframe einbetten kann (wenn es nicht wäre, würde der Browser gemischten Inhalt blockieren, da https keine http-Seiten auf einem iframe laden kann).

Wie kann ich auf die localStorage von https://example.com innerhalb http://example.com zugreifen?

Wenn es nicht möglich ist, gibt es Workarounds?

Answer 1

Es ist nicht in localStorage möglich.

Aber Sie können ein Cookie mit Javascript als https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie in beiden HTTP und HTTPS behandeln.

Answer 2

Browser betrachten zwei verschiedene Protokolle als unterschiedliche Domäne, so dass der lokale Speicher für beide Protokolle unterschiedlich ist. Wir können das mit post message api tun. Wenn wir Daten im lokalen Speicher setzen, nennen wir eine Funktion in unserem iFrame und leiten diese Daten als Nachricht weiter .

Verwenden Sie diesen Code in Ihre http Seite

var data = "Smith"; 
localStorage.setItem("lastname", data); 
let o = document.getElementsByTagName('iframe')[0]; 
o.contentWindow.postMessage({ 
    'func': 'set_data_function', 
    'message': data 
}, '*'); 

Jetzt müssen wir diese Daten in unserem https empfangen und diese Daten für unsere https auch in gleicher Weise einstellen können wir Daten aus dem lokalen Speicher beider Protokolle entfernen.

Und dieser Code in Ihrer https Seite, die Sie Iframe laden.

// this is the function which is we calling from our http 
window.set_data_function = function (data) { 
    console.log('called from parant'); 
    localStorage.setItem("lastname", data); 
} 

$(function() { 

    window.addEventListener('message', receiver, false); 
    (window).set_data_function = this.set_data_function.bind(this); 
    function receiver(e) { 
     // also we able to check the origin this will make our script secure 
     console.log(event.origin); 
     if (event.origin !== 'http://localhost:8081') { 
      return; 
     } 

     var data = event.data; 
     console.log(typeof (window[data.func])); 
     window[data.func].call(undefined, data.message); 
     if (typeof (window[data.func]) == 'function') { 
      window[data.func].call(undefined, data.message); 
     } 
    } 

}); 

hoffen, dass es Ihnen viel Glück muss