无法加载脚本-Webworker(PDF.JS) [英] failed to load script - Webworker (PDF.JS)
问题描述
我正在尝试加载pdf.js Webworker，但我不能！?
I'm trying to load the pdf.js webworker, but I can't!?
URL //cdn.localhost/js/pdf/worker_loader.js?v=280在浏览器中打开时存在
The URL //cdn.localhost/js/pdf/worker_loader.js?v=280 exists when opening it in the browser
Failed to load script: //cdn.localhost/js/pdf/worker_loader.js?v=280
(nsresult = 0x805303f4)
html(URL =//secure.localhost)
<!DOCTYPE html>
<html>
<head></head>
<body>
<script type="text/javascript" src="//cdn.localhost/js/pdf/core.js?v=280"></script>
<script type="text/javascript" src="//cdn.localhost/js/pdf/util.js?v=280"></script>
<script type="text/javascript" src="//cdn.localhost/js/pdf/api.js?v=280"></script>
<script type="text/javascript" src="//cdn.localhost/js/pdf/canvas.js?v=280"></script>
<script type="text/javascript" src="//cdn.localhost/js/pdf/obj.js?v=280"></script>
<script type="text/javascript" src="//cdn.localhost/js/pdf/function.js?v=280"></script>
<script type="text/javascript" src="//cdn.localhost/js/pdf/charsets.js?v=280"></script>
<script type="text/javascript" src="//cdn.localhost/js/pdf/cidmaps.js?v=280"></script>
<script type="text/javascript" src="//cdn.localhost/js/pdf/colorspace.js?v=280"></script>
<script type="text/javascript" src="//cdn.localhost/js/pdf/crypto.js?v=280"></script>
<script type="text/javascript" src="//cdn.localhost/js/pdf/evaluator.js?v=280"></script>
<script type="text/javascript" src="//cdn.localhost/js/pdf/fonts.js?v=280"></script>
<script type="text/javascript" src="//cdn.localhost/js/pdf/glyphlist.js?v=280"></script>
<script type="text/javascript" src="//cdn.localhost/js/pdf/image.js?v=280"></script>
<script type="text/javascript" src="//cdn.localhost/js/pdf/metrics.js?v=280"></script>
<script type="text/javascript" src="//cdn.localhost/js/pdf/parser.js?v=280"></script>
<script type="text/javascript" src="//cdn.localhost/js/pdf/pattern.js?v=280"></script>
<script type="text/javascript" src="//cdn.localhost/js/pdf/stream.js?v=280"></script>
<script type="text/javascript" src="//cdn.localhost/js/pdf/worker.js?v=280"></script>
<script type="text/javascript" src="//cdn.localhost/js/pdf/bidi.js?v=280"></script>
<script type="text/javascript" src="//cdn.localhost/js/pdf/jpg.js?v=280"></script>
<script type="text/javascript" src="//cdn.localhost/js/pdf/jpx.js?v=280"></script>
<script type="text/javascript" src="//cdn.localhost/js/pdf/jbig2.js?v=280"></script>
<script type="text/javascript">
PDFJS.workerSrc = '//cdn.localhost/js/pdf/worker_loader.js?v=280';
PDFJS.getDocument(voucher_url).then(function(pdf){
pdf.getPage(1).then(function(page){
var scale = 1.5,
viewport = page.getViewport(scale),
canvas = document.createElement('canvas'),
context = canvas.getContext('2d');
$(canvas).appendTo(container);
canvas.height = viewport.height;
canvas.width = viewport.width;
var renderContext = {
canvasContext: context,
viewport: viewport
};
page.render(renderContext);
});
});
</script>
</body>
</html>
//cdn.localhost/js/pdf/worker_loader.js?v = 280
'use strict';
// List of files to include;
var files = [
'core.js',
'util.js',
'canvas.js',
'obj.js',
'function.js',
'charsets.js',
'cidmaps.js',
'colorspace.js',
'crypto.js',
'evaluator.js',
'fonts.js',
'glyphlist.js',
'image.js',
'metrics.js',
'parser.js',
'pattern.js',
'stream.js',
'worker.js',
'jpx.js',
'jbig2.js',
'bidi.js',
'jpg.js'
];
// Load all the files.
for (var i = 0; i < files.length; i++) {
importScripts(files[i]);
}
推荐答案
您的问题是您试图使用Web Worker从其他域加载脚本.错误号0x805303f4表示拒绝访问受限制的URI".
Your problem is that you're attempting to use a Web Worker to load a script from a different domain. The error number 0x805303f4 means "Access to restricted URI denied".
引用网络工作者规范:
如果生成的解析URL的方案组件不是数据"，并且生成的绝对URL的来源与输入脚本的来源不同，则抛出SecurityError异常并中止这些步骤.
If the scheme component of the resulting parsed URL is not "data", and the origin of the resulting absolute URL is not the same as the origin of the entry script, then throw a SecurityError exception and abort these steps.
注意:因此，脚本必须是具有与原始页面相同的方案，主机和端口的外部文件，或者是数据:URL.
Note: Thus, scripts must either be external files with the same scheme, host, and port as the original page, or data: URLs.
解决此问题的一种方法是将worker_loader脚本移到与html页面相同的域中.因此，您将初始化workerSrc这样的东西:
One way of solving this problem is to move the worker_loader script onto the same domain as the html page. So you would be initialising workerSrc something like this:
PDFJS.workerSrc = 'worker_loader.js?v=280';
然后您还需要更新worker_loader脚本以使用绝对URL，因此导入循环可能会变成这样:
And then you'd also need to update the worker_loader script to use absolute urls, so the import loop might become something like this:
for (var i = 0; i < files.length; i++) {
importScripts('//cdn.localhost/js/pdf/'+files[i]);
}
此外，根据托管voucher_url的位置，还可能会生成跨域安全性错误，因为该错误是通过XMLHttpRequest加载的.如果是这种情况，则需要在提供pdf的域上设置Access-Control-Allow-Origin标头.
Also, depending on where the voucher_url is hosted, that may also generate a cross domain security error, as that is loaded via an XMLHttpRequest. If that is the case, you'll need to set the Access-Control-Allow-Origin header on the domain that serves the pdf.
如果已安装mod_headers模块，则可以通过Apache上的.htaccess文件执行此操作.您需要添加以下内容:
You can do this via a .htaccess file on Apache if you have the mod_headers module installed. You'll need to add something like this:
Header set Access-Control-Allow-Origin "http://secure.localhost"
如果需要支持多个主机，则可以使用"*"代替主机名，但是出于安全原因，通常不建议这样做.
If you need to support multiple hosts, you can use "*" instead of the host name, but that isn't generally advisable for security reasons.
这篇关于无法加载脚本-Webworker(PDF.JS)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
