Home > database >  Pass json data to spring boot backend
Pass json data to spring boot backend

Time:09-15

I am completly new to spring boot. I am now trying to pass a registration form data(json format) from vue frontend to spring boot backend, but the backend always show the receiving data is null. How should I correctly receive the data?

RegistrationController.java

package com.example.demo.controller;

import com.example.demo.result.Result;
import com.example.demo.pojo.newUser;

import java.util.Map;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;


@Controller
public class RegistrationController {
    @CrossOrigin
    @PostMapping(value = "api/registration")
    public Result registration(@RequestBody newUser requestUser) {
        String CompanyName = requestUser.getCompanyName();
        System.out.println("###CompanyName: "  CompanyName);
        return new Result(200);
    }
}

newUser.java

package com.example.demo.pojo;

public class newUser {
    String CompanyName;
    String ChiCompanyName;
    String RegisteredAddress;
    String CorrespondenceAddress;
    String Certificate;
    String CertificateNumber;
    String LIAISON_OFFICER_NAME;
    String Title;
    String Email;
    String LIAISON_OFFICER_TEL_NO;
    String LIAISON_OFFICER_MOB_NO;
    String SYS_USER_FIRST;
    String SYS_USER_SECOND;
    String SYS_USER_THIRD;
    String D_ACCT_IND;
    String D_SYS_USER_FIRST;
    String D_SYS_USER_SECOND;
    String D_SYS_USER_THIRD;
    String BRC_FILE_CONTENT;

    public String getCompanyName() {
        return CompanyName;
    }

    public void setChiCompanyName(String ChiCompanyName) {
        this.ChiCompanyName = ChiCompanyName;
    }

    public String getChiCompanyName() {
        return CompanyName;
    }

    public void setRegisteredAddress(String RegisteredAddress) {
        this.RegisteredAddress = RegisteredAddress;
    }
    
    public String getRegisteredAddress() {
        return RegisteredAddress;
    }

    public void setCorrespondenceAddress(String CorrespondenceAddress) {
        this.CorrespondenceAddress = CorrespondenceAddress;
    }
    
    public String getCorrespondenceAddress() {
        return CorrespondenceAddress;
    }

    public void setCertificate(String Certificate) {
        this.Certificate = Certificate;
    }
    
    public String getCertificate() {
        return Certificate;
    }

    public void setCertificateNumber(String CertificateNumber) {
        this.CertificateNumber = CertificateNumber;
    }
    
    public String getCertificateNumber() {
        return CertificateNumber;
    }

    public void setLIAISON_OFFICER_NAME(String LIAISON_OFFICER_NAME) {
        this.LIAISON_OFFICER_NAME = LIAISON_OFFICER_NAME;
    }
    
    public String getLIAISON_OFFICER_NAME() {
        return LIAISON_OFFICER_NAME;
    }

    public void setTitle(String Title) {
        this.Title = Title;
    }
    
    public String getTitle() {
        return Title;
    }

    public void setEmail(String Email) {
        this.Email = Email;
    }
    
    public String getLIAISON_OFFICER_TEL_NO() {
        return LIAISON_OFFICER_TEL_NO;
    }

    public void setLIAISON_OFFICER_TEL_NO(String LIAISON_OFFICER_TEL_NO) {
        this.LIAISON_OFFICER_TEL_NO = LIAISON_OFFICER_TEL_NO;
    }
    
    public String getLIAISON_OFFICER_MOB_NO() {
        return LIAISON_OFFICER_MOB_NO;
    }

    public void setLIAISON_OFFICER_MOB_NO(String LIAISON_OFFICER_MOB_NO) {
        this.LIAISON_OFFICER_MOB_NO = LIAISON_OFFICER_MOB_NO;
    }
    
    public String getSYS_USER_FIRST() {
        return SYS_USER_FIRST;
    }

    public void setSYS_USER_FIRST(String SYS_USER_FIRST) {
        this.SYS_USER_FIRST = SYS_USER_FIRST;
    }
    
    public String getSYS_USER_SECOND() {
        return SYS_USER_SECOND;
    }

    public void setSYS_USER_SECOND(String SYS_USER_SECOND) {
        this.SYS_USER_SECOND = SYS_USER_SECOND;
    }
    
    public String getSYS_USER_THIRD() {
        return SYS_USER_THIRD;
    }

