使用Spring Boot Twilio Api在react js axios中的帖子正文中缺少必需的参数To

如何解决使用Spring Boot Twilio Api在react js axios中的帖子正文中缺少必需的参数To

我在执行Spring Boot发布Twilio Api时遇到问题。 通过Spring Boot执行时，Api可以正常工作。但是，当我使用axios将API集成到我的React js App上时，发生“在正文中缺少所需的参数To”错误。 我的春季启动Twilio sendOtpCode看起来像这样，并且在api上使用Swagger在春季启动中，此方法在api上完全可以正常工作：

 @Override
    public ResponseEntity<?> sendOtpCode(TwilioSendDto twilioSendDto) {
        Twilio.init(accountSid,authToken);
        Verification verification=Verification.creator("VAXXXXXXXXXXXXXXXX",twilioSendDto.getPhoneNumber(),"sms").create();

        return ResponseEntity.status(HttpStatus.OK).body(verification.getStatus());


    }

我的反应代码如下：

 sendOtpCode(phoneNumber,message){
    console.log("phone number",phoneNumber);
    return axios.post("http://localhost:8080/twilio",{
      method: 'POST',headers: {
      'content-type': 'application/json',},data:phoneNumber,}
   
    );

AuthService.sendOtpCode(this.state.contactno).then(response =>{
            this.setState({
              message: response.data.message,successful: true
            });

我听说过查询字符串的概念，但这也没有帮助我。

  sendOtpCode(phoneNumber,data:qs.stringify(phoneNumber),headers: {
        'content-type': 'application/x-www-form-urlencoded;charset=utf-8'
      }
    
    }
   
    );
    

  }

TwilioSendDto类

package com.saptasoch.ecommerce.model.dto.twilioDto;

public class TwilioSendDto {
    private String phoneNumber;

    public String getPhoneNumber() {
        return phoneNumber;
    }

    public void setPhoneNumber(String phoneNumber) {
        this.phoneNumber = phoneNumber;
    }
}

Twilio控制器：

ackage com.saptasoch.ecommerce.controller;

import com.saptasoch.ecommerce.model.dto.twilioDto.TwilioMessageDto;
import com.saptasoch.ecommerce.model.dto.twilioDto.TwilioSendDto;
import com.saptasoch.ecommerce.model.dto.twilioDto.TwilioVerifyDto;
import com.saptasoch.ecommerce.service.twilioService.TwilioService;
import io.swagger.annotations.Api;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.ResponseEntity;
import org.springframework.web.bind.annotation.*;

@RestController
@CrossOrigin(origins = "*",maxAge = 3600)
@RequestMapping("/twilio")
@Api(value = "/twilio",tags = "twilio",description = "Twilio service")
public class TwilioController {

    @Autowired
    TwilioService twilioService;

    @PostMapping
    ResponseEntity<?> sendOtpCode(@RequestBody TwilioSendDto twilioSendDto){
        return twilioService.sendOtpCode(twilioSendDto);
    }

   
}

解决方法

您传递给API的请求正文格式不正确。

axios.post("http://localhost:8080/twilio",{
        method: 'POST',headers: {
            'content-type': 'application/json',},data: {
            phoneNumber: phoneNumber
        }});

data应该是表示TwilioSendDto类的JSON。

,

这解决了我的问题。

 sendOtpCode(phoneNumber) {
    return axios
      .post("http://localhost:8080/twilio",{
        phoneNumber
        
      })
      
  }

这是我的错误，我不必要添加标题。