前提・実現したいこと
reactjsからのPOSTの値に対して、spring bootでカスタムバリデーションを行いたいのですが、フロントエンドから送信されたRequestの中身がnullとして扱われ@NotNullアノテーションに引っ掛かってしまいます。
発生している問題・エラーメッセージ
バックエンド側のエラー
WARN .m.m.a.ExceptionHandlerExceptionResolver : Resolved [org.springframework.web.bind.MethodArgumentNotValidException: Validation failed for argument [0] in public org.springframework.http.ResponseEntity<com.example.main.response.Response> com.example.main.controllers.Controller.process(com.example.main.requests.Request) throws java.lang.Exception with 2 errors:
フロント側では、Responseに@NotNullのメッセージが格納されたfieldErrorsが返ってきます。
該当のソースコード
form.js
javascript
//エラーメッセージ const [firstError, setFirstError] = useState(''); const [lastError , setLastError ] = useState(''); const handleSubmit = (evt) =>{ evt.preventDefault(); fetch("http://localhost:8080/api/send", { method: "POST", headers: { Accept: "application/json", "Content-Type": "application/json", "X-AUTH-TOKEN":'Bearer '+getToken(),//JWTトークン }, body: JSON.stringify({ First: formData.get('First'), Last: formData.get('Last'), }), }) .then((response)=> response.json()) .then((data) => { if(data.fieldErrors) { data.fieldErrors.forEach(fieldError => { if(fieldError.field === 'First'){ setNodeError(fieldError.message); } if(fieldError.field === 'Last'){ setNetError(fieldError.message); } }); } else { alert("success") } }).catch((err) => err); const onFirstFocus = (e) =>{ e.preventDefault(); setFirstError(''); } const onLastFocus = (e) =>{ e.preventDefault(); setLastError(''); } return( <form className="col" onSubmit={handleSubmit} noValidate={false}> <input className="form" type="text" value="" onFocus={onFirstFocus} name="First"/> { firstError ? <span style={{ color: 'red', fontSize: '12px'}}>{firstError}</span> : '' } <input className="form" type="text" value="" onFocus={onLastFocus} name="Last"/> { lastError ? <span style={{ color: 'red', fontSize: '12px'}}>{lastError}</span> : '' } <button type="submit">送信</button> </form> )
Request.java
java
@Data public class Request{ @NotNull(message = "First is required.") @Pattern(regexp="^[1-9]|[1-9][0-9]|[1-4][0-9]{2}|500$",message = "First is outside the range.")//500まで private String First; @NotNull(message = "Last is required.") @Pattern(regexp="^((25[0-5]|2[0-4][0-9]|1[0-9][0-9]|[1-9]?[0-9])\.){3}(25[0-5]|2[0-4][0-9]|1[0-9][0-9]|[1-9]?[0-9])$",message = "Last is invalid.")//IPv4 private String Last; }
Controll.java
java
@RestController @RequestMapping("/api") @CrossOrigin(origins = "http://localhost:3000") public class AuthenticationController { @PostMapping("/send") public ResponseEntity<Response> process(@Validated @RequestBody Request Request) throws Exception{ Response Response = new Response(); Response.setData("ok !"); return ResponseEntity.ok(Response); } }
ControllerErrorHandler.java
java
@ControllerAdvice public class ControllerErrorHandler extends ResponseEntityExceptionHandler { @Override protected ResponseEntity<Object> handleMethodArgumentNotValid(MethodArgumentNotValidException ex, HttpHeaders headers, HttpStatus status, WebRequest request) { FieldErrorResponse fieldErrorResponse = new FieldErrorResponse(); List<CustomFieldError> fieldErrors = new ArrayList<>(); ex.getBindingResult().getAllErrors().forEach((error) -> { CustomFieldError fieldError = new CustomFieldError(); fieldError.setField(((FieldError) error).getField()); fieldError.setMessage(error.getDefaultMessage()); fieldErrors.add(fieldError); }); fieldErrorResponse.setFieldErrors(fieldErrors); return new ResponseEntity<>(fieldErrorResponse, headers, status); } }
CustomFieldError.java
java
public class CustomFieldError { private String field; private String message; }
FieldErrorResponse.java
java
public class FieldErrorResponse { private List<CustomFieldError> fieldErrors; }
Getter,Setterは省略しています。
###試したこと
Request.java内のアノテーションをすべて外しControllクラス内でformからのリクエストを確認しましたが、First,Lastどちらの値もnullになっていました。
補足情報(FW/ツールのバージョンなど)
SpringBoot version : 2.6.2
package.json
"dependencies": { "@testing-library/jest-dom": "^5.16.1", "@testing-library/react": "^12.1.2", "@testing-library/user-event": "^13.5.0", "axios": "^0.24.0", "bootstrap": "^5.1.3", "react": "^17.0.2", "react-bootstrap": "^2.0.4", "react-dom": "^17.0.2", "react-redux": "^7.2.6", "react-router-dom": "^6.2.1", "react-scripts": "5.0.0", "redux": "^4.1.2", "styled-components": "^5.3.3", "web-vitals": "^2.1.2" },
まだ回答がついていません
会員登録して回答してみよう