김상욱의 LIVECONNECTION - 애플릿과 자바스크립트와의 통신

 

※ 강좌에 대한 질문은 '문의게시판'에서 해주세요.

   안녕하세요. 이번 강좌는 애플릿에서 자바스크립트를 호출하는 방법에 대한 내용을 다루고 있습니다. 아울러 자바스크립트에서 애플릿의 변수와 메소드를 이용하는 /^.^/ 방법에 대해서도 알아보도록 하겠습니다. 물론 자바스크립트에 대한 기본 지식이 있다면 더할 나위 없겠지만, 이 강좌에서 나오는 예제로도 충분히 지금 혹은 이후에라도 유용하게 써먹으실 수 있으실 겁니다.

1. Java applet 사용 개요

2. JavaScript 사용 예

3. netscape.zip와 클래스패스 설정법

4. 애플릿에서 자바스크립트 호출하기

5. 실제 이용

6. 참고사이트

7. 덤: 애플릿이 아닌 애플리케이션에서 브라우저 띄우기

1. Java applet 사용 개요

다 아시는 내용이지만, applet 을 로딩하기 위해서는

<html>

<head>

<title>applet</title>

</head>

<body>

<applet id="test" width="300" height="500" code="test.class" codebase=".">

<param name="name1" value="value1">

</applet>

</body>

</html>

이러한 내용의 html문서가 필요합니다.

   id는 이 applet의 identifier가 되겠습니다. width와 height는 보여지는 applet의 가로, 세로pixel값이고 code는 처음에 로딩될 class파일이며, codebase는 로딩될 url입니다. <예: http://211.47.65.69> 이 외에 jar파일로 압축하셨다면 archive="test.jar" 속성이 추가되면 될 것입니다. 그리고 혹시 applet과 javascript와의 통신이 안될 경우 아래처럼 MAYSCRIPT라는 속성을 추가시켜주시면 될 것입니다.

<applet id="test" width="300" height="500" code="test.class" codebase="." MAYSCRIPT>

2. JavaScript 사용 예

<script language=Javascript>

