Как выполнить скрипт на странице из строки в java script?

76
16 марта 2021, 12:00

Для серверного рендеринга web components, мне надо что бы у меня выполнился скрипт на странице. Если я делаю запрос на сервер и получаю ответ строка читается хорошо, но когда я делаю fetch запрос на сервер, что бы уже на существующей странице добавить компонент ответ я получаю но не знаю как выполнить скрипт.

Упрощённо, строка для рендеринга выгляди так:

`<script>function __ssr(){console.log('exprestion')}> 
 <script>__ssr()</script>`

реальная строка:

 `<script>function __ssr(){var a=document.currentScript.previousElementSibling,b=a.firstElementChild;a.removeChild(b);for(var c=a.attachShadow({mode:"open"});b.hasChildNodes();)c.appendChild(b.firstChild);}</script><x-hello><shadow-root><span>Hello, <x-yell><shadow-root><strong><slot></slot></strong></shadow-root><slot></slot></x-yell><script>__ssr()</script>!</span></shadow-root>World</x-hello><script>__ssr()</script>` 

Как получив fetch запросом эту строку с сервера выполнить на странице для рендеринга веб компонента ?

Answer 1

Необходимо экранировать / -> \/, так это даже в сниппет не лезет, однако если это приходит с сервера можно сделать это регуляркой.

а дальше просто присоединить к странице

let str = '<script>function __ssr(){var a=document.currentScript.previousElementSibling,b=a.firstElementChild;a.removeChild(b);for(var c=a.attachShadow({mode:"open"});b.hasChildNodes();)c.appendChild(b.firstChild);}<\/script><x-hello><shadow-root><span>Hello, <x-yell><shadow-root><strong><slot><\/slot><\/strong><\/shadow-root><slot><\/slot><\/x-yell><script>__ssr()<\/script>!<\/span><\/shadow-root>World<\/x-hello><script>__ssr()<\/script>';  
 
 
setTimeout(e => $('body').append(str), 1000);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
1234

PS: через eval можно было бы если только скрипт приезжал, но у Вас там разметка...

READ ALSO
Как считать из span с помощью textContext

Как считать из span с помощью textContext

Подскажите, почему при попытке считать textContent из span, выдает ошибку:

92
Проблемы с доступом к файлу из приложения Xamarin.Forms

Проблемы с доступом к файлу из приложения Xamarin.Forms

Столкнулся со следующей проблемойЕсть файл базы данных SQLite, необходимо его скопировать на SD карту смартфона Android

91
Как отправить данные из WebHook в WinForm?

Как отправить данные из WebHook в WinForm?

Мне необходимо приложение WinForm, которое будет клиентом для ViberЯ создал WebHook, который принимает POST запросы от сервера Viber

76