Загрузить файл на сервис RESTful в angularjs

Я пытаюсь сделать угловое приложение CRUD, которое немного похоже на "Dropbox". Таким образом, он должен иметь хостинг для файлов и папок с возможностью обмена и доступа. Я застрял на вопрос, как загрузить изображения и видео файлы? Я использовал File API (FileReader, Blob) для предварительного просмотра файлов на стороне клиента, но у меня нет идеи, как разместить этот тип данных на сервере.

Источник

2 ответа

Решение

Что-то вроде этого должно хорошо работать, чтобы отправить как multipart/form-data запросить бэкэнд API:

var file = ... // get from file input;
var backendUrl = ...
var fd = new FormData();

fd.append('myFile', file, 'filename.ext');

$http.post(backendUrl, fd, {
    // this cancels AngularJS normal serialization of request
    transformRequest: angular.identity,
    // this lets browser set `Content-Type: multipart/form-data` 
    // header and proper data boundary
    headers: {'Content-Type': undefined}
})

.success(function(){
    //file was uploaded
})

.error(function(){
    //something went wrong 
});

Смотрите здесь для справки:

Документ API FormData

Использование объектов FormData (MDN)

multipart-formdata загрузка файла с AngularJS

Источник

Вы можете загрузить файл, используя директивы ngFileUpload или angularFileUpload.

В случае angularFileUpload вы используете.upload в контроллере, а в случае ngFileUpload вы используете.http

Кроме того, вы можете также использовать тип содержимого application / x-www-form-urlencoded вместо multipart, если ваш файл не велик. В случае application / x-www-form-urlencoded вы можете просто получить значение в остальных веб-сервисах как обычный InputStream, тем самым не требуя упорядочения составных данных.

Ниже приведены возможные способы загрузки файла с помощью angular js и остальных веб-сервисов:

http://technoguider.com/2015/08/file-upload-using-angular-js-and-rest-web-service/

Источник
Другие вопросы по тегам