Браузер истории удваивается

У меня проблема.
Ситуация такая: У меня есть iframe с сайтом внутри. Также у меня есть обертка с player.
Мне нужно это для одноэлементного проигрывателя, который не останавливается и не обновляется, когда пользователь переходит по ссылкам на сайте.
Используя postMessage для милого диалога между оболочкой и iframe, я пытаюсь вызвать изменения истории (onpopstate), поэтому если пользователь нажимает «назад» или «вперед», мой iframe перезагружается.
Я не понимаю, почему мое событие работает только на первой странице в истории (может быть, нет. Я все еще не понимаю). И ПОЧЕМУ, ОМГ, ПОЧЕМУ там удваивается каждое состояние истории?
Вот так:

  1. Музыкальные наборы
  2. Художники
  3. № исполнителя 34786
  4. Страница поиска
  5. Вернитесь назад (теперь у меня должна быть страница исполнителя. Мой iframe обновляется правильно, но оболочка имеет тот же URL-адрес и заголовок)
  6. Вернитесь снова (теперь меняет URL-адрес оболочки)

Вот мой код триггера. И подскажите, пожалуйста, в чем может быть причина такого плохого поведения?

обертка

var zaya = document.getElementById("iframe").contentWindow;

window.onpopstate = function(data) {
    zaya.postMessage({
        name: "popstate",
        url: window.location.host + window.location.pathname
    },
        "http://urlofwebsite.com"
    );

    alert("location: " + document.location + ", state: " + JSON.stringify(event.state));
};

сторона iframe

function listenerIF(data) {
    var info = data.data;

    if (data.origin !== "http://urlofwebsite.com") return;

    if (info.name === "popstate") {
        document.location = info.url;
    }
}

if (window.addEventListener) {
    window.addEventListener("message", listenerIF, false);
} else {
    window.attachEvent("onmessage", listenerIF);
}

Но этот триггер все равно не работает...


browser html iframe jquery popstate
person Tatiana Sokolova    schedule 17.10.2016    source источник
comment
может быть это из-за iframe, и он тоже подталкивает состояния в историю? Может есть способ отказаться от таких толчков?   -  person Tatiana Sokolova    schedule 17.10.2016

Ответы (1)


arrow_upward
0
arrow_downward

Я никогда не знал, что iframe добавляет свое состояние истории к основной истории. Поэтому я исправил это так:

$("a").on("click", function(e){
        e.preventDefault();
        var neededUrl = this.getAttribute('href');
        /*here is a code with postMessage to wrapper So there will be pushState()*/
        window.location.replace(neededUrl);
    });
person Tatiana Sokolova    schedule 18.10.2016