Failed to construct 'Worker': Script at '.......' cannot be accessed from origin 'null'.

See original GitHub issue

I use "vue-pdf": "^2.0.3" in the vue spa project。After packing,on the phone, from did not use vue-pdf page(B page) to use vue-pdf page(A page),A page did not execute any code(alert , document.titile=‘123123’…),and no any DOM.]

when i open the index.html in PC Google Chrome， Failed to construct 'Worker': Script at 'file:///C:/Users/huhai/Desktop/1.0/2a59ae14c7719d1a21eb.worker.js' cannot be accessed from origin 'null'.

Issue Analytics

State:
Created 6 years ago
Reactions:1
Comments:14 (1 by maintainers)

Top GitHub Comments

5reactions

FranckFreiburgercommented, Nov 10, 2017

In the file pdf.vue

try to replace

if ( process.env.VUE_ENV === 'server' ) {

	var PDFJS = require('pdfjs-dist/build/pdf.js');
	PDFJS.PDFJS.disableWorker = true;
} else {

	var PDFJS = require('pdfjs-dist/webpack.js');
}

with

var PDFJS = require('pdfjs-dist/build/pdf.js');
PDFJS.PDFJS.disableWorker = true;

and compile again

4reactions

dante2359commented, Apr 14, 2020

My goal was to exclude the file “[hash] .worker.js” from the root of the project. But, when I tried to use import pdf from 'vue-pdf/src/vuePdfNoSssNoWorker' instead of import pdf from 'vue-pdf/src/vuePdfNoSss' the PDF pages did not render without pdf.worker.

The following configuration helped me. In ‘vuePdfNoSss.vue’: comment string: // var PdfjsWorker = require('worker-loader!pdfjs-dist/build/pdf.worker.js'); and add to top level: import PdfjsWorker from 'pdfjs-dist/build/pdf.worker.js'

This will allow the custom configuration of ‘worker-loader’ from ‘webpack’ (in detail: https://webpack.js.org/loaders/worker-loader/).

And in ‘vue.config.js’ you need to define rule for ‘worker.js’ files in chainWebpack(config):

module.exports = {
  
  chainWebpack(config) {    
    config.module
      .rule('worker')
      .test(/\.worker\.js$/)
      .use('worker-loader').loader('worker-loader')
      .options(
        {
          inline: true,
          fallback: false
        }
        )
      .end()
  }
}