javascript - 从父选项卡读取变量

Question

我正在尝试在用户浏览我的网络应用程序的同时上传视频。

为此，我尝试在后台打开一个新选项卡，其中包含一个简单的页面，其中包含一个新的 javascript 库，该库仅上传视频并传递其所需的所有参数。

现在所有内容都在 1 个库中，因此我看不到如何创建我正在寻找的新线程。

下面我粘贴了我正在使用的代码:

var blob;

function xhr(url, data, callback) {
    'use strict';

    var request = new XMLHttpRequest();
    request.onreadystatechange = function () {
        if (request.readyState === 4 && request.status === 200) {
            callback(request.responseText);
        }
    };
    request.open('POST', url);
    request.send(data);
}

function sendVideo(name, path) {
    'use strict';

    var formData = new FormData();

    formData.append('filename', name + '.webm');
    formData.append('video', blob);
    formData.append('title', $('.title').val());
    formData.append('tag1', $('#tag1').val());

    if ($('#tag2').val()) {
        formData.append('tag2', $('#tag2').val());
    }

    if ($('#tag3').val()) {
        formData.append('tag3', $('#tag3').val());
    }

    xhr(path, formData, function (fName) {
        if (fName === 'success') {
            window.alert('Your video has been succesfully uploaded');
        } else {
            window.console.log(fName);
        }
    });
}

<div onclick="sendVideo(1, 'test');">Send</div>

此外，我愿意接受有关解决此问题的不同方法的新建议。

感谢您的建议。

Answer 1

它似乎非常适合网络 worker 。

Web Workers 是 HTML5 中的一个相当新的工具，它允许您在页面上“使用”多线程。

我使用它们在后台完成大文件加载。

查看 Eric Bidelman 撰写的关于该主题的精彩文章以获取更多信息: http://www.html5rocks.com/en/tutorials/file/filesystem-sync/