Можно ли получить доступ к веб-воркерам внутри компонента. vue

Question

Итак, я подумываю о создании этого приложения, которое будет использовать найденного мной веб-воркера, который генерирует скремблирование кубика рубика (на самом деле это довольно интенсивный процесс для генерации случайного скремблирования состояний, особенно для больших кубов, поэтому веб-воркеры необходимы для этого сценария). И мне интересно, можно ли получить доступ к этому веб-воркеру изнутри компонента vue (возникнут ли какие-либо проблемы с обслуживанием рабочего файла или доступом к нему. Если это возможно, как мне заставить его работать?

Answer 1

Да, можно, вот демо:

Vue.component('my-component', {
  template: '#my-component',
  data() {
    return {
      cube: '-- no data yet --',
      worker: null
    };
  },
  created() {
    this.initWorker();
  },
  beforeDestroy() {
    this.destroyWorker();
  },
  methods: {
    initWorker() {
      // Here, just for this demo to work, I'm not using an external file
      // for the worker. Instead, I use a Blob. It's still a real Worker!
      // See https://stackoverflow.com/a/6454685/1913729
      const scriptBlob = new Blob(
        [ document.querySelector('#worker-script').textContent ],
        { type: "text/javascript" }
      );
      this.worker = new Worker(window.URL.createObjectURL(scriptBlob));
      this.worker.onmessage = e => this.onCubeReady(e.data);
    },
    destroyWorker() {
      this.worker.terminate();
    },
    scrambleCube() {
      this.cube = '-- Scrambling cube... --'
      this.worker.postMessage('Gimme a cube');
    },
    onCubeReady(cube) {
      this.cube = cube;
    }
  }
});

var vm = new Vue({
  el: '#app'
});

  



  
    Scramble cube
    {{cube}}