Я хочу загрузить файл .zip на сервер (контроллер пружинного упора) из angular 4. Подскажите, пожалуйста, как это сделать?
заранее спасибо





1) Посмотрите здесь: https://angular.io/guide/http#making-a-post-request
Таким образом, вы можете создать службу, которая запускается, когда вы нажимаете кнопку отправки в форме, которая прикрепляет файл, что бы это ни было, zip, img или что-то еще, к запросу POST.
2) В своем шаблоне вы можете использовать что-то подобное:
<form>
<input type = "file" accept = ".zip,application/octet-stream,application/zip,application/x-zip,application/x-zip-compressed">
<input type = "submit">
</form>
3) Посмотрите здесь, чтобы принудительно расширить файл: https://www.hongkiat.com/blog/css3-attribute-selector/
После некоторого обучения я нашел ответ на вопрос, как загрузить файл (.zip / .txt / любой другой формат файла) из angular (4/5) в контроллер spring / rest. Записываю свое обучение ниже для тех, кто ищет то же самое. :)
Front-end кодирование:
<input type = "file" formControlName = "uploadFile" (change) = "uploadFileToServer($event)"/>
import { Component } from '@angular/core';
import { RequestOptions, Headers, Http } from '@angular/http';
@Component({
selector: 'file-uploader',
templateUrl: './uploadFile.component.html',
styleUrls: ['./uploadFile.component.css'],
})
export class FileUploadComponent {
public uploadFileToServer(event) {
let fileList: FileList = event.target.files;
if (fileList.length > 0) {
let file: File = fileList[0];
let formData: FormData = new FormData();
formData.append('uploadFile', file, file.name);
formData.append('fileType', 'zip');
let headers = new Headers();
headers.append('Accept', 'application/json');
let options = new RequestOptions({ headers: headers });
this.http.post('domain/urservice', formData, options)
.map(res => res.json())
.catch(error => Observable.throw(error))
.subscribe(
data => console.info('success'),
error => console.info(error)
)
}
}
}
(примечание - этот вызов связи с сервером должен присутствовать в какой-либо службе, а не в компоненте, но для простоты я пишу его в компоненте)
кодирование на стороне сервера ::
@RequestMapping(value = "/urservice", method = RequestMethod.POST)
public void uploadFile(MultipartHttpServletRequest request) throws IOException {
Iterator<String> itr = request.getFileNames();
// directory to save file
String tempDir = System.getProperty("jboss.server.temp.dir");
MultipartFile file = request.getFile(itr.next());
String fileType = request.getParameter("fileType");
String fileName = file.getOriginalFilename();
File dir = new File(tempDir);
File fileToImport = null;
if (dir.isDirectory()) {
try {
fileToImport = new File(dir + File.separator + fileName);
BufferedOutputStream stream = new BufferedOutputStream(new FileOutputStream(fileToImport));
stream.write(file.getBytes());
stream.close();
} catch (Exception e) {
logger.error("Got error in uploading file.");
}
}
Спасибо, очень полезный ответ