Написание файла JavaScript из другого JavaScript
У меня есть две веб-страницы. На первой странице я должен отправить форму. Используя значения из формы (используя встроенный javascript), мне нужно сгенерировать другой файл javascript и использовать этот сгенерированный файл javascript на следующей странице. Как это может быть сделано? Или есть лучший способ сделать это?
2 ответа
Того же происхождения?
Документы одного и того же происхождения всегда могут взаимодействовать друг с другом. Если код в одном окне или фрейме может ссылаться на другое окно или фрейм и они имеют одинаковое происхождение, тогда JavaScript в одном контексте выполнения (окно или фрейм!!) Может взаимодействовать с другим. Вы получаете такую ссылку на иностранный Window
объект в качестве возвращаемого значения при вызове window.open()
! Таким образом, используйте эту ссылку, чтобы установить любые переменные, которые вы хотите в этом окне, или загрузить новые скрипты, как вам угодно.
Перекрестный обмен документами
Если документы не одного происхождения или у вас нет ссылки на другой контекст выполнения, вы должны использовать новый API, введенный в HTML5. Он называется "postMessage API" и на удивление хорошо поддерживается. Даже IE 8 поддерживает это!
Вот простой способ проверить поддержку этой функции в браузере:
if (typeof window.postMessage !== undefined)
console.log("postMessage API is supported!");
Вот пример того, как отправить текст приветствия фиктивному получателю:
window.postMessage("Hello world", "www.dummy.com");
А вот как вы могли бы прослушивать такие сообщения в другом JavaScript, размещенном где-то еще:
window.addEventListener("message", function(event) {
if (event.origin === "www.dummy.com")
console.log("Received message: " + event.data);
}, true);
IE11 может иметь некоторые проблемы с этим и вообще не поддерживается в предыдущих версиях.
Динамически загружать JavaScript
Всякий раз, когда вам удается установить канал связи между ними, и передачи простых данных недостаточно, вы всегда можете передать полноценный JavaScript другой стороне и попросить его выполнить этот сценарий. Пожалуйста, ознакомьтесь с этим вопросом о стековом потоке и связанных с ним ответах, чтобы узнать, как реализовать такое решение на принимающей стороне
Конечно, это всего лишь несколько коротких примеров, остальные вы должны погуглить. Надеюсь, это помогло вам выбрать путь хотя бы.
Вы можете делать то, что вы ищете, используя Blobs. Однако для того, чтобы запустить JavaScript на другой странице, вам также понадобится HTML-код для этой страницы.
Не очень чистый пример, который работает...
var script = function callme(){alert('hi!');};
var html = '<!DOCTYPE html><html><head><script type="text/javascript">'+script.toString()+'</script><body><a onclick="callme();return false;" href="javascript:void(0);">Click me!</a></body></html>';
window.open(URL.createObjectURL(new Blob([html],{type:'text\/html'})));
Он работает только в более новых браузерах, таких как Chrome 20+, Firefox 13+, IE 10+ и Safari 6+. Более подробная информация о Blobs здесь: https://developer.mozilla.org/en-US/docs/Web/API/Blob
Один из возможных вариантов для такой ситуации (и я прекрасно понимаю, что он подойдет не всем) - это пойти менее изощренным путем и поместить видимые страницы в iframe, заполняющий область просмотра; тогда просто оставьте данные в родительском окне. Iframe будет перемещаться с вашей страницы 1 на страницу 2, но поскольку родительское окно не меняется, это стабильный репозиторий для любого количества МБ данных javascript, которое вам нужно. Это также будет проще и эффективнее, чем любой другой метод межоконной связи, который вы могли бы использовать, учитывая количество задействованных данных, и он будет работать во всех браузерах вплоть до Netscape Navigator (возможно! -)).
Или для связанного решения отобразите страницу 2 в iframe, который вы вставляете на страницу 1, которая снова заполняет экран и покрывает существующий контент. Поскольку страница 1 все еще существует и может обмениваться данными с iframe, у вас снова нет проблем.