无法使用AJAX调用将上传的视频的Blob URL保存在后端服务器上

问题描述

我有一个网页，用户使用html的"input type = file"标签上传视频文件，我在JavaScript函数变量中捕获了该上传的视频文件，该文件以blob URL的形式出现."blob: https://www.myownsite.com:8080/2e8cfd32-abf2-4db3-b396-91f76cc3b40c ".我无法在我的系统中保存该Blob URL.

I have a web page where user uploads a video file using html's "input type = file" tag, I am catching that uploaded video file in JavaScript function variable where it is coming as blob URL. "blob:https://www.myownsite.com:8080/2e8cfd32-abf2-4db3-b396-91f76cc3b40c". I am not able to save this blob URL in my system.

HTML代码:

<input type="file" name="video_file_name" accept="video/*">
<input type="submit" value="Upload Video" id="customVideoSubmit">
<button onClick="postVideo();" id="customVideoSubmit" aria- hidden="true">Upload Video</button>

JavaScript代码:

JavaScript code:

function postVideo(){
 var blobURL = document.querySelector('video').src;
    $.ajax({
        type: 'POST',
        url: 'https://myapplication.com',
        data: { videoData : blobURL , mediafilename : fileName},
        contentType: 'application/json; charset=utf-8',
        dataType: 'json',
        success: function() {
            console.log("Video saved successfully.");
        }
    });
}

变量blobURL包含以下blob URL，如果我将其放在该浏览器的单独标签上，则该blob URL可以正常播放视频.

variable blobURL contains following blob URL, which plays video properly if I put this on a separate tab of that browser.

blob:https://www.myownsite.com:8080/2e8cfd32-abf2-4db3-b396-91f76cc3b40c

如何在我的系统中保存该Blob视频文件.我在Perl代码中尝试了许多JavaScript方法以及后端方法，例如?

How can I save this blob video file in my system. I have tried number of JavaScript methods and also back end methods in my Perl code like?

什么都没有.任何帮助将不胜感激.

Nothing worked though. Any help will be much appreciated.

推荐答案

一个 Blob URL 的生​​命周期与 Blob URL 所在的文档相关联代码>已创建.如果关闭了创建的文档，则先前创建的 Blob URL 应该被吊销，请参见 8.6.Blob网址的生命周期.

A Blob URLs lifetime is tied to the document where the Blob URL is created. If the document which created the Blob URL is closed the previously created Blob URL should be revoked, see 8.6. Lifetime of Blob URLs.

您可以将 Blob 或 File 对象本身进行 POST 到服务器；或将 File 设置为值；或 File 对象到服务器.

You can POST the Blob or File object itself to server Trying to Pass ToDataURL with over 524288 bytes Using Input Type Text; or a FormData object with File set as value Sending FormData with a binary data by using jQuery AJAX; or data URI representation of File object to server Upload multiple image using AJAX, PHP and jQuery.

这篇关于无法使用AJAX调用将上传的视频的Blob URL保存在后端服务器上的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！