JavaScript / JQuery Publish подписка не работает между двумя страницами, но работает в пределах страницы в коде ниже

Question

У меня есть две html-страницы и файл JavaScript.

Реализация

First html страница публикует сообщение, а страница second html подписывается на опубликованное сообщениеи выполняет действие, основанное на опубликованном сообщении на второй странице.

Постановка проблемы

Публикация и подписка работают нормально на той же HTML-странице, но возникают проблемы при работемежду двумя html-страницами.

Проблема в том, что подписанное сообщение отображается на первой HTML-странице, а не на второй HTML-странице.

Первая HTML-страница

<script>
        function clickMe() {
            messageBus.publish('event', 4);
        }
</script>

Вторая HTML-страница

<script>
            messageBus.subscribe('event', function(data) {
                $("#div1").text(data);
            });
</script>
<div id="div1"></div>

JS-файл

var messageBus = {
events: {},
publish: function(eventType, data) {
    if (typeof(Storage) !== "undefined") {
      var myFunc = localStorage.getItem(eventType);
      var e = eval('(' + myFunc + ')');

      if(e) {
          e(data);
      }
    }
},
subscribe: function(eventType, fn) {
    if (typeof(Storage) !== "undefined") {
        localStorage.setItem(eventType, fn);
    }
},
unsubscribe: function(eventType) {
    if (typeof(Storage) !== "undefined") {
        localStorage.removeItem(eventType);
    }
}
}

Что-то упущено в реализации?Дайте мне знать, если для прояснения вопроса требуется больше материалов.

Answer 1

Ваши методы публикации и подписки неверны, публикация получает элемент, а подписка - его запись.И избавиться от этого eval!

Answer 2

Основная проблема

Как уже указывалось Адриан Брэнд в ответ , код внутри вашего publish метода иsubscribe метод должен быть заменен.

Другие не связанные, но связанные с дизайном проблемы

1. Другая проблема с вашим messageBus заключается в том, что если издатель публикует более одного сообщения до того, как подписчик сможет прочитать любое из сообщений, только последнее из опубликованных сообщений будет сохранено в вашей шине сообщений ;все предыдущие сообщения перезаписываются последними, поэтому они никогда не будут переданы подписчикам .

2. Вы используете eval для запуска всего, чтоможет быть внутри элемента localStorage.Это открывает ваше приложение до угрозы безопасности.

   Что делать, если я открыл ваше приложение в Developer Tools , написал вредоносную функцию или скрипт и поместил его в локальное хранилище с ключом 'events'?Ваш код будет выполнять мою функцию.Теперь представьте себе все, что я мог сделать с этой способностью.

   Я мог бы отправлять запросы AJAX злым веб-сайтам (я бы делал их GET запросов, чтобы обойти CORS), читать ваши куки, искать и очищать все вашиполя формы, вставьте их в объект данных формы и отправьте на мой сервер, и многое другое.