'flex' 카테고리의 글 목록

'flex'에 해당되는 글 24건

2010.08.06 [03-D1] FLEX에서의 JSON

2010. 8. 6. 18:25 flex

[03-D1] FLEX에서의 JSON

[01] JSON Framework

1. 설치

- Library Download

. http://www.json.org

. http://www.json.org/java

. http://code.google.com/p/json-simple/

. http://code.google.com/p/json-simple/downloads/list/json_simple-1.1-all.zip

- Example

. http://www.json.org/java/index.html

. http://code.google.com/p/json-simple/wiki/JSPAndAJAXExamples

- DOC

. http://www.json.org/java/index.html

1) 'json_simple-1.1-all.zip'파일의 압축을 풀어 'json_simple.jar' 파일을

'WEB-INF/lib' 폴더에 복사합니다.

2. 객체의 출력

>>>>> WebContent/json/object.jsp

<%@page contentType="text/html" pageEncoding="UTF-8" %>

<%@page import="org.json.simple.JSONObject" %>

JSONObject obj = new JSONObject();

obj.put("name","Flex JSON Example");

obj.put("height",new Integer(175));

obj.put("weight",new Double(60.5));

obj.put("married",new Boolean(false));

obj.put("property", null);

out.print(obj);

out.flush();

{

"married":false,

"weight":60.5,

"height":175,

"name":"Flex JSON Example",

"property":null

}

- JSON 출력 결과

{

"married":false,

"weight":60.5,

"height":175,

"name":"Flex 수업",

"property":null

}

- XML

<married>false</married>

</record>

3. 배열 처리

>>>>> WebContent/json/array.jsp

<%@ page contentType="text/plain; charset=utf-8" %>

<%@ page import="org.json.simple.*" %>

JSONArray list = new JSONArray();

list.add("가길동");

list.add("나길동");

list.add("다길동");

list.add("라길동");

list.add("마길동");

out.print(list.toString());

- output

[

"가길동",

"나길동",

"다길동",

"라길동",

"마길동"

]

4. 객체와 배열의 출력

>>>>> objectArray.jsp

<%@page contentType="text/html" pageEncoding="UTF-8" %>

<%@ page import="org.json.simple.*" %>

JSONObject obj = new JSONObject();

JSONArray list = new JSONArray();

list.add("관악산");

list.add("북한산");

list.add("도봉산");

list.add("백운산");

list.add("설악산");

obj.put("name","Flex 수업");

obj.put("mountain", list);

out.print(obj);

out.flush();

- output

