FormDataでバイナリをpostしたい
自動化のスクリプトを作っています。
目的のサイトでバイナリファイルを手作業でアップロードすると、Chromeのコンソールのnetworkから送られたFormDataを見るとfile: (binary)となっています。FormDataでbinaryと認識されるにはどうしたら良いでしょうか?
Blobでは中身は取り出せないのでFaileReaderで中身を読んで、特定の型付き配列で送信する?と思い以下を試しましたがだめでした。file: [Object object]になってしまいます。
xhr.responseType = 'blob'
xhr.onload = () => {
let fr = new FileReader()
fr.onload = e=> {
let ab = new ArrayBuffer(fr.response)
new Uint8Array(ab)//post
}
fr.readAsArrayBuffer(xhr.response)
}
https://developer.mozilla.org/ja/docs/XMLHttpRequest/Sending_and_Receiving_Binary_Data
上記には
Blob オブジェクトはファイルに似たオブジェクトで、immutable な生データです。データを表す blob は必ずしも
JavaScript ネイティブなフォーマットではありません。
とあったのでblobオブジェクトのまま送ってみたりもしましたが、file: [Object object]になってしまい、バイナリの生データとして送信できません。ご存知でしたらご教示いただければ幸いです。
質問追記
送信時にnew Blob([data], {type: image/png})とすることで、開発ツール>Network>Headers>FormDataのView parsedの値はfile: [object Object]からfile: (binary)にすることができました。が、View sourceを見ると
------WebKitFormBoundaryuGkybuBnzAfvgUoP
Content-Disposition: form-data; name="file"; filename="blob"
Content-Type: image/png[object Object]
となっており、手作業でやった場合[object Object]がないという違いがあります。これはどういうことでしょうか?返ってきたエラーもjpg,pngのみとありるので、これが原因だと思います。ご教示いただければ幸いです。
上記の結果が得られたコードは以下です。
let xhr = new XMLHttpRequest()
xhr.responseType = 'blob'
xhr.onload = () => {
let fd = new FormData()
fd.append('file', new Blob([xhr.response], {type : 'image/png'}))
$.ajax({
type : 'POST',
url : url
data : fd,
processData : false,
contentType : false
})
.done(data => {
console.log(data)
})
.fail((a,b,c) => {
console.log(a,b,c)
})
}
xhr.open('GET', imgs[i], true)
xhr.send()