function scriptTest(Mode){

document.test.methodOfTest(Mode);

//document.applets[0].methodOfTest(Mode);}

</script>

  보세요.

자바스크립트를 모르시더라도 자바의 객체 모델을 대략 아신다면 이해하기 어렵지 않으시죠? script의 language를 Javascript로 정하고, function scriptTest(Mode) 를 호출하는 부분입니다. document는 window.document로 현재 브라우저의 문서 부분을 나타내는 객체이고, 그 안에 test로 identify된 applet에 접근하며, 그 안의 methodOfTest라는 method에 접근합니다. 물론 이 메소드는 public으로 되어있어야 합니다. 변수도 마찬가지겠지요. //로 주석처리 되어있는 부분은 바로 윗 줄과 같은 효과를 갖는 문장입니다. applet은 applets[] 배열로 이미 선언되어 있으므로 id를 이용하는 대신 applets[0], applets[1] 등을 이용해도 됩니다. applet안의 methodOfTest가 리턴값을 갖고 있다면 이를 변수로 받아 사용할 수도 있습니다.

3. netscape.zip와 클래스패스 설정법

위 압축파일은 Java packages for LiveConnect입니다. 우리는 이 중에서 netscape.javascript.JSObject클래스와 netscape.javascript.JSException 클래스를 사용해 애플릿에서 자바스크립트를 이용하도록 할 것입니다.JSObject은 original JavaScript object로 converting될 것입니다. 위 파일을 우선 적당한 디렉토리로 다운로드 받으세요.

이제 클래스패스에 추가시켜주어야 합니다.

현재 클래스패스가 잡혀있는 곳에 다운로드한 디렉토리/netscape.zip을 추가하시기 바랍니다. 윈도 2000에서는 내컴퓨터 오른쪽클릭 등록정보 환경변수에서 classpath를 추가하시면 되겠고요. 나머지 윈도 시리즈에서는 autoexec.bat을 직접 고치시면 되겠습니다. linux 등 유닉스 계열은 .profile 같은 쉘을 고쳐주시고요... 자세한 사항은 웹독스의 김세곤님의 문서를 참조하세요. 클래스패스설정이 정확히 되었는 지 알아보기 위해 java파일을 하나 생성한 후, import netscape.javascript.JSObject;를 추가한 후 컴파일해봅시다. 컴파일이 에러없이 된다면 클래스패스가 제대로 잡힌 것입니다.

4. 애플릿에서 자바스크립트 호출하기

클래스패스가 제대로 잡혔나요? 음후후 /^.^/ 감축드리옵니다. 이제 실제로 사용하기 위해서 JSObject클래스에 있는 메소드를 살펴봅니다.

public static JSObject getWindow (Applet applet )

음 윈도 객체를 받아옵니다. 가장 먼저 호출해야할 메소드지요.

사용 예: JSObject MainWindow = JSObject.getWindow ( this );

public Object call ( String methodName, Object args[ ] )

javascript의 함수를 호출합니다. 뒤의 객체배열은 함수호출 시 필요한 인자가 되겠습니다. 일반적으로 스트링 배열을 많이 사용합니다. 자바스크립트는 변수형이 따로 없지요. 모두 var타입.

사용 예:

JSObject window = JSObject.getWindow(this);

String as1[] = {
strcode, strname
};

window.call("ChangeCode", as1);

이러면 ChangeCode(strcode, strname)이라는 자바스크립트 function을 호출한 셈이 됩니다.

public Object eval ( String s )

이 메소드는 JavaScript의 expression을 받아오는 메소드입니다.

사용 예:

JSObject MainWindow = JSObject.getWindow ( this );

JSObject UserName = MainWin.eval ( "document.UserInfoForm.UserName" );

UserName에 브라우저의 document.UserInfoForm.UserName 객체가 대입됩니다.

public Object getMember ( String name )

사용 예:

JSObject MainWindow = JSObject.getWindow ( this );

JSObject DocumentPage = (JSObject)MainWindow.getMember ( "document" );

이렇게 한 단계 아래의 객체에 접근할 때 사용합니다. 직접 eval메소드를 사용해도 되겠지요.

public Object getSlot ( int index)

Slot은 객체 이름으로 불러오는 것이 아니라 index로 불러올 때 사용합니다.

사용 예:

Object theApplet = Applets.getSlot ( index );

그 외에 removeMember, setMember, setSlot, toString 등의 메소드가 있습니다.

5. 실제 이용

  자, 공부하느라 힘드셨습니다. 날도 더운데...(이 글 보실 땐 추울 지도..) 그래도 이렇게 LIVECONNECTION에 대해 한글로 설명한 문서가 없더라구요... 많이 도움되셨으면 좋겠습니다.

첫 번째 예제 나갑니다.

[JAVA APPLET] import java.applet.*;
import java.awt.*;

public class JavaChrono extends Applet {
String previousTime = "0" ;
String currentTime = "0";
long j,k, l;
boolean okToChrono = false;
Color b, f;

public void init() {
b = getBackground();
f = getForeground();
MyThread tm = new MyThread(this);
tm.start();
}

public void startChrono() {
j = System.currentTimeMillis();
okToChrono = true;
}

public void stopChrono() {
okToChrono = false;
}

public void paint(Graphics g) {
if (okToChrono) {
g.setColor(b);
g.drawString(previousTime,10,30);
g.setColor(f);
k = System.currentTimeMillis();
l = k-j;
currentTime = Long.toString(l/1000);
g.drawString(currentTime,10,30);
previousTime = currentTime;
}
}
}

class MyThread extends Thread {
JavaChrono theApplet;

public MyThread(JavaChrono a) {
theApplet = a;
}

public void run() {
while (true) {
try {
theApplet.repaint();
this.sleep(1000);
}
catch(InterruptedException e) { }
}
}
}

[HTML] <HTML><HEAD></HEAD><BODY>
<APPLET CODE=JavaChrono.class
WIDTH=150
HEIGHT=150>
</APPLET>
<A HREF=""
onMouseOver="document.applets[0].startChrono()"
onMouseOut="document.applets[0].stopChrono()" >
<IMG SRC="whatever.gif" WIDTH=100 HEIGHT=100>
</A>
</BODY></HTML>

 

눈치빠르신 분은 다 이해하셨겠습니다만, 보시면 이미지에 마우스를 올리면 applets[0](애플릿이 하나 밖에 없으니 0번이겠죠.) 이 애플릿의 startChrono()메소드가 호출되고 마우스를 빼면 stopChrono() 메소드가 호출되는 것이죠. startChrono()는 애플릿안의 okToChrono true 로 만들고, 스레드 돌아가고 등등등 어렵지 않지요? 좀 더 응용해 볼까요?

<HTML>
<HEAD></HEAD>
<BODY>
<APPLET NAME="myApplet" CODE="MyApplet.class" HEIGHT=1 WIDTH=1></APPLET>
<FORM>
<INPUT TYPE="button"
VALUE="Start the Applet"
onClick="if (document.applets[0].isActive()) document.myApplet.showFrame()" >
<INPUT TYPE="button"
VALUE="Stop the Applet"
onClick="if (document.applets[0].isActive()) document.myApplet.disposeFrame()" >
</FORM></BODY></HTML>

[JAVA APPLET] import java.applet.*;
import java.awt.*;

public class MyApplet extends Applet {
Frame f = null;

public void init() { }

public void showFrame() {
if (f == null) {
f = new Frame();
f.setSize(100,100);
f.add(new Label("Hello World"));
f.setVisible(true);
}
}

public void disposeFrame() {
if (f != null) {
f.dispose();
f = null;
}
}
}

 

이번엔 대범하게 applets안의 메소드의 리턴값도 받아 이 값이 false이면 Frame을 열고, true이면 Frame을 닫고 하는 애플릿이군요. 히야... 직접 해보실래요? 시도하기

이번엔..

<HTML><HEAD></HEAD><BODY>
<SCRIPT>
function JavaSays() {
alert("Java says\n the value of iJava is :" +
document.myApplet.getIntJava() + "\n" +
"and sJava is :" +
document.myApplet.getStringJava());
}
</SCRIPT>
<FORM>
<INPUT type="button" value="Java says"
onClick = "JavaSays();">
</FORM>
<APPLET CODE="inJava.class"
NAME="myApplet"
HEIGHT=0 WIDTH=0>
</APPLET></BODY></HTML>

import java.awt.*;
import java.applet.*;
public class inJava extends Applet{
public int iJava = 123;
public String sJava = "String from JAVA";

public int getIntJava() {
return iJava;
}
public String getStringJava() {
return sJava;
}
}

 

음, 이번엔 메소드가 아니라 자바 애플릿의 변수에 접근하는 방법을 보이고 있습니다. 변수와 메소드가 모두 public으로 선언이 되어있는데요. 음, public변수에 직접 접근하는 건 안되나?(객체지향에는 좋지않은 코딩법이지만...) 숙제로 한 번 해보시죠. /^.^/

[Java applet] import java.applet.*;
import java.net.*;

public class inJava extends Applet{
public void init(){
String msg = "We will jump to an HTML tag";
try {
getAppletContext().showDocument
(new URL("javascript:doAlert(\"" + msg +"\")"));
getAppletContext().showDocument
(new URL("javascript:jumpTo(\"#JUMP\")"));
}
catch (MalformedURLException me) { }
}
}

[Javascript and HTML] <HTML><HEAD></HEAD><BODY>
<SCRIPT>
function doAlert(s) {
alert(s);
}
function jumpTo(tag) {
self.location=tag;
}
</SCRIPT>
<APPLET CODE="inJava.class"
NAME="myApplet" MAYSCRIPT
HEIGHT=400 WIDTH=10>
</APPLET>
<P>
<A NAME="JUMP">jump here from Java via Javascript</A>
</BODY>
</HTML>

 

이번엔 애플릿 안에서 자바스크립트를 호출하는 법을 보이고 있습니다. 히야... 우리가 원하던 것이군요. URL클래스 때문에 MalformedURLException try, catch해 주고 있네요. 어 여기서 우연히 한 가지를 더 공부하실 수 있게 되었군요? 바로 애플릿에서 새로운 url의 창을 여는 방법입니다.

getAppletContext()로 applet의 Context객체를 받아온 후 여기에 showDocument를 이용하고 있습니다. 음.. 제가 만든 채팅에 배너를 클릭하면 그 곳이 열리는데, 바로 이 방법을 사용하고 있습니다. 자세한 내용은 제가 좋아하는 박용우님의 강좌에 애플릿 부분에 상세히 나와 있으므로 참고하세요.

자, 나머지 몫은 여러분의 것입니다. 열심히 공부하시구요. 자바스크립트는 브라우저의 감초로 많은 일을 client-side에서 (어? 제 홈피 이름이 자바Side인데) 해낼 수 있으므로, 자바스크립트 모르면 바보된다는 말도 있지요. 이 참에 또 공부해 보세요.

참, 위 예제들은 아래 참고사이트 중 rgagnon.com에서 빌려왔음을(뭐 도로 갚을 건 아니지만..^^) 말씀드립니다.

끝!!!

6. 참고사이트

http://developer.netscape.com/docs/manuals/communicator/jsref/pkg.htm

▲netscape의 LIVECONNECTION매뉴얼입니다.

http://www.codeproject.com

▲ codeguru보다 여기가 낫다는 소문도..

http://www.rgagnon.com/howto.html

▲실제 이용 예제를 공부하실 수 있는 곳입니다.

헉헉 이렇게 절라 착한 저의 열라 친절한 강좌를 끝냅니다.

7. 덤: 애플릿이 아닌 애플리케이션에서 브라우저 띄우기

Runtime class의 exec메소드를 이용할 수 있습니다.

일단 Windows 95/98 에서는

command.com /c start http://java.sun.com

Windows NT/2000 에서는

cmd.exe /c start http://java.sun.com

을 실행하면 되지요

뭐.. Java관련 팁이라기보다는. Windows 팁이라고 봐도 되지만서두-_-

보통 Java Application에서는 Applet이 아니라 AppletContext를 사용할 수

없어서 Application에서 띄우기가 좀 애매해하시는 분들이 많지요

물론 Linux나 Unix계열에서는 netscape를 보통 사용하실 테니

netscape http://java.sun.com

을 실행시키시면 됩니다.

*** sample code ***

Runtime.getRuntime().exec(
new String[] { "cmd.exe", "/c", "start", "보여주고싶은 URL" }
);

7번, 덤 글은 나우누리 windrath님의 글입니다. 저도 궁금해하던 문제였으니 여러분께도 도움이 되리라 믿습니다.

※ 강좌에 대한 질문은 '문의게시판'에서 해주세요.