Вставить JavaScript как base64 - PullRequest
11 голосов
/ 20 декабря 2008

Я работаю над небольшим скриптом GreaseMonkey, в который я хотел бы встроить плагин jQuery (Markitup), чтобы скрипт был полностью автономным (images + js), за исключением jQuery, который подается из Google.

Я нашел сайт http://www.greywyvern.com/code/php/binary2base64, на котором написано, что вы можете встроить javascript с помощью href, если вы закодируете сценарий с помощью base64, очень похоже на использование изображений в качестве basse64 из CSS.

<script type="text/javascript" href="data:text/javascript;base64,dmFyIHNjT2JqMSA9IG5ldyBzY3Jv..."></script>

Так что я попробовал это, но не смог заставить его работать вообще, используя Firefox 3.0.5 на OS X.

Я собрал небольшую тестовую страницу, чтобы изолировать проблему, но не смог заставить ее работать и на этой странице.

<!DOCTYPE HTML>
<html>
   <head>
      <title>Title</title>
      <meta charset="utf-8">
   </head>
   <body>
      <script href="data:text/javascript;base64,YWxlcnQoJ2FzYWRhc2QnKTsK"></script> 
      <script>alert('a');</script>  
   </body>
</html>

Строка base64 (YWxlcnQoJ2FzYWRhc2QnKTsK) говорит alert('asadasd');, поэтому я должен получить два оповещения, но я вижу только одно второе, где оповещение находится в виде текста внутри тега сценария.

Я что-то не так делаю или почему это не работает, идеи?

Ответы [ 4 ]

14 голосов
/ 20 декабря 2008

может быть, просто мысль, но, возможно, вместо "href" следует использовать "src".

3 голосов
/ 20 декабря 2008

Если вы проверите синтаксис тега скрипта, вы получите

<script src="..."
        ^^^
        src NOT href

Использование URI данных здесь не работает в IE 6, кстати.

1 голос
/ 20 декабря 2008

Забавно, я работаю над точно такой же проблемой: создаю скрипт Greasemonkey для добавления markItUp ко всем текстовым областям страницы.

Теперь у меня нет проблем с самим библиотечным скриптом. Во всяком случае, я не понимаю, почему вы хотите вставить его как Base64. Как указано, оно будет больше.
Вы можете поместить его непосредственно в скрипт GM, если хотите (некоторые люди делают это с помощью jQuery), или динамически добавить <script src="someURL"></script> в документ и ждать загрузки (в Интернете есть множество примеров) (неудобство: создает трафик на сайты, содержащие файлы), или, как я сейчас пытаюсь, используя последнюю (0.8) функцию GM:

// @require      jquery.js
// @require      markitup.js
// @resource     miuStyle style.css

Требуемые JS-файлы автоматически загружаются в сценарий GM из локальной копии, что быстро и всегда доступно. Не используйте упакованные версии, они здесь не работают. У меня также были проблемы с set.js, поэтому я просто вставил прямо в скрипт.
Это хорошо работает, но у меня пока нет стиля и иконок.
Я думаю, я должен поместить текст miuStyle на веб-странице и изменить его так, чтобы все фоновые изображения ссылались на одно и то же изображение, размещенное в Photobucket или аналогичное, со смещением. Я не нашел способа использовать локальные изображения (в CSS), увы, даже с @ resource.

Мой ответ, увы, не касается вашей проблемы (но замечание Джона кажется верным), но может привести вас к другому, более простому решению.

0 голосов
/ 18 ноября 2015

Base-64 увеличивает размер файла, но делает его более машиночитаемым, что фактически увеличивает скорость страниц. Я определенно могу понять, почему вы этого хотите, если только вы не хотите посмотреть на 50 строк в своем файле. К вашему сведению, я только что прочитал исследование о том, что на мобильном телефоне Base 64 медленнее загружается, поэтому, если ваше приложение слишком мобильное, я бы держался подальше

...