2. 컴퓨터 이야기/프로그래밍

iframe 안에서 엔터 문자나 따옴표 들어간 변수를 parent 에 넘겨주기

래빗 크리스 2009. 4. 4. 01:50

앞으로 HTML 버전이 올라가면 뭔가 달라지지 않을까 싶지만 현재로서는..
엔터 문자가 들어간 스트링을 웹페이지 간에 주고 받기 하려면 input 태그로는 역부족이고..
div 에 담아 innerHTML 이나 innerTEXT 를 사용하는 것도 생각해 볼 문제이긴 하지만..
역시나 간편한 것은 textarea 가 아닐까 싶다. 따옴표 문제도 동일한 선상에서 논의되어야 하겠지만..

아하.. 이거 나는 몰랐는데, 같이 일하는 동료가 알려주더군요..
역시 세상은 넓고 배울 것은 많지만, 해답은 가까운 곳에 있군요.
textarea 를 Presentation 화면 로직에서 받아 Buisness 업무 로직에서 사용하는 것은 많이 해 보았지만,
거꾸로 하는 것은 이번이 처음입니다. ^&^>

만약 A.jsp 가 B.jsp 를 iframe 으로 잡아서 키우고 있고,
B.jsp 에서 처리한 결과를 A.jsp 의 일정 부분에 반영하려고 하는데..
그것이 엔터 문자와 따옴표를 가지고 있다면,
B.jsp 에서 textarea 에 값을 담아서 A.jsp 에 넘겨주면 되겠군요.
이곳에서는 B.jsp 에서도 화면 제어를 하고 있기 때문에,
DB 프로세스와 비즈니스 로직은 B.jsp 안에 iframe 으로 C.jsp 를 호출하여 해결.

다음은 A.jsp 의 대략적인 내용.
funcA1 은 B.jsp 나 C.jsp 에서 구현할 수 있겠지만, 실제 작업이 반영되는 곳에 기술하는 것이 유지보수에 적합하죠.
A.jsp 의 taA 에 사용자가 입력한 값은 일단 B.jsp 로 들어가고,
B.jsp 에서 추가적인 가공을 C.jsp 를 거쳐 수행한 다음에 다시 A.jsp 의 taA 에 반영하는 것이 이번 로직의 구성입니다.
...
<script>
<!--
...
function funcA1(pA, pB){
...
  var f = document.forms['frmA'];
  f.taA.value = pA;
...
}
...
//-->
</script>
...
<form name="frmA" method="post">
...
<textarea id="taA" name="taA"></textarea>
...
<iframe id="ifA" name="ifA" src="B.jsp?paramA=valueA&paramB=valueB" width="numberA" height="numberB"></iframe>
...
</form>
...

다음은 B.jsp 의 대략적인 내용. A.jsp 에서 iframe 의 src 에 최초 입력된 값을 여기에서 사용하지는 않았습니다.
물론 그럴 수도 있겠지만, A.jsp 의 funcB1 함수 말고 다른 함수에서 B.jsp 를 post 방식으로 호출하는 것이 낫지 않나 싶어요.
그리고 현재 설명하는 것은 B.jsp 에도 화면 구성이 있고, 실제 DB 작업이나 비즈니스 로직은 C.jsp 에서 구현하는 상황.
B.jsp 화면에서 어떤 것이든 클릭을 하였을때 B.jsp 안에 기술된 자바스크립트 함수가 C.jsp 를 호출한다고 보면 됩니다.
이때 C.jsp 는 width 와 height 가 모두 '0' 인 iframe 안에서 구동됩니다.
...
<%
  String taA = request.getParameter("taA")==null ? "" : request.getParameter("taA");
%>
...
<script>
<!--
...
var f = document.forms['frmB'];
f.action = 'C.jsp';
f.target = 'ifB';
...
//-->
</script>
...
<form name="frmB" method="post">
...
<iframe id="ifB" name="ifB" src="" width="0" height="0"></iframe>
...
</form>
...

다음은 C.jsp 의 대략적인 내용.
C.jsp 는 B.jsp 에서 width 와 height 가 모두 '0' 인 iframe 안에서 작동하기 때문에,
C.jsp 의 tac textarea 의 width 나 height 는 조정할 필요가 없겠지요.
스크립트에서 A.jsp 의 funcA1 함수를 호출하고, 이때 엔터 문자가 들어간 taC textarea 값을 파라미터로 전달합니다.
...
<%
... // DB 프로세스와 비즈니스 로직은 이곳에..
  ClassC ca = new ClassC();
  String taC = ca.methodC();
...
%>
...
<form name="frmC" method="post">
...
<textarea name="taC"><%= taC %></textarea>
...
</form>
..
<script>
<!--
...
var f = document.forms['frmC'];
parent.funcA1(f.taC.value, pB); // 이곳에서는 pA 에 엔터 문자나 따옴표가 들어간 스트링이 들어간다고 가정..
...
//-->
</script>
...

이상입니다.
요즘 Ajax 를 활용해서 하는 분들이 계시기는 한데..
HTTP 와 HTTPS 를 하나의 JSP 에서 혼합해서 사용하면 문제가 생기니까,
보안성을 강조한다면 역시나 iframe 버릴 수 없겠죠.
iframe 을 쓴다면 Ajax 를 꼭 쓰지 않아도 어느정도 선에서는 화면 깜박임 없이 구현이 가능하니까요..
기술문서들 중에는 Ajax 와 iframe 을 혼용하는 것에 대해서도 설명을 하더군요. ^^v