codememo

AJAX Post를 통해 파일 판독기 이진 데이터로 파일 입력 게시

tipmemo 2023. 8. 6. 10:06
반응형

AJAX Post를 통해 파일 판독기 이진 데이터로 파일 입력 게시

저는 HTML 파일 입력에 업로드된 첨부 파일을 Rest API를 통해 웹 페이지에 올리려고 합니다.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)
})

여러 가지 마임 작업을 하려면 이것이 필요합니다.종류, 그래서 위의 코드에서 선언하지 않았습니다.그러나 내용을 선언해 보았습니다..doc 파일에 대해 'application/msword'를 입력하고 processData:false 및 contentType:false를 시도했습니다.

데이터가 게시되어야 할 곳에 게시되고 있습니다.그러나 파일을 열 때 mimeType:application/x-empty with 빈 파일 또는 이진수가 여러 개 있는 파일이라는 메시지가 나타납니다..doc 파일과 pdf 파일을 시도해봤는데 결과는 둘 다 같습니다.

제가 이 일을 하기 위해 무엇을 바꿀 수 있는지 아는 사람 있나요?

간단하게 전송하기만 하면 됩니다.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_3

브라우저가 강제로 유니코드로 변환하고 지정된 대로 utf-8로 인코딩하여 이진 데이터가 손상되기 때문에 문자열(해당 문자열이 이진 데이터를 나타내더라도)을 보내는 것은 작동하지 않습니다.

데이터가 문자열인 경우 인코딩을 UTF-8로 합니다.

mime 유형을 "text/message; charset="로 지정합니다.UTF-8".

요청 엔터티 본문이 유니코드로 변환되고 UTF-8로 인코딩되도록 합니다.

전송 중file참조(blob) 다음 작업을 수행합니다.

데이터가 Blob인 경우 객체의 유형 특성이 빈 문자열이 아닌 경우 mime 유형을 값으로 지정합니다.

요청 엔터티 본문을 데이터로 나타내는 원시 데이터로 합니다.

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);
                }
            });
        });

언급URL : https://stackoverflow.com/questions/11399484/posting-file-input-as-filereader-binary-data-through-ajax-post

반응형