我如何执行可能根据服务器响应返回 blob 或文本字符串的 AJAX 调用?
我正在使用 AJAX 将用户提供的视频转换为音频 blob(用于 <audio>
标记)。转换过程工作正常,但视频总是有可能出现问题,在这种情况下,服务器将返回 HTTP 状态代码 500,并在响应正文中以明文形式返回错误消息。在这种情况下,我需要响应的明文,但尝试使用 responseText 会导致此错误消息:
Uncaught InvalidStateError: Failed to read the 'responseText' property from 'XMLHttpRequest': The value is only accessible if the object's 'responseType' is '' or 'text' (was 'blob').
这是我当前代码的简化版本:
function convertToAudio(file) {
var form = new FormData();
form.append("Video", file, file.name);
var request = new XMLHttpRequest();
request.onreadystatechange = function() {
if(request.readyState == 4 && request.status == 200) {
console.log(typeof request.response); // should be a blob
} else if(request.readyState == 4 && request.responseText != "") {
console.log(request.responseText);
}
};
request.open("POST", "video_to_audio", true);
request.responseType = "blob";
request.send(form);
}
我在我的代码中的其他地方使用了 jQuery(所以 jQuery 的答案是可以接受的),但据我所知,jQuery 不处理 blob。
最佳答案
设置readyState为2时的responseType。
在 readyState
达到 3 之前,可以随时更改 responseType
值。当 readyState
达到 2 时,您可以访问用于做出该决定的响应 header 。
更新的示例代码:
function convertToAudio(file) {
var form = new FormData();
form.append("Video", file, file.name);
var request = new XMLHttpRequest();
request.onreadystatechange = function() {
if(request.readyState == 4) {
if(request.status == 200) {
console.log(typeof request.response); // should be a blob
} else if(request.responseText != "") {
console.log(request.responseText);
}
} else if(request.readyState == 2) {
if(request.status == 200) {
request.responseType = "blob";
} else {
request.responseType = "text";
}
}
};
request.open("POST", "video_to_audio", true);
request.send(form);
}
关于javascript - 通过 AJAX 检索 blob 时处理错误消息,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29023509/