{

"mountain":[

"관악산",

"북한산",

"도봉산",

"백운산",

"설악산"

"name":"Flex 수업"

}

[02] FLEX에서의 JSON

- JSON 지원 SWC 파일 추가: http://github.com/mikechambers/as3corelib 에서

'as3corelib-.93.zip'파일을 다운 받습니다.

압축을 풀고 'as3corelib.swc'파일을 프로젝트의 'libs'폴더에 추가합니다.

- http://code.google.com/p/as3corelib/downloads/detail?name=as3corelib-.93.zip&can=2&q=

- Flex Builder

. project type: Flex Project

. project name: json

. libs : as3corelib.swc

1. Server Page

>>>>> www_flex/WebContent/json/object.jsp

<%@page contentType="text/html" pageEncoding="UTF-8" %>

<%@page import="org.json.simple.JSONObject" %>

JSONObject obj = new JSONObject();

obj.put("name","Flex 수업");

obj.put("height",new Integer(175));

obj.put("weight",new Double(60.5));

obj.put("married",new Boolean(false));

obj.put("property", null);

out.print(obj);

out.flush();

2. MXML

>>>>> mdi/src/object.mxml

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"

layout="absolute" fontSize="12" width="417" height="362">

<mx:Script>

<![CDATA[

import mx.rpc.http.HTTPService;

import mx.rpc.events.FaultEvent;

import mx.rpc.events.ResultEvent;

import com.adobe.serialization.json.JSON;

import mx.controls.Alert;

public var httpTest:HTTPService; // 전역 변수

public function run():void{

httpTest = new HTTPService;

httpTest.addEventListener(ResultEvent.RESULT, responseHandler);

httpTest.addEventListener(FaultEvent.FAULT, faultHandler);

// 서버로부터의 응답 형식

httpTest.resultFormat = "text";

// 요청 주소

httpTest.url = "http://localhost:9090/www_flex/json/object.jsp";

// 서버로 요청

httpTest.send();

}

private function responseHandler(event:ResultEvent):void{

// 응답 문자열 저장

var s:String = event.result.toString();

// /^\s*: 시작 문자가 공백이나 탭을 지정

// \s*$/g: 끝에 문자가 공백이나 탭을 지정

// 공백 제거 정규 표현식

s = s.replace(/^\s*|\s*$/g, "");

// Alert.show("s: " + s);

// 문자열이 객체로 변환

var obj:Object = JSON.decode(s);

txtResult.text = "obj.name = " + obj.name + "\n";

txtResult.text += "obj.height = " + obj.height + "\n";

txtResult.text += "obj.weight = " + obj.weight + "\n";

txtResult.text += "obj.married = " + obj.married + "\n";

txtResult.text += "obj.property = " + obj.property + "\n";

}

// 시스템상에서 발생한 오류 처리

private function faultHandler(event:FaultEvent):void{

Alert.show(event.message.toString(), "시스템 오류");

}

]]>

</mx:Script>

<mx:Button x="13.5" y="328" label="RUN" width="393.5" id="cmdRun"

click="run()"/>

<mx:TextArea x="10" y="10" width="397" height="310" id="txtResult" fontSize="18"/>

</mx:Application>

>>>>> mdi/src/array.mxml

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"

layout="absolute" fontSize="12" width="417" height="362">

<mx:Script>

<![CDATA[

import mx.collections.ArrayCollection;

import mx.rpc.http.HTTPService;

import mx.rpc.events.FaultEvent;

import mx.rpc.events.ResultEvent;

import com.adobe.serialization.json.JSON;

import mx.controls.Alert;

public var httpTest:HTTPService; // 전역 변수

public function run():void{

httpTest = new HTTPService;

httpTest.addEventListener(ResultEvent.RESULT, responseHandler);

httpTest.addEventListener(FaultEvent.FAULT, faultHandler);

// 서버로부터의 응답 형식

httpTest.resultFormat = "text";

// 요청 주소

httpTest.url = "http://localhost:9090/www_flex/json/array.jsp";

// 서버로 요청

httpTest.send();

}

private function responseHandler(event:ResultEvent):void{

// 응답 문자열 저장

var s:String = event.result.toString();

// /^\s*: 시작 문자가 공백이나 탭을 지정

// \s*$/g: 끝에 문자가 공백이나 탭을 지정

// 공백 제거 정규 표현식

s = s.replace(/^\s*|\s*$/g, "");

// 배열이 객체로 변환

var ary:Array = JSON.decode(s) as Array;

var i:int=0;

for (i=0; i < ary.length; i++){

txtResult.text += ary[i] + " ";

}

// 시스템상에서 발생한 오류 처리

private function faultHandler(event:FaultEvent):void{

Alert.show(event.message.toString(), "시스템 오류");

}

]]>

</mx:Script>

<mx:Button x="13.5" y="328" label="RUN" width="393.5" id="cmdRun"

click="run()"/>

<mx:TextArea x="10" y="10" width="397" height="310" id="txtResult" fontSize="18"/>

</mx:Application>

>>>>> mdi/src/objectArray.mxml

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"

layout="absolute" fontSize="12" width="417" height="362">

<mx:Script>

<![CDATA[

import mx.collections.ArrayCollection;

import mx.rpc.http.HTTPService;

import mx.rpc.events.FaultEvent;

import mx.rpc.events.ResultEvent;

import com.adobe.serialization.json.JSON;

import mx.controls.Alert;

public var httpTest:HTTPService; // 전역 변수

public function run():void{

httpTest = new HTTPService;

// 성공적인 응답 도착시 실행할 이벤트 등록

// ResultEvent.RESULT: 요청 응답 이벤트

// function(event:ResultEvent):void: 응답을 처리할 함수

httpTest.addEventListener(ResultEvent.RESULT, responseHandler);

httpTest.addEventListener(FaultEvent.FAULT, faultHandler);

// 서버로부터의 응답 형식

httpTest.resultFormat = "text";

// 요청 주소

httpTest.url = "http://localhost:9090/www_flex/json/objectArray.jsp";

// 서버로 요청

httpTest.send();

}

private function responseHandler(event:ResultEvent):void{

// 응답 문자열 저장

var s:String = event.result.toString();

// /^\s*: 시작 문자가 공백이나 탭을 지정

// \s*$/g: 끝에 문자가 공백이나 탭을 지정

// 공백 제거 정규 표현식

s = s.replace(/^\s*|\s*$/g, "");

// 배열이 객체로 변환

var obj:Object = JSON.decode(s) as Object;

var name:String = obj.name;

var ary:Array = obj.mountain; // 배열 추출

var i:int=0;

txtResult.text += "name: " + name + "\n\n";

for (i=0; i < ary.length; i++){

txtResult.text += ary[i] + "\n";

}

// 시스템상에서 발생한 오류 처리

private function faultHandler(event:FaultEvent):void{

Alert.show(event.message.toString(), "시스템 오류");

}

]]>

</mx:Script>

<mx:Button x="13.5" y="328" label="RUN" width="393.5" id="cmdRun"

click="run()"/>

<mx:TextArea x="10" y="10" width="397" height="310" id="txtResult" fontSize="18"/>

</mx:Application>

'flex' 카테고리의 다른 글

[02-D1] MDI 제어 (0)	2010.08.06
[01-D1] MDI(Multiple Document Interface) (0)	2010.08.06
[실 습1-6][memo] 시작 화면의 제작 (0)	2010.08.06
[실습1-5][memo] Flex ActionScript 제작 (0)	2010.08.06
[실습1-4][memo] JSP Server Page(글 수정, 글 삭제) (0)	2010.08.06