[Vuejs] SPA 에서 html form submit 을 통한 client to client 데이터 전달은 가능할까?

배경

• 프로젝트 front-end javascript framework
  👉 Vuejs
• 대외 관계사 open api 연동 가이드 中 화면 이동 데이터 전달 방식
  👉 form submit (GET or POST)
• client to client 데이터 전달 필요

결론

SPA 에서 form submit을 통한 client to client 데이터 전달은 GET 방식은 가능, POST 방식은 불가능하다.

SPA 란?

Single Page Application : 단일 페이지 어플리케이션
단일 화면으로 구성된 web application으로
화면 이동 시 필요한 데이터를 서버로부터
리소스(HTML)를 전달받지 않고, JSON 형태로 전달받아 동적으로 렌더링한다.
ex) Vuejs, Angular, React ...

문제

1. GET
   URL을 통한 데이터 전달은 가능하지만,
   보안에 취약하고 데이터 암호화에 대한 약속이 필요하다.
2. POST
   Vuejs는 SPA의 한 종류로 정적인 단일 화면으로 구성되기 때문에,
   POST 방식(서버)을 통한 데이터 전달은 불가능하다.

해결

1. GET : 보안, 암호화 이슈가 없을 경우, 간단하게 구현 가능
   Vuejs => query string 또는 URLSearchParams 활용
2. POST : WAS redirect를 통한 화면 이동은 가능
   WEB server => 프록시 설정 (WAS rest api)
   WAS => DB, redis 를 활용한 전달 데이터 저장 필요

참고

• 블로그 참고 - vue html form post 전송 불가