Как я могу предотвратить попадание в историю браузера Iframe после взаимодействия с ним? - PullRequest
Новая
       16

Как я могу предотвратить попадание в историю браузера Iframe после взаимодействия с ним?

5 голосов
/ 30 сентября 2019

Так что в моем случае я использую Iframes, чтобы прикрепить Grafana к моей странице (что дает мне красивые и простые в использовании графики).

Можно заметить, что Iframes Grafana вызывает своего рода обновление на моей угловой страницепосле каждого взаимодействия увеличения или уменьшения масштаба (с помощью щелчков мыши) на графике, таким образом, испортить историю братера. Я не вижу каких-либо изменений в src Iframe, чтобы оправдать это обновление страницы, и он, по-видимому, ничего не вызывает (например, не вызывает никакой загрузки).

Это нормальное поведение? Как я могу предотвратить это?

Я использую панель инструментов Grafana версии 6.2.2 со скриптами вместе с Angular 6.1.

Ответы [ 3 ]

3 голосов
/ 10 октября 2019

Надеюсь помочь, кое-что, что я мог бы попробовать в вашем сценарии:

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

  2. Вы сказали, что песочница сломает iframe? Возможно, поиграйте с разными значениями в песочнице. Как и сценарии allow-scripts, посмотрите, нужно ли для работы одно из этих значений

    https://www.w3schools.com/tags/att_iframe_sandbox.asp

  3. Возможно, попробуйте поместить графрам iframe в другой iframe. Я никогда не делал этого раньше, но, возможно, он попытается обновить родительский iframe вместо родительской страницы.

Также может быть полезно опубликовать ваш угловой HTML-код в вопросе. Там могут быть какие-то намеки.

0 голосов
/ 14 октября 2019

Пожалуйста, попробуйте ниже упомянуто в документации Graphana.

Поделиться панелью

Щелкните заголовок панели, чтобы открыть меню панели, затем нажмите поделиться в меню панели, чтобы открытьдиалоговое окно «Поделиться панелью». Здесь у вас есть доступ к ссылке, которая приведет вас именно к этой панели с текущим временным диапазоном и выбранными переменными шаблона.

Вставить панель : Вы можете встроить панель с помощью iframe в другойВеб-сайт. Эта вкладка покажет вам HTML, который вам нужно использовать.

Пример: 

<iframe src="https://snapshot.raintank.io/dashboard-solo/snapshot/y7zwi2bZ7FcoTlB93WN7yWO4aMiz3pZb?from=1493369923321&to=1493377123321&panelId=4" width="650" height="300" frameborder="0"></iframe>

Ниже должен быть интерактивный граф Графана, встроенный в iframe:

Есливы видите, что Grafana не удалось загрузить файлы приложения

  1. Это может быть вызвано настройками обратного прокси-сервера.

  2. Если вы используете хостgrafana под подпатом, убедитесь, что ваш параметр root_path grafana.ini включает подпуть

  3. Если у вас есть локальная сборка dev, убедитесь, что вы строите внешний интерфейс с помощью: npm run dev, npm run watch или npm runbuild

  4. Иногда перезапуск графана-сервера может помочь

enter image description here

0 голосов
/ 08 октября 2019

Без эффективной реализации iframe трудно предложить наилучший способ действий.

Самое простое решение, которое приходит на ум, - это атрибут iframe sandbox: 

<iframe src="my_iframe.html" sandbox></iframe>

Что такое песочница iframe?

Атрибут песочницы включает дополнительный набор ограничений для содержимого в iframe.

Когда присутствует атрибут песочницы, ион будет:

  • обрабатывать контент как уникальный источник
  • представление блочной формы
  • выполнение скрипта блока
  • отключение API
  • запретить ссылкам ориентироваться на другие контексты просмотра
  • запретить использование контента плагинами (через, или другим способом)
  • запретить содержаниедля навигации по контексту просмотра верхнего уровня
  • блокировать автоматически запускаемые функции

Значением атрибута песочницы может быть либо просто песочница (тогда применяются все ограничения), либопробелСписок предопределенных значений, которые снимают определенные ограничения.

Ссылка: https://www.w3schools.com/tags/att_iframe_sandbox.asp

...