将 JSON 转换为 multipart/form-data angular/ionic

convert JSON to multipart/form-data angular/ionic

当我发送 POST 请求表单 POSTMAN 并得到正确的响应时

这是 Form-Data Body 邮递员 POST 的请求。

ENDPOINT : https://cholas.in/wp-json/digits/v1/send_otp

当我从 POSTMAN 发送 POST 请求并收到错误响应时

JSONBody请求

Content-Type : multipart/form-data;

Content-Type : multipart/form-data; header 与 json body :

Angular 和 IONIC 代码当我发送 post 请求时

    const formData = new FormData();
    let httpOptions = {
        headers: new HttpHeaders({
            'Content-Type': 'multipart/form-data; charset=UTF-8'
        })
    };
  
    
    formData.append('countrycode',this.formSMS.countrycode);
    formData.append('mobileNo',this.formSMS.mobileNo);
    formData.append('type',this.formSMS.type);
    formData.append('whatsapp',this.formSMS.whatsapp);
    // rest data to the form.
    //Object.keys(restObj).forEach(key => {
    //  formData.append(key, restObj[key]);
    //});
    console.log(formData);
    // Send it.
    return this.http.post(Url, formData, httpOptions)
      .toPromise()
      .catch((e) => {
          console.log(e);
        // handle me
      });

但是我得到了我不想要的错误响应。

注意:OTP 提供商文档注意:请求应作为 Body

中的 POST 参数发送

在 IONIC/ANGULAR/POSTMAN(JSON 类型)中什么是正确的,以得到我作为 POSTMAN 第一个屏幕截图获得的正确反应?

您不需要在 post 数据中传递 httpOptions,因为您传递的是表单数据 angular 会为您处理

const formData = new FormData();
    let httpOptions = {
        headers: new HttpHeaders({
            'Content-Type': 'multipart/form-data; charset=UTF-8'
        })
    };
  
    
    formData.append('countrycode',this.formSMS.countrycode);
    formData.append('mobileNo',this.formSMS.mobileNo);
    formData.append('type',this.formSMS.type);
    formData.append('whatsapp',this.formSMS.whatsapp);
    // rest data to the form.
    //Object.keys(restObj).forEach(key => {
    //  formData.append(key, restObj[key]);
    //});
    console.log(formData);
    // Send it.
    return this.http.post(Url, formData)
      .toPromise()
      .catch((e) => {
          console.log(e);
        // handle me
      });

下面stackbliz包含解决方法请参考 https://stackblitz.com/edit/angular-http-get-examples-f28x9u?file=app%2Fapp.component.ts