Fix worker cross domain issue

Author: jeromewu

README.md

@@ -22,6 +22,10 @@ Use FFmpeg directly in your browser without any backend services!!
   </a>
 </p>
 
+<a href="https://codepen.io/jeromewu/pen/NWWaMeY" target="_blank">
+<img alt="codepen" width="128px" src="https://blog.codepen.io/wp-content/uploads/2012/06/[email protected]">
+</a>
+
 [Source Code](https://github.com/ffmpegjs/ffmpeg.js/blob/master/examples/browser/transcode.html)
 
 ---

src/createWorker.js

@@ -1,6 +1,7 @@
 const createJob = require('./createJob');
 const { log } = require('./utils/log');
 const getId = require('./utils/getId');
+const resolvePaths = require('./utils/resolvePaths');
 const {
   defaultOptions,
   spawnWorker,
@@ -17,10 +18,10 @@ module.exports = (_options = {}) => {
   const {
     logger,
     ...options
-  } = {
+  } = resolvePaths({
     ...defaultOptions,
     ..._options,
-  };
+  });
   const resolves = {};
   const rejects = {};
   let worker = spawnWorker(options);

src/utils/getEnvironment.js

@@ -0,0 +1,10 @@
+module.exports = (key) => {
+  const env = {
+    type: (typeof window !== 'undefined') && (typeof window.document !== 'undefined') ? 'browser' : 'node',
+  };
+
+  if (typeof key === 'undefined') {
+    return env;
+  }
+  return env[key];
+};

src/utils/resolvePaths.js

@@ -0,0 +1,12 @@
+const isBrowser = require('./getEnvironment')('type') === 'browser';
+const resolveURL = isBrowser ? require('resolve-url') : s => s; // eslint-disable-line
+
+module.exports = (options) => {
+  const opts = { ...options };
+  ['corePath', 'workerPath'].forEach((key) => {
+    if (typeof options[key] !== 'undefined') {
+      opts[key] = resolveURL(opts[key]);
+    }
+  });
+  return opts;
+};

src/worker/browser/defaultOptions.js

@@ -11,4 +11,5 @@ module.exports = {
     ? resolveURL(`/dist/worker.dev.js?nocache=${Math.random().toString(36).slice(3)}`)
     : `https://unpkg.com/@ffmpeg/ffmpeg@v${version}/dist/worker.min.js`,
   corePath: `https://unpkg.com/@ffmpeg/core@v${dependencies['@ffmpeg/core'].substring(1)}/ffmpeg-core.js`,
+  workerBlobURL: true,
 };

src/worker/browser/spawnWorker.js

@@ -5,6 +5,16 @@
  * @function create a new Worker in browser
  * @access public
  */
-module.exports = ({ workerPath }) => (
-  new Worker(workerPath)
-);
+module.exports = ({ workerPath, workerBlobURL }) => {
+  let worker;
+  if (Blob && URL && workerBlobURL) {
+    /* Use Blob to load cross domain worker script */
+    const blob = new Blob([`importScripts("${workerPath}");`], {
+      type: 'application/javascript',
+    });
+    worker = new Worker(URL.createObjectURL(blob));
+  } else {
+    worker = new Worker(workerPath);
+  }
+  return worker;
+};