Chrome WebKitBlobBuilder가 데이터를 추가하지 않습니다.

Question

아약스 요청을 통해 파일 업로드 기능을 일부 구현하고 있습니다. 하나의 아약스 호출에서 여러 파일을 보낼 수 있기를 바란다. 그래서 FormData를 사용하기로 결정했다.

내 바이너리 데이터 문자열을 직접 FormData에 추가하려고 시도했지만 작동하지만 Content-Disposition에는 파일 이름 특성이 없습니다. Content-Disposition : form-data;

W3C 내가 그 속성을 가지고 (또는 FormData.append()의 3 속성을 설정할 수 있도록)

i를 formdata에 Blob 오브젝트를 추가 할 필요가 있다고 = "파일 1"을 이름

function uploadAsBinary() { 
    var xhr = new XMLHttpRequest(); 
    var fd = new FormData(); 

    window.BlobBuilder = window.BlobBuilder || window.WebKitBlobBuilder || window.MozBlobBuilder; 
    var bb = new window.BlobBuilder(); 
    bb.append("this is my binary content"); 
    var blob = bb.getBlob("text/plain"); 

    fd.append("file1", blob, "file1"); 

    xhr.open("POST", "/mb/0/", false); 
    xhr.send(fd); 
} 

그것은 파이어 폭스와 완벽하게 잘 작동하지만 구글 크롬 (V16과 V17)로 요청 페이로드가 콘텐츠없이 formdata입니다 :

------WebKitFormBoundaryVkgESMAGtmPMlPZ7 
Content-Disposition: form-data; name="file1"; filename="file1" 
Content-Type: text/plain 


------WebKitFormBoundaryVkgESMAGtmPMlPZ7-- 

는 다음과 같은 코드를 작성 나는 또한 같은 결과를 ArrayBuffer를 통해 얼룩을 채우기 위해 노력했다. 나는 지금 2 일 동안 웹 서핑을 해왔다. 나는 대답을 찾지 못했다. 나는 android (http://code.google.com/p/android/issues/detail?id=22441)에서 열린 이슈를 발견했지만 꽤 죽은 것처럼 보입니다.

이 것이 실제 Chrome 문제입니까? 누군가가 이것에 대한 단서를 가지고 있습니까, 아니면 크롬 추적기에 문제를 열어야합니까?

도움을 받으려면 Thx!

window.BlobBuilder = window.BlobBuilder || window.WebKitBlobBuilder || 
       window.MozBlobBuilder || window.MSBlobBuilder; 
window.URL = window.URL || window.webkitURL; 

var bb = new BlobBuilder(); 
bb.append('body { color: red; }'); 
var blob = bb.getBlob('text/css'); 

var link = document.createElement('link'); 
link.rel = 'stylesheet'; 
link.href = window.URL.createObjectURL(blob); 

document.body.appendChild(link); 

물방울() :

여기에 솔루션을 찾고있는 사람들을위한

Answer 1

문제가 explained here

BlobBuilder()와 같은 물방울()보다는 BlobBuilder()에 스위치는 다음과 같습니다

window.URL = window.URL || window.webkitURL; 

var blob = new Blob(['body { color: red; }'], {type: 'text/css'}); 

var link = document.createElement('link'); 
link.rel = 'stylesheet'; 
link.href = window.URL.createObjectURL(blob); 
document.body.appendChild(link); 

Answer 2

TL; DR Chrome 개발 도구가 데이터 페이로드 미리보기의 파일 데이터를 클립으로 표시합니다. BlobBuilder에서 Blob으로 전환하면 문제가 해결되지만 페이로드 미리보기에는 파일 데이터가 표시되지 않습니다. 그것은 당신이 게시 한 것과 똑같이 보일 것입니다 (분명히 비어 있음).

당신이 묘사하는 증상은기만적인 행위입니다. 비슷한 문제가 생겼다. (잘못된 오버로드로 인해 발생했다. Content-Type,하지만 나는 빗나가 다.)

문제가 해결되면 Chrome 개발 도구에 일반 키/값 데이터가 표시되지만 파일 데이터는 표시되지 않는 것으로 나타났습니다. 파일 데이터하지 않는 반면은 "일반"데이터 uploadType=media가 나타

------WebKitFormBoundaryHyzYwSEV4FAfvi02 
Content-Disposition: form-data; name="uploadType" 

media 
------WebKitFormBoundaryHyzYwSEV4FAfvi02 
Content-Disposition: form-data; name="fileupload"; filename="blob" 
Content-Type: application/zip 


------WebKitFormBoundaryHyzYwSEV4FAfvi02-- 

주의 사항 : 큰 파일을 업로드 할 때, 나는 이런 식으로 뭔가를 얻을 것입니다. 파일이 올바르게 업로드되었다는 것을 확인하는 유일한 방법은 요청 완료 후 요청 헤더 에서 Chrome 개발 도구의 네트워크 탭을 확인하는 것입니다 (). 그것은 content-length: 1023235을 보여 주었고, 아마도 비어있는 파일 페이로드보다 훨씬 큽니다.