使用Angular6发布图像/文件(多部分)

时间:2018-09-24 15:04:38

标签: json angular http post multipartform-data

我尝试使用Angular6中的http.post发布图像。 请参阅下面的我的休息服务和组件。

服务

setOptions(data: boolean = false, headersToSet?: any): any {
    let token: string;
    const headers = [];

    token = JSON.parse(localStorage.getItem('SOSF_MANAGER_TOKEN'));
    // AUTHORIZATION
    headers['Authorization'] = 'Bearer ' + token;
    headers['Content-Type'] = data ? 'multipart/form-data' : 'application/json';
    // OTHER HEADERS
    if (headersToSet !== undefined) {
      for (const headerName of Object.keys(headersToSet)) {
        headers[headerName] = headersToSet[headerName];
      }
    }
    return { headers };
  }

  // POST
  postDb(url: string, body: any): Observable<any> {
    let options: any;

    options = this.setOptions(body instanceof FormData);
    url = this.url + url;
    if (!(body instanceof FormData)) {
      body = JSON.stringify(body);
    } else {
      // TO DO
    }
    console.log(body);

    if (environment.console_log_construct) {
      console.log(`POST : ${url}`);
    }
    return this.http.post(url, body, options).pipe(
      map(response => {
        return response;
      }, error => {
        console.error(`POST ERROR: ${url}`, error);
      }));
  }

组件

// Open Our formData Object
const formData = new FormData();
// Append our file to the formData object
formData.append('file', files[0]);
// POST
this.restService.postDb('files/images', formData)
  .subscribe(response => {});

如果body为formData时让JSON.stringify(body),则formdata设置为{}。但是,如果我让主体这样,它将抛出错误“未捕获的SyntaxError:JSON中位置1处的意外令牌o”。我该如何实现?

0 个答案:

没有答案