Как извлечь целевое имя хоста во время события onbeforeunload

Question

Я хотел бы предупредить пользователя, когда он пытается перейти от моего webapp, когда его/ее проект не сохранен. В настоящее время меня не интересуют поля редактирования, которые в настоящее время редактируются. Я знаю грязное состояние проекта на сессии.

Я быстро понял, что если я установлю функцию для window.onbeforeunload, это повредит пользователю, даже если он/sh перейдет на другую страницу в моем webapp. В этом случае не нужно беспокоиться, сессия будет еще жива.

Я попробовал раствор, полученный из Fire onbeforeunload only when window is closed (includes working example)

window.onbeforeunload = function (e) { 
    var targetHost = new URL(e.target.URL).hostname; 
    if (targetHost != window.location.host) 
     return "Project is unsaved!!!"; 
    else 
     return null; 
}; 

В new URL(e.target.URL).hostname результатах в JavaScript runtime error: Object doesn't support this action (по крайней мере, на IE11). И таинственным образом я не нахожу ничего о no new URL(e.target.URL).hostname от любого поиска.

Но в то же время я надеюсь, что это невозможно, я не могу поверить, что другие не испытывали этого.

Answer 1

Есть две проблемы в вашем скрипте:

window.onbeforeunload = function (e) { 
    var targetHost = new URL(e.target.URL).hostname; 
    if (targetHost != window.location.host) { 
     return "Project is unsaved!!!"; 
    else 
     return null; 
}; 

Первое, что вы не закрываете if. Во-вторых, e.target.URL, по-видимому, не поддерживается IE. У вас должен быть план A и B.

План: относится к случаю, когда e.target.URL существует. В этом случае вы обрабатываете случай, как вы первоначально реализовали, но с упомянутым выше синтаксическим исправлением.

B план: относится к случаю, когда e.target.URL не существует. В этом случае вы должны предположить, что пользователь покидает сайт. Вы можете улучшить подход, добавив знания, когда пользователь использует ваш элемент управления для навигации, например, вы знаете, что данный якорь останется на сайте. В этом случае вы можете определить событие click и установить значение boolean равным true (и значение по умолчанию для этого логического значения должно быть false ...), так что позже ваше событие onbeforeunload будет знать, что ваш пользователь остался на сайте, даже если он или она использует IE.

Так что вам нужна логика, как это:

var targetHost = !!e.target.URL ? (new URL(e.target.URL).hostname) : ((myFlag) ? (window.location.hostname) : ("elsewhere"));