Как совместно использовать localStorage в одном домене, но с другим протоколом (http против https)

Question

Как совместно использовать localStorage в одном домене, но с другим протоколом (http против https)

1

Мне нужно поделиться локальным хранилищем на https://example.com по https://example.com http://example.com

Сайт работает на https, но есть конкретный путь (/viewer), который должен быть http, чтобы он мог встраивать другие сайты в iframe (если бы не браузер блокировал смешанный контент, поскольку https не мог загружать страницы http на iframe).

Как я могу получить доступ к localStorage https://example.com в http://example.com?

Если это невозможно, есть ли какие-нибудь обходные пути?

pedropeixoto 10 нояб. 2017, в 10:53

Источник

0

Политика заключается в том, что протокол должен совпадать. Одним из решений было бы хранить данные на вашем сервере и извлекать их при необходимости.
Derek 朕會功夫 10 нояб. 2017, в 09:46

Теги:

javascript

html5

iframe

local-storage

2 ответа

Ещё вопросы

Политика заключается в том, что протокол должен совпадать. Одним из решений было бы хранить данные на вашем сервере и извлекать их при необходимости.

sapics · Answer 1 · 2017-11-10T07-59-00.000Z

Это невозможно в localStorage.

Но вы можете обрабатывать cookie с javascript как https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie как в http, так и в https.

Yaseen Ahmad · Answer 2 · 2017-11-10T08-47-00.000Z

Браузеры рассматривают два разных протокола в качестве разных доменов, поэтому локальное хранилище отличается для обоих протоколов, которые мы можем сделать, используя post message api, где мы устанавливаем данные в локальном хранилище, мы вызываем функцию в нашем iFrame и передаем эти данные в виде сообщения.

Используйте этот код на странице http

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

Теперь нам нужно получить эти данные в нашем https и установить эти данные для наших https же, как мы можем удалить данные из локального хранилища обоих протоколов.

И этот код на странице https который вы загружаете iframe.

// 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);
        }
    }

});

надеюсь, что это вам поможет