Как я могу вставить функцию в тег скрипта без включения синтаксиса оболочки?

В этой странной ситуации мне нужно преобразовать функцию JS в строку, а затем эту строку в динамически сгенерированный <script> тег (который использует тип javascript/worker чтобы не быть исполненным).

Я работаю над сценарием пользователя, внедряя код для создания общего веб-работника между двумя сторонними сайтами. Что касается пользовательских сценариев, то вы обычно просто хотите использовать один файл для функциональности сценария, а веб-работникам нравится использовать отдельный файл JS для рабочего. Ну, есть способ обойти это, используя Blob. Однако помните, что я работаю только с файлом сценария, а не с HTML-файлом для пользовательского сценария, поэтому я хочу сохранить эту часть (общий рабочий код) как функцию в моем сценарии:

var worker = function() {
  self.addEventListener('connect', function(e) {
    var port = e.ports[0];
    port.addEventListener('message', function(e) {
      var message = e.data;
      port.postMessage(message);
    });
    port.start();
  });
};

затем используйте toString() на нем, чтобы я мог вставить его в динамически генерируемый тег сценария на сторонних страницах, чтобы он заканчивался следующим образом без вызова сценария каких-либо дополнительных файлов:

<script id="worker1" type="javascript/worker">
    self.addEventListener('connect', function(e) {
        var port = e.ports[0];
        port.addEventListener('message', function(e) {
            var message = e.data;
            port.postMessage(message);
        });
        port.start();
    });
</script>

Однако используя toString() метод приводит к слову function будучи включенным, как показано в этом примере:

Помните, я собирался добавить функцию в тег скрипта с типом javascript/worker вместо text/javascript поэтому функция не будет выполняться до тех пор, пока она не будет преобразована в большой двоичный объект и использована в качестве источника файлов для рабочего, но здесь я собираюсь использовать text/javascript так что вы можете увидеть ошибку при ее выполнении.

var worker = function() {
  self.addEventListener('connect', function(e) {
    var port = e.ports[0];
    port.addEventListener('message', function(e) {
      var message = e.data;
      port.postMessage(message);
    });
    port.start();
  });
};

var func = worker.toString();
var script = document.createElement("script");
script.type = "text/javascript";
script.id = "worker1";
$("head").append(script);

$('body').append(script);
$('#worker1').append(func);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


Просто чтобы вы могли понять, что я делаю, потому что это может сбивать с толку, такая функция затем преобразует вышеуказанный невыполненный тег сценария в BLOB-объект и использует его вместо внешнего файла для создания общего рабочего:

var blob = new Blob([document.querySelector('#worker1').textContent], 
{ type: "text/javascript" });
var sharedWorker = new SharedWorker(window.URL.createObjectURL(blob));

Итак, как я могу вставить содержимое функции в тег сценария, не включая синтаксис оболочки функции (function (){)?

1 ответ

Решение

Вы можете использовать строковые методы, чтобы сделать это:

Я думаю, что это может помочь вам или что-то вроде этого, чтобы удалить имя функции.

function test(){
      console.log('TEST TEST');
}

    var fBody = test.toString()
    var index = fBody.indexOf('{');
    var functionBodyAsArray = fBody.substring(index + 1);
    functionBodyAsArray = functionBodyAsArray.substring(0, functionBodyAsArray.length - 1);

    console.log(functionBodyAsArray );

Другие вопросы по тегам