Axios 向springboot后端发布请求

Question

I'm trying to send a formData post request (using axios) to my backend (springboot) but I'm not sure of the proper way to do it. My plan is to pass the data through the controller to a service that will utilize it.

Axios call -

startStreamLocation() {
  const location = new FormData();
  location.set("accuracy", this.accuracy)
  location.set("lat", this.lat)
  location.set("lng", this.lng)
  location.set("timeStamp", this.timeStamp)

  axios.post("http://localhost:8080/api/v1/location/request-location", location,
      {headers: {'Content-Type': 'application/json'}})
},

Controller -

@PostMapping(value = "request-location")
public ResponseEntity<?> requestLocation() {

    connectionRequestService.addDataToStream();
    return new ResponseEntity<Authenticator.Success>(HttpStatus.OK);
}

Service -

   public void addDataToStream() {
        BasicAWSCredentials awsCredentials = new BasicAWSCredentials(awsAccessKey, awsSecretKey);
        AmazonKinesis kinesisClient = AmazonKinesisClient.builder()
                .withCredentials(new AWSStaticCredentialsProvider(awsCredentials))
                .withRegion(awsRegion)
                .build();

    PutRecordsRequest putRecordsRequest  = new PutRecordsRequest();
    putRecordsRequest.setStreamName("location-stream");
    List <PutRecordsRequestEntry> putRecordsRequestEntryList  = new ArrayList<>();
        PutRecordsRequestEntry putRecordsRequestEntry  = new PutRecordsRequestEntry();
        putRecordsRequestEntry.setData(ByteBuffer.wrap(( INJECT DATA HERE ).getBytes()));
        putRecordsRequestEntry.setPartitionKey(String.format("partitionKey-%d"));
        putRecordsRequestEntryList.add(putRecordsRequestEntry);

    putRecordsRequest.setRecords(putRecordsRequestEntryList);
    PutRecordsResult putRecordsResult  = kinesisClient.putRecords(putRecordsRequest);
    System.out.println("\nData sent successfully... \n" + putRecordsResult);
    try {
        Thread.sleep(1000);
    }
    catch (InterruptedException exception) {
        throw new RuntimeException(exception);
    }
}

Answer 1

Since you want to send form data to the server, you would need to change the Content-Type header in your Axios call to multipart/form-data . This helps the server understand the resource type being sent by the client.

On the server end, you'll want to read this form data. I can think of the following two ways to do that

1. Use @RequestParam to read individual form keys. For example, if my form data contains a key named Foo , I'd read it on the server end as this

    @PostMapping(value = "/form-data")
    public void readFormData( @RequestParam(value = "Foo") String foo )

2. Use @RequestBody to map the form data to a MultiValueMap which can be then read from like a normal map. Here's the code snippet for the same

    @PostMapping(value = "/form-data")
    public void readFormData( @RequestBody MultiValueMap<String,String> formData )