Встроить веб-сайт с использованием JavaScript в новые Сайты Google
Следующий код загружает несколько внешних js-файлов и прекрасно работает на моем веб-сервере:
<script type="text/javascript" src="//code.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="http://s3.amazonaws.com/codecademy-content/courses/hour-of-code/js/alphabet.js"></script>
<body>
<div>
<canvas id="myCanvas"></canvas>
<script src="https://drive.google.com/uc?export=download&id=1lISKkEz4JTrPEFWKqpid-6sBByLP3wPY">
</script>
<script src="https://drive.google.com/uc?export=download&id=1lRAFdKQNu3YhBBDNEtj2WKDuLVM290pp">
</script>
</div>
</body>
Внедрение этого кода в новые Сайты Google приводит к созданию чистого холста.
Чтобы исправить ситуацию, я создал веб-страницу с работающим только кодом javascript и попытался встроить ее в качестве iframe в Сайты Google, используя следующий код:
<p align="center">
<iframe id="Bubbles"
title="Bubbles"
width="70%"
height="250"
src="http://edtech2.boisestate.edu/joshuawatson/hiddenpage2.html">
</iframe>
</p>
Этот код прекрасно работает и на моем веб-сервере (на что указывает доступ к странице src и просмотр работающей анимации), но в новых Сайтах Google все равно появляется пустой кадр.
Любые идеи о том, как я могу заставить этот скрипт работать на новых Сайтах Google?
Обратите внимание, что это буквально "игрушечный" пример, сам скрипт, который я пытаюсь запустить, более сложен и специфичен для моих нужд.
1 ответ
Я выложу ответ для всех, кому это нужно, но это не так уж интересно.
Первая проблема заключается в том, что некоторые браузеры (например, Google Chrome) не загружают небезопасные сценарии без явного разрешения.
Вторая проблема заключается в том, что сервер, который я первоначально разместил, отклонил запросы iframe из других доменов.
Размещение страницы в виде встроенного iframe со страниц Github решило обе проблемы для меня. Я создал пример страницы Github для демонстрации ниже:
Например:
<p align="center">
<iframe id="Bubbles"
title="Bubbles"
width="70%"
height="250"
src="https://uploadbakonbox.github.io/">
</iframe>
</p>