Блог

У меня есть приложение Spring, использующее Angularjs для интерфейса.

На интерфейсе я прочитал файл, который я кодирую с помощью Openpgpjs. После процесса шифрования я получаю объект Uint8Array, который я хочу сохранить в базе данных.

 // encoded_file is the Uint8Array
var file = new File(encoded_file, "my_image.png",{type:"image/png", lastModified:new Date()})

FileService.uploadFile(file).then(function(fileObject){
    console.log(fileObject); 
}).catch(function(error){
    toastrService.error(error, "Failed to upload file"); 
});


this.uploadFile=  function (file) {
    var defer = $q.defer();
    var fd = new FormData();
    fd.append('file', file);
    fd.append('auth', true);
    
    $http.post('/files/upload', fd, {
        transformRequest: angular.identity,
        headers: {'Content-Type': undefined}
    }).then(function (response) {
        if (response.data amp;amp; response.data.result){
            defer.resolve(response.data.entry);
        } else if(response.data) {
            defer.reject(response.data.message);
        } else {
            defer.reject();
        }
    }, function (error) {
        defer.reject(error);
    });
    
    return defer.promise;
};
 

Запрос принимается сервером после сохранения двоичных данных в БД

 @RequestMapping(method = RequestMethod.POST, value = "/upload")
public String uploadFile(@RequestParam("file") MultipartFile file,@RequestParam("auth") Optional<Boolean> auth) throws Exception {
       // save file.getBytes() in the DB and return a uniqueID to the file
}
 

Файл становится доступным в моем приложении через url /files/raw/id

 @RequestMapping(path = "/raw/{fileId}", method = RequestMethod.GET, produces = MediaType.APPLICATION_OCTET_STREAM_VALUE)
public @ResponseBody byte[] getRawFile(@PathVariable String fileId, HttpServletResponse response) throws Exception {
    File f = fileService.getFile(fileId);
    if (f == null) {
        return null;
    }

    return fileService.getFileContent(f);

}
 

У меня есть следующая функция для загрузки файла

 this.downloadFile=  function (guid) {
    var defer = $q.defer();
    var config = { responseType: 'arraybuffer' };
    $http.get('/files/raw/' guid, config).then(function (response) {
        console.log(response)
        if (response amp;amp; response.data){

           defer.resolve(response.data); 
        } else {
            defer.reject();
        }
    }, function (error) {
        defer.reject(error);
    });
    
    return defer.promise;
};
 

Проблема в том, что Uint8array, который я получаю при загрузке файла, отличается от того, который я загрузил.
Если я изменю тип ответа как текст. Число соответствует uint8array, который я загрузил, но как я могу исправить?

Я нашел проблему.

Я изменил код загружаемого файла следующим образом :

 // encoded_file is the Uint8Array
 var blob = new Blob([encoded_file.buffer], {type: $file.type});
 var file = new File([blob], $file.name);

FileService.uploadFile(file).then(function(fileObject){
    console.log(fileObject); 
}).catch(function(error){
    toastrService.error(error, "Failed to upload file"); 
});
 

и функция загрузки следующим образом :

 var fileReader = new FileReader();
fileReader.onload = function(event) {
      arrayBuffer = event.target.result;
};
fileReader.readAsArrayBuffer(file.data);
fileReader.onloadend = function (e) { 
     var data = new Uint8Array(arrayBuffer) 
                    
}