web-dev-qa-db-ja.com

AJAX PostによるFileReaderバイナリデータとしてのファイル入力の投稿

HTMLファイルにアップロードされた添付ファイルをREST APIを介してWebページに投稿しようとしています。 APIドキュメントには、投稿はHTTPリクエストの本文としてのストレートバイナリコンテンツであり、フォームファイルのアップロードではないことが記載されています。

私のコードは次のとおりです。

$('#_testButton').bind('click', function () {
    var file = document.getElementById('_testFile').files[0]
    var reader = new FileReader();
    reader.onload = function () {
        $.ajax({
            url: '/attachmentURL',
            type: 'POST',
            data: reader.result
        })
    }
    reader.readAsBinaryString(file)
})

さまざまなmimeTypeで機能するためにこれが必要なので、上記のコードでは宣言しませんでした。ただし、.docファイルに対してcontentType： 'application/msword'を宣言し、processData：falseおよびcontentType：falseを試しました。

データは必要な場所に投稿されています。しかし、ファイルを開くと、mimeType：application/x-empty with empty file OR a binary of a binary character..docを試しました。ファイルとpdfファイルの両方で結果は同じです。

この作品を作るために私が何を変更できるのか、誰にも手がかりがありますか？

jqueryajaxrestfilereader
26
Eric H.

file参照をデータとして送信するだけです（processData: false）少なくとも私のために仕事をした：

$('#_testButton').bind('click', function () {
    var file = document.getElementById('_testFile').files[0];

    $.ajax({
        url: "/attachmentURL",
        type: "POST",
        data: file,
        processData: false
    });
});

ここで説明されています： https://developer.mozilla.org/en/DOM/XMLHttpRequest/Sending_and_Receiving_Binary_Data#section_

ブラウザーが強制的にUnicodeに変換し、utf-8として 指定 としてエンコードするため、文字列の送信は（その文字列がバイナリデータを表す場合でも）機能しません。

データが文字列の場合エンコードをUTF-8にします。

MIMEタイプを「text/plain; charset = UTF-8」にします。

要求エンティティ本体をUnicodeに変換され、UTF-8としてエンコードされたデータとします。

file参照（blob）を送信すると、次のようになります。

データがBlobの場合オブジェクトのtype属性が空の文字列でない場合、mime typeをその値にします。

リクエストエンティティ本体をdataで表される生データとします。

34
Esailija

varファイル;

        $('#_testFile').on("change", function (e) {
            file = e.target.files[0];
        });
        $('#_testButton').click(function () {
            var serverUrl = '/attachmentURL';

            $.ajax({
                type: "POST",
                beforeSend: function (request) {
                    request.setRequestHeader("Content-Type", file.type);
                },
                url: serverUrl,
                data: file,
                processData: false,
                contentType: false,
                success: function (data) {
                    console.log("File available at: ", data);
                },
                error: function (data) {
                    var obj = jQuery.parseJSON(data);
                    alert(obj.error);
                }
            });
        });
1
masoud soroush