Параметр newWindow

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

Тип и значение параметра

newWindow принимает булевое значение:

newWindow: true  // ссылка откроется в новой вкладке/окне
newWindow: false // ссылка откроется в текущей вкладке
  • true — браузер откроет ссылку в новом окне или вкладке. В большинстве современных браузеров это эквивалентно атрибуту target="_blank".
  • false — переход произойдет в той же вкладке, где находится приложение.

По умолчанию newWindow равен true, что обеспечивает безопасное поведение для внешних ссылок.

Использование вместе с параметром destination

Параметр newWindow часто применяется вместе с destination — URL, на который ведет уведомление:

Toastify({
  text: "Посмотреть документацию",
  destination: "https://toastify-js.com",
  newWindow: true
}).showToast();

В этом примере уведомление содержит текст с ссылкой, которая откроется в новой вкладке. Если бы newWindow было установлено в false, переход произошел бы в текущей вкладке.

Практические рекомендации

  • Внешние ссылки: рекомендуется оставлять newWindow: true, чтобы не прерывать работу основного приложения.
  • Внутренние переходы: для ссылок внутри того же приложения можно использовать newWindow: false, чтобы не создавать лишние вкладки.
  • Безопасность: открытие новых окон с внешними URL всегда сопровождается риском фишинга или нежелательных перенаправлений. Поддержка newWindow в Toastify упрощает соблюдение безопасных практик.

Пример с полной настройкой уведомления

Toastify({
  text: "Откройте пример",
  duration: 5000,
  gravity: "top",
  position: "right",
  backgroundColor: "#4CAF50",
  stopOnFocus: true,
  destination: "https://toastify-js.com",
  newWindow: true,
  close: true
}).showToast();

Здесь уведомление:

  • Показывается в правом верхнем углу (gravity: "top", position: "right");
  • Имеет зеленый фон (backgroundColor: "#4CAF50");
  • Остается на экране при наведении мыши (stopOnFocus: true);
  • Содержит ссылку, открывающуюся в новой вкладке (newWindow: true).

Совместимость и нюансы

  • В большинстве браузеров newWindow: true создаёт новую вкладку, но поведение может изменяться настройками пользователя.
  • Для приложений с активными SPA (Single Page Application) часто предпочтительнее использовать внутренние маршруты с newWindow: false, чтобы не перезагружать приложение.
  • newWindow работает только при заданном destination. Если URL отсутствует, параметр не оказывает никакого эффекта.

Итоговые рекомендации по использованию

  • Использовать true для внешних ссылок.
  • Использовать false для внутренних переходов.
  • Всегда проверять совместимость с текущей версией браузера и настройками безопасности.
  • Сочетать с destination для полной функциональности уведомления.
Оглавление