com.faster xml .jackson.core.JsonParseException: нераспознанный токен 'Hello': ожидал (JSON String, Number, Array,)

Question

У меня проблема с отправкой данных многостраничной формы React на бэкэнд MySQL с использованием Java. Когда я тестирую React и Java по отдельности в Postman, он работает нормально. Проблема возникает, когда я использую форму для отправки пользовательских данных вместе с изображением из внешнего интерфейса в серверную часть, я получаю сообщение об ошибке «Неопознанный токен». Я много исследовал эту ошибку и не могу найти решения. Пожалуйста, помогите, где я ошибаюсь.

React:

const [firstName, setFirstName] = useState()
const [lastName, setLastName] = useState()
const [email, setEmail] = useState()
const [phoneNumber, setPhoneNumber] = useState()
const [file, setFile] = useState()

const send = event => {
    const data = new FormData()
    data.append("user", firstName)
    data.append("file", file)


    Axios.post("/new/sale", data).then(res => console.log(res))
        .catch(err => console.log(err))

}

Controller

 @PostMapping(value = "/sale")
    public ResponseEntity<Response> createPost(@RequestParam("file") MultipartFile file,
                                               @RequestParam("user") String user)
            throws IOException {

        ObjectMapper obj = new ObjectMapper();
        Sale sale = obj.readValue(user, Sale.class);
        sale.setPicture(file.getBytes());
        sale.setFileName(file.getOriginalFilename());

        Sale sales = saleRepository.save(sale);
        if(sales != null) {
            return new ResponseEntity<Response>(HttpStatus.OK);
        } else {
            return new ResponseEntity<Response>(HttpStatus.BAD_REQUEST);
        }
    }

POJO

 @Id
@GeneratedValue(strategy = GenerationType.AUTO)
private long id;
private String firstName;
private String lastName;
private String email;
private String phoneNumber;
private Date createdDate;
private Date updatedDate;
private byte [] picture;
private String fileName;

Answer 1

У вас проблема с заголовком запроса, отправленного через ax ios. Вы должны отредактировать свой запрос, чтобы установить заголовок content-type на multipart/form-data:

const config = {
    headers: {
        'content-type': 'multipart/form-data'
     }
 }

И добавить эту конфигурацию, как 3-й параметр, в ax ios Запрос POST:

Axios.post("/new/sale", data , config).then(res => console.log(res))
.catch(err => console.log(err))