Комментарии 16
По поводу "безопасности" стоит глянуть эту статью. Но тут она и не нужна, ибо тот, кто имеет доступ к содержимому тега script, - тот и так может выполнить произвольный код.
Картинка про троллейбус из буханки
А почему нельзя сделать так?
<script defer src="https://mysite.github.io/script.js"></script>
<script>
window.MyWidgetConfig = {
color: "#fff",
text: "Hello JS world!",
}
</script>
Скажем, два одинаковых виджета на странице, каждый с другим конфигом.
(Я не защищаю решение в статье, просто, ну, очевидный ответ.)
Если виджет на странице может повторяться, это это решение тоже не годится. Потому что придется один и тот же скрипт подключать и исполнять дважды.
Для такой ситуации лучше явные конструкторы создавать.
Можно конечно, но это не так прикольно
а я передаю параметры через атрибуты:
<script data-coolparameter="coolcmd">
А можно аттрибутами передать:
<script defer color="#fff" src="https://mysite.github.io/script.js"></script>
И получить:
document.currentScript.getAttribute('color')
У инлайн-js - проблема с CSP, поэтому, на мой взгляд, из всех вариантов, JSON - самый перспективный. В атрибутах тегов, которые тут уже упомянули, не удобно работать со сложными конфигами, с объектами и массивами в значениях. Но, при этом, настройки лучше вынести в отдельный тег (не script). Это даст возможность связывать разные конфиги с разными экземплярами виджетов, если их в документе несколько.
Проще текстовыми функциями обкусить начальный return, а потом JSON.parse. sandbox — это стрелять микроскопом по воробьям.
Ну и как заметили выше — явный подход лучше магического.
Попробуйте использовать trim (хотя у меня и без него работает)
let selfElement = document.currentScript;
let config = JSON.parse(selfElement.innerText.trim());
alert(config.test)
вот пример
Интересный способ сделать config для web js библиотеки