Блог

Я также пытаюсь изменить URL-адрес (без обновления страницы) после того, как я изменю свой DOM с помощью Ajax.

 $("nav li").click(function(e) {
    e.preventDefault();
    var url;
    var targetLocation = this.parentNode.attributes.href.value;
    switch (targetLocation) {
    case "index.html": url = "http://localhost:8080/home"; break;
    case "app.html": url = "http://localhost:8080/api"; break;
    case "contact.html": url = "http://localhost:8080/contact"; break;
    }

    $.ajax({
        type: "GET",
        dataType: "text",
        url: url,
        context: document.body,
        success: function(data) {
            $("div").text(data);
            history.pushState("", "", targetLocation);
        }
    })
})
  

Но я получаю сообщение об ошибке, в котором говорится:

 Uncaught DOMException: failed to execute "pushState" on "History": A history state object with URL "file:///C:/test/app.html" cannot be created in a document with origin "null" and URL "file:///C:/test/index.html".
  

Ваш код не включает их, но ваша ошибка предполагает, что вы работаете с локальными файлами. Браузеры не поддерживают операции с историей URL-адресов локальной файловой системы.

Модель безопасности для URL-адресов file:// не подлежит восстановлению. Вместо того, чтобы усложнять браузер особыми случаями для URL-адресов file://, мы решили отключить некоторые функции для URL-адресов file: //, допустив сбой класса проверок безопасности. К сожалению, pushState является одной из таких функций. Я бы рекомендовал не использовать URL-адреса file:// в вашем приложении.

https://bugs.chromium.org/p/chromium/issues/detail?id=301210

Не удалось найти ссылку на Firefox, но IIRC их поведение такое же, как у Chrome.