YouTube上传API和Cordova/phonegap [英] Youtube upload API and cordova / phonegap

问题描述

我正在编写一个cordova应用，该应用可以使用户录制视频并将其通过其api上传到youtube.

I am writing a cordova app that lets the user record a video and upload it to youtube via their api.

如果我使用文件输入并通过来访问文件

If I use a file input and access the file via

$('#file').get(0).files[0]

我收到了一个file对象，该对象可以毫无问题地上传.

I receive a file object which is able to uploaded without a problem.

如果我录制视频，则会收到一个媒体列表对象. 然后，我可以拨打window.resolveLocalFileSystemURL( video[0].localURL , success, fail);

If I record a video I receive a medialist object. I can then call window.resolveLocalFileSystemURL( video[0].localURL , success, fail);

在成功回调中，我收到一个文件列表对象.哪些也不会被接受.

On the success callback I receive a filelist object. Which also will not be accepted.

在这个filelist对象上，我可以调用data.file(success,fail)，它最终向我返回了一个文件对象.但是，当尝试上传到youtube时，出现了308错误.

On this filelistobject I can call data.file(success,fail) which finally returns me a file object. But when trying to upload to youtube I am getting a 308 error.

我怀疑这与访问本地文件路径的权限有关.如果有人对此有经验，我很想听听解决这个问题的方法.

I suspect it has to do with permissions of accessing the local file path. If anyone has experience with this I would love to hear a way around it.

这是上传代码:

UploadVideo.prototype.ready = function(accessToken, video) {
    this.accessToken = accessToken;
    this.gapi = gapi;
    this.authenticated = true;
    $this = this;

function result(data){
    function success(data){

        data.name = "VID_20150329_160037.mp4";
        console.log(data)
        $this.uploadFile( data );
    }
    data.file(success)

}
function fail(data){
    console.log(data)
}
window.resolveLocalFileSystemURL( video[0].localURL , result, fail);


//this.uploadFile( $('#file').get(0).files[0] );

// $('#button').on("click", this.handleUploadClicked.bind(this));

推荐答案

使用此博客，我设法使元数据和文件上传正常进行: http://lithostech.com/2013/10/upload- google-youtube-api-v3-cors/

Using this blogpost I managed to get metadata and file upload working: http://lithostech.com/2013/10/upload-google-youtube-api-v3-cors/

通过在发送文件传输头信息之前注销它，我可以看到格式是不同的:

By logging out the FileTransfer header information before it was sent, I could see the format was different:

Content-Disposition: form-data; name="part"
{"snippet":{"title":"Video title","description":"Video description","tags":"Video tags","categoryId":22},"status":{"privacyStatus":"unlisted"}}

应该是:

Content-Disposition: form-data; name=""; filename="file.json"
Content-Type: application/json
{"snippet":{"title":"Video title","description":"Video description","tags":"Video tags","categoryId":22},"status":{"privacyStatus":"unlisted"}}

这是一个更新的版本，其中包含有效的元数据:

Here is an updated version including working metadata:

function uploadVideo(fileURL) {
    var options = new FileUploadOptions();
    options.fileKey = 'file';
    options.fileName = fileURL.substr(fileURL.lastIndexOf('/') + 1);
    options.mimeType = 'video/mpg';
    options.chunkedMode = false;
    options.headers = {
        Authorization: 'Bearer ' + accessToken
    };
    options.params = {
        "": {
            snippet: {
                title: 'Video title',
                description: 'Video description',
                tags: 'Video tags',
                categoryId: 22
            },
            status: {
                privacyStatus: 'unlisted'
            }
        }
    };
    var ft = new FileTransfer();
    ft.upload(fileURL, 'https://www.googleapis.com/upload/youtube/v3/videos?part=snippet,status', function (data) {
        console.log('upload success', data);
    }, function (e) {
        console.log('upload error', e);
    }, options, true);
    ft.onprogress = function (progressEvent) {
        console.log('onprogress: ' + ((progressEvent.loaded / progressEvent.total) * 100) + '%');
    };
}

请注意，我也略微修改了FileTransfer插件:

note that I modified my FileTransfer plugin slightly too:

FileTransfer.java 第374-376行

FileTransfer.java lines 374 - 376

beforeData.append("Content-Disposition: form-data; name=\"").append(key.toString()).append("\";");
beforeData.append(" filename=\"").append("file.json").append('"').append(LINE_END);
beforeData.append("Content-Type: ").append("application/json").append(LINE_END).append(LINE_END);

在cordova/phonegap/ionic中修改插件后，您需要重新加载它.我通过删除平台并再次添加来做到这一点:

After modifying a plugin in cordova/phonegap/ionic you will need to reload it. I do this by removing the platform and adding it again:

cordova platform remove android; cordova platform add android;

这篇关于YouTube上传API和Cordova/phonegap的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！