jQuery $.ajax 또는 $.load가 responseType arrayBuffer를 허용합니까?

jQuery $.ajax 또는 $.load가 responseType arrayBuffer를 허용합니까?

저는 웹 오디오 API를 시작하고 있는데 오디오 데이터를 수신하는 XML HttpRequest를 만들기 위해 jQuery의 $.ajax 또는 $.load 함수를 사용할 수 있는지 궁금합니다.$.ajax 또는 $.load 지원 응답 수행Type=arrayBuffer?

편집:

좋아요, 지금까지 제가 한 것은 다음과 같습니다.

function loadAudio() {
    $.ajax({
            url: sourceUrl
        }).done(function(response){
            return response;
        })
    }

어레이 버퍼를 반납해야 합니다응답을 ArrayBuffer로 변환하려면 어떻게 해야 합니까?

당신의 질문에 대해, jQuery는 아직 그것을 지원하지 않는 것 같습니다.아래 제가 제안한 대로 사용하기 전에, 기능이 사용 가능한지 확인하는 것을 고려해보세요.

XHTMLRequest를 사용하면 서버를 속이고 서버로부터 원하는 바이트를 나타내는 이진 문자열을 받을 수 있습니다.완벽하게 작동합니다.

var xhr = new XMLHttpRequest();
xhr.open('GET', '/your/audio/file.wav', true);

// Here is the hack
xhr.overrideMimeType('text/plain; charset=x-user-defined');

xhr.onreadystatechange = function(event) {
  if ( this.readyState == 4 && this.status == 200 ) {
    var binaryString = this.responseText;

    for (var i = 0, len = binaryString.length; i < len; ++i) {
      var c = binaryString.charCodeAt(i);
      var byte = c & 0xff; //it gives you the byte at i
      //Do your cool stuff...

    }
  }
};

xhr.send();

효과가 있고, 흔한 일이지만...그것은 여전히 해킹입니다.

XHTML Request Level 2를 사용하면 responseType을 'arraybuffer'로 지정하고 ArrayBuffer를 실제로 수신할 수 있습니다.그것이 훨씬 좋습니다.문제는 브라우저가 이 기능을 지원하는지 확인하는 것입니다.

var xhr = new XMLHttpRequest();
xhr.open('GET', '/your/audio/file.wav', true);
xhr.responseType = 'arraybuffer';

xhr.onload = function(e) {
  if (this.status == 200) {
    //Do your stuff here
  }
};

xhr.send();

내가 도와줬기를.

사실 jQuery와 native를 사용해서 이것을 하는 더 쉬운 방법이 있습니다.XMLHttpRequest사용할 필요 없이XMLHttpRequest플러그인을 사용해야 하므로 jQuery 스타일/syntax로 코딩할 수 있습니다.다음에 대한 옵션 중 하나$.ajax()가xhr, jQuery 문서에서는 다음과 같이 설명합니다(empassis mine).

xhr(default: ActiveXObject when available (IE), the XMLHttpRequest otherwise)

유형: 함수()

XMLHttpRequest 개체를 만들기 위한 콜백입니다.사용 가능한 경우 ActiveXObject(IE), 그렇지 않은 경우 XMLHttpRequest(HttpRequest)로 기본 설정됩니다.XMLHttpRequest 또는 향상된 기능을 공장에 자체적으로 구현하도록 재정의합니다.

그래서, 그 다음에.ArrayBuffer에 대한 답례로$.ajax()요청 사항은 다음과 같습니다.

var xhrOverride = new XMLHttpRequest();
xhrOverride.responseType = 'arraybuffer';

$.ajax({
    url: '/url/of/your/binary/data',
    method: 'GET',
    xhr: function() {
        return xhrOverride;
    }
}).then(function (responseData) {

    // responseData is an ArrayBuffer!

});

딜런의 대답을 이용했고 효과는 있었지만 결과적으로$.ajax요청은 더 이상 완전한 약속이 아닙니다(와 결합할 수 없습니다).Promise.all더 이상).대신에, 저는 그것을 사용함으로써 같은 것을 성취했습니다.xhrFields문서에서 설정합니다.

$.ajax({
    url: url,
    method: 'GET',
    xhrFields: { responseType: 'arraybuffer'}
})

저는 서버에서 (베이스64가 문자열로 인코딩되어 있음) ajax get json을 사용하여 string으로 데이터를 가져온 다음 클라이언트 측에서 base64로 디코딩한 다음 배열 버퍼로 데이터를 가져왔습니다.

샘플코드

function solution1(base64Data) {

var arrBuffer = base64ToArrayBuffer(base64Data);

// It is necessary to create a new blob object with mime-type explicitly set
// otherwise only Chrome works like it should
var newBlob = new Blob([arrBuffer], { type: "application/pdf" });

// IE doesn't allow using a blob object directly as link href
// instead it is necessary to use msSaveOrOpenBlob
if (window.navigator && window.navigator.msSaveOrOpenBlob) {
    window.navigator.msSaveOrOpenBlob(newBlob);
    return;
}

// For other browsers: 
// Create a link pointing to the ObjectURL containing the blob.
var data = window.URL.createObjectURL(newBlob);

var link = document.createElement('a');
document.body.appendChild(link); //required in FF, optional for Chrome
link.href = data;
link.download = "file.pdf";
link.click();
window.URL.revokeObjectURL(data);
link.remove();

}

function base64ToArrayBuffer(data) {
var binaryString = window.atob(data);
var binaryLen = binaryString.length;
var bytes = new Uint8Array(binaryLen);
for (var i = 0; i < binaryLen; i++) {
    var ascii = binaryString.charCodeAt(i);
    bytes[i] = ascii;
}
return bytes;

};

이를 위한 간단한 jQuery 확장자가 있습니다: https://github.com/vobruba-martin/jquery.ajax.arraybuffer

$.get("https://www.website.com/image.png", function(data)
{
    console.log("received data", data);
}, "arraybuffer");

언급URL : https://stackoverflow.com/questions/12394622/does-jquery-ajax-or-load-allow-for-responsetype-arraybuffer