    public void setD_ACCT_IND(String D_ACCT_IND) {
        this.D_ACCT_IND = D_ACCT_IND;
    }
    
    public String getD_ACCT_IND() {
        return D_ACCT_IND;
    }

    public void setD_SYS_USER_FIRST(String D_SYS_USER_FIRST) {
        this.D_SYS_USER_FIRST = D_SYS_USER_FIRST;
    }
    
    public String getD_SYS_USER_FIRST() {
        return D_SYS_USER_FIRST;
    }

    public void setD_SYS_USER_SECOND(String D_SYS_USER_SECOND) {
        this.D_SYS_USER_SECOND = D_SYS_USER_SECOND;
    }
    
    public String getD_SYS_USER_THIRD() {
        return D_SYS_USER_THIRD;
    }

    public void setD_SYS_USER_THIRD(String D_SYS_USER_THIRD) {
        this.D_SYS_USER_THIRD = D_SYS_USER_THIRD;
    }
    
    public String getBRC_FILE_CONTENT() {
        return BRC_FILE_CONTENT;
    }

    public void setBRC_FILE_CONTENT(String BRC_FILE_CONTENT) {
        this.BRC_FILE_CONTENT = BRC_FILE_CONTENT;
    }
    
    


}

Registration.vue

<template>
  <div  id="regAuth">
    <h3>New User Registration</h3>
    <Form @submit="onSubmit" :validation-schema="schema">
      <span >* </span><span >This is a mandatory field and data must be provided.</span>

      <div >
        <span >Company Name <span >*</span></span>
        <Field name="CompanyName" />
        <ErrorMessage name="CompanyName" />
      </div>

      <div >
        <label>Company Name [Chinese]</label>
        <Field name="ChiCompanyName" type="ChiCompanyName" />
        <ErrorMessage name="ChiCompanyName" />
        <br>
        <span ><span >(Please input the company name as shown on the certificate of incorporation for "Limited Company")</span></span>

      </div>

      <div >
        <span >Registered Address <span >*</span></span>
        <Field name="RegisteredAddress" type="RegisteredAddress"  maxlength="40"/>
        <Field name="RegisteredAddress" type="RegisteredAddress"  maxlength="40"/>
        <Field name="RegisteredAddress" type="RegisteredAddress"  maxlength="40"/>
        <Field name="RegisteredAddress" type="RegisteredAddress"  maxlength="40"/>
       <ErrorMessage name="RegisteredAddress" />
      </div>
      <div >
        <span ><span >If Correspondence Address is the same as the Registered Address, please leave the Correspondence Address fields blank.</span></span><br>
        <span >Correspondence Address</span>
        <Field name="CorrespondenceAddress" type="text"  size="41" maxlength="40" />
        <Field name="CorrespondenceAddress" type="text"  size="41" maxlength="40" />
        <Field name="CorrespondenceAddress" type="text"  size="41" maxlength="40" />
        <Field name="CorrespondenceAddress" type="text"  size="41" maxlength="40" />
      </div> 
      <span >Does your company have Inland Revenue Department Business Registration Certificate? <span >*</span></span>     
      

        <Field  name="Certificate" type="radio" value="yes" /> 
        <label for="yes">&nbsp;yes&nbsp;</label> 
        <Field  name="Certificate" type="radio" value="no" /> 
        <label for="no">&nbsp;no&nbsp;</label>
          
      <br>
      <ErrorMessage name="Certificate" />
      
      <div >
        <span >Business Registration Certificate No.  </span>
        <Field  maxlength="8" size="9" name="CertificateNumber" type="Text" value="" />
        <!--
        - 
        <Field  maxlength="3" size="4" name="CertificateNumber" type="Text" value="" />
        - 
        <Field  maxlength="2" size="3" name="CertificateNumber" type="Text" value="" /> 
        - 
        <Field  maxlength="2" size="3" name="CertificateNumber" type="Text" value="" />
        - 
        <Field  maxlength="1" size="2" name="CertificateNumber" type="Text" value="" />-->
        <ErrorMessage name="CertificateNumber" />
      </div>      
      
      <div >
        <div >Liaison Officer</div>
        
      </div>     
       


      <div >
        <span >Name <span >*</span></span>
        <Field name="LIAISON_OFFICER_NAME" type="text"  size="41" maxlength="40" value="" />
      </div>      

      <div >
        <span >Title <span >*</span></span>
        <Field name="Title" as="select" >
          <option value="Mr">Mr</option>
          <option value="Mrs">Mrs</option>
          <option value="Ms">Ms</option>
        </Field>
        <ErrorMessage name="Title" />
      </div>      
      <div >
        <span >Email Address <span >*</span></span>
        <Field name="Email" type="form-control"  size="41" maxlength="50" value="" />
        <ErrorMessage name="Email" />
      </div>      
      <div >
        <span >Telephone No.</span>
        <Field name="LIAISON_OFFICER_TEL_NO" type="text"  size="21" maxlength="20" value="" />
      </div>      
      <div >
        <span >Mobile No.</span>
        <Field name="LIAISON_OFFICER_MOB_NO" type="text"  size="21" maxlength="20" value="" />
      </div>
      <div >
        <span ><span >Please enter 3 choices for login username:</span></span>
        <br>
        <span >First Choice <span >*</span></span>
        <Field  name="SYS_USER_FIRST" type="text"  size="21" maxlength="20" value="" />
        <ErrorMessage name="SYS_USER_FIRST" />
        <br>
        <span >Second Choice <span >*</span></span>
        <Field  name="SYS_USER_SECOND" type="text"  size="21" maxlength="20" value="" />
        <ErrorMessage name="SYS_USER_SECOND" />
        <br>
        <span >Third Choice <span >*</span></span>
        <Field  name="SYS_USER_THIRD" type="text"  size="21" maxlength="20" value="" />
        <ErrorMessage name="SYS_USER_THIRD" />
      </div>

      <div >
        <a name="Data_Entry_Officer"><div >Data Entry Officer</div></a>
        <span ><span >
          The Data Entry Officer account will be able to input your company's
          corporate, financial, and technical information.  The information
          input by this account should be approved by the Liaison officer.
        </span></span>
        <span >
          <br>
        <Field name="D_ACCT_IND"  type="checkbox" value="Y" />   Please tick if you would like to obtain an account for data entry officer
        </span>
      </div>

      <div >
        <span ><span >Please enter 3 choices for login username:</span></span>
        <br>
        <span >First Choice</span>
        <Field  name="D_SYS_USER_FIRST" type="text"  size="21" maxlength="20" value="" />
        <span >Second Choice</span>
        <Field  name="D_SYS_USER_SECOND" type="text"  size="21" maxlength="20" value="" />
        <span >Third Choice</span>
        <Field  name="D_SYS_USER_THIRD" type="text"  size="21" maxlength="20" value="" />
      </div>

      <div >
        <a name="Supporting_Document"><div >Supporting Document</div></a>
        <span >
          Please provide the following information
        </span>
      </div>

      <div >
        <span ><span >1. Copy of Business Registration Certificate </span></span>
        <br>
        <span >File&nbsp;attached    </span>
        <Field type="file"  name="BRC_FILE_CONTENT" size="35" value="" />
      </div>

        <button  type="submit">Submit</button>
    </Form>
  </div>
</template>

<script>
import axios from 'axios'

  export default {
    data(){
      return{

      }
    },
    methods: {
      onSubmit(values) {
        axios.post('registration', values)
        .then(successResponse => {
          console.log(successResponse.data.code)
          console.log(values)
            if (successResponse.data.code === 200) {
              alert("application success")
              this.$router.replace({name: 'home'})
            }
            else{
              alert("application failed")
            }
          })
          .catch(failResponse => {
            console.log(failResponse)
          })

      }
    }
  }
</script>

console.log of registration form data

But in my spring boot backend terminal it shows: ###userInfo: null

edit: I wrote a getter and a setter for CompanyName to test, but it still show null

@PostMapping(value = "api/registration")
    public Result registration(@RequestBody newUser user) {
        System.out.println("###CompanyName: "  user.getCompanyName());
        return new Result(200);
    }

CodePudding user response:

In vue form code not found about newUser and userInfo.

CodePudding user response:

Try logging your json object before you send it, from there make sure the field name can be mapped to your request dto pojo class, spring boot serialize json object with camel case strategy so if your json body is different, spring will not be able to parse the json body into your pojo class.

  • Related