代码之家  ›  专栏  ›  技术社区  ›  Charlie Fish

tus-上传后访问控制允许源错误

  •  0
  • Charlie Fish  · 技术社区  · 8 年前

    我用的都是 tus-node-server 以及 tus-js-client 尝试从Web浏览器将文件上载到我的服务器。在较小的文件(10MB的ISH),它似乎工作良好,但在更大的文件(38 5MB ISH),似乎是失败与A Access-Control-Allow-Origin 失败。

    上传进程被调用并一直完成到100%,然后失败并出现错误。这使我认为这个错误与某种类型的验证有关。

    在控制台中抛出该错误后,它会一直重试,直到达到我设置的重试限制。

    我已经把错误贴在下面了。为什么会这样?

    [Error] Origin https://example.com is not allowed by Access-Control-Allow-Origin.
    [Error] XMLHttpRequest cannot load https://upload.example.com//saiudfhia1h due to access control checks.
    [Error] Failed to load resource: Origin https://example.com is not allowed by Access-Control-Allow-Origin.
    

    同样,在尝试所有重试之后,失败并出现此错误。

    tus: failed to upload chunk at offset 0, caused by [object XMLHttpRequestProgressEvent], originated from request (response code: 0, response text: )
    

    前端JS:

    var upload = new tus.Upload(file, {
        endpoint: "https://upload.example.com/?id=" + res._id,
        retryDelays: [0, 1000, 3000, 5000],
        metadata: {
            filename: res._id,
            filetype: file.type
        },
        onError: function(error) {
            console.log("Failed because: " + error)
        },
        onProgress: function(bytesUploaded, bytesTotal) {
            console.log(bytesUploaded, bytesTotal, percentage + "%")
        },
        onSuccess: function() {
            console.log("Download %s from %s", upload.file.name, upload.url)
    
            alert("You have successfully uploaded your file");
        }
    })
    
    // Start the upload
    upload.start()
    

    后端JS:

    server.datastore = new tus.FileStore({
        directory: '/files',
        path: '/',
        namingFunction: fileNameFromUrl
    });
    
    server.on(EVENTS.EVENT_UPLOAD_COMPLETE, (event) => {
        console.log(`Upload complete for file ${event.file.id}`);
    
        let params = {
            Bucket: keys.awsBucketName,
            Body: fs.createReadStream(path.join("/files", event.file.id)),
            Key: `${event.file.id}/rawfile`
        };
        s3.upload(params, function(err, data) {
            console.log(err, data);
            fs.unlink(path.join("/files", event.file.id), (err) => {
                if (err) throw err;
                console.log('successfully deleted file');
            });
        });
    });
    
    const app = express();
    const uploadApp = express();
    uploadApp.all('*', server.handle.bind(server));
    app.use('/', uploadApp);
    app.listen(3000);
    
    1 回复  |  直到 8 年前
        1
  •  0
  •   Charlie Fish    8 年前

    问题是服务器位于cloudflare后面,cloudflare对每个上传请求都有大小限制。设置tus客户端将上传分块到多个请求中解决了这个问题。

    推荐文章