Multipart / form-данные в Angular 8 Загрузить - PullRequest
Новая
       33

Multipart / form-данные в Angular 8 Загрузить

0 голосов
/ 25 октября 2019

Я пытаюсь создать приложение Angular 8, которое будет загружать CSV в веб-API для обработки.

файл contact.component.html: 

CSV File: <input type="file" (change)="fileChange($event)" placeholder="Upload file" accept="*.csv" /><br /><br />

contact.componentФайл .ts: 

fileChange(event) {
        const fileList: FileList = event.target.files;
        if (fileList.length > 0) {
            const file: File = fileList[0];
            const formData: FormData = new FormData();
            formData.append('uploadFile', file, file.name);
            this.criContactsService.upload(formData)
                .subscribe((res: any) => {
                    this.toaster.showToast('success', 'Saved', 'CSV has been uploaded.');
                    setTimeout(() => {
                        this.router.navigateByUrl('/pages/community-resources');
                    }, 4000);
                },
                error => {
                    this.logger.error(error);
                    this.toaster.showToast('error', 'Error', error);
                },
            );
        }
    }

файл cri-contacts.service.ts: 

import { Injectable, Inject } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Observable } from 'rxjs';
import { environment } from './../../../environments/environment';
import { ICRIContact } from './../interfaces/cri-contact.interface';

@Injectable()
export class CRIContactsService {

    constructor(private http: HttpClient) { }

    getAll(): Observable<Array<ICRIContact>> {
        return this.http.get<Array<ICRIContact>>(`${environment.apiEndpoint}/cricontacts`);
    }
    download() {
        return this.http.get(`${environment.apiEndpoint}/cricontacts/download`, { responseType: 'text' });
    }
  upload(param: any) {
        return this.http.post(`${environment.apiEndpoint}/cricontacts/upload`, param);
    }
}

Код сервера: 

[Route("api/cricontacts/upload")]
        [HttpPost]
        public async Task<IHttpActionResult> Upload()
        {
            //Check if user has permission for this operation
            Enums.Role role = JwtManager.GetRole(Request);
            if (role != Enums.Role.SuperAdmin)
            {
                return Unauthorized();
            }

            if (!Request.Content.IsMimeMultipartContent()) //Request.Content.IsMimeMultipartContent() always returns false
            {
                return BadRequest(); //Always returns this, BadRequest()
            }
            //Rest of the code isn't relevant

Что я ожидаю, так это файлбыть загруженным и получить 200 ответ. Тем не менее, я получаю 400 ответ о плохой просьбе. Эта строка в коде сервера 

Request.Content.IsMimeMultipartContent()

всегда возвращает false. Я думал, что при использовании FormData в Angular тип mime будет multipart / form-data. Я ценю любые предложения.

...