자바 스크립트에서 sleep 기능

[출처] 자바 스크립트에서 sleep 기능을~|작성자 소년하루

SON을 활용한 HTTPService 개발

http://www.json.org/json-ko.html

JSON을 활용한 HTTPService 개발

FLEX 어플리케이션을 개발할 때 FLEX 2 SDK나 Flex Builder 2를 사용하면 HTTPService와 WebService 방식으로 서버와 통신을 할 수 있다. 두 통신 방법의 공통점은 HTTP 프로토콜을 사용하는 것과 XML 포맷으로 통신을 한다는 것이다. 하지만 XML은 가독성이 좋은 반면, XML을 생성하는 서버와 생성된 XML을 사용하는 클라이언트에 많은 부하를 준다는 단점이 있다.
보통 XML을 파싱하여 사용할 때 DOM(Document Object Model) Parser를 이용한다. 이 DOM 파서는 메모리에 XML 구조를 트리 형태로 구성하여 자료를 찾아는 방법을 사용한다. 그렇기 때문에 검색을 위해 많은 양의 데이터 구조가 메모리를 차지하게 된다.
특히 Flash Player는 XML을 메모리에 올린 후 사용이 완료되어도 잘 지워주지 않기 때문에 작은 양은 별 문제가 없지만 많은 양의 데이터를 XML 포맷으로 받는다면 사용자의 메모리를 많이 차지하게 되어서 컴퓨터가 느려지는 요인이 되고 있다.
실제 다수의 프로젝트를 보면 XML을 이용한 대용량 전송에서 Flash Player가 메모리를 효율적으로 관리하지 못해 브라우저가 자동으로 같은 페이지를 로딩하게 해 Flash Player를 초기화 하는 방식으로 문제를 해결하는 것을 본적이 있다. 물론 XML 포맷이 나쁘다는 것은 아니다. 하지만 효율적인 사용을 위해 더 좋은 방법을 찾아보자는 것이다.
필자가 해결 방법으로 추천하는 것은 JSON(JavaScript Object Notation) 포맷을 이용하여 통신하는 것이다. 이제부터 JSON이 무엇이며 어떻게 Flex에서 사용할 수 있는지에 대하여 알아보고 Yahoo에서 제공하는 Open API를 연동하는 예제를 만들어 보도록 하겠다.

JSON은 무엇인가?
JSON은 경량의 데이터 교환용 포맷이다. JavaScript Programming Language, Standard ECMA-262 3rd Edition - December 1999의 일부분을 기반으로 만들어 졌다. 보통 JavaScript나 ActionScript에서 객체나 배열을 선언할 때와 같은 방식으로 데이터를 포맷화 한다.
그리고 2006년 7월에 공식적으로 RFC 4627로 표준으로 승인되었다. JSON은 언어에 종속되지 않기 때문에 많은 언어들의 JSON Parser가 존재한다.
JSON은 두가지 구조를 기본으로 하고 있다.
1. name/value 형태 [Collection 타입]
대부분의 언어에서 object, record, struct, dictionary, hash table 등의 형태로 사용한다.
2. 값의 배열 형태 [Array 타입]
대부분의 언어에서 array, vector, list 등의 형태로 사용한다.

JSON에서 사용되는 타입에 대해 하나씩 알아보도록 하자.
Object
Object는 name/value 형태로 정의한다. 정의 방법은 “{“ 시작하고 “}”로 끝내어 표현한다. 그리고 각 name 뒤에 “:”을 붙이고 value을 입력하고 “,”로 값의 쌍을 구분한다.

{ name:”홍길동”, age:30, address:”서울시”}

object 구조도

Array
Array는 값들의 순서화된 배열이다. 정의 방법은 “[“ 시작하고 “]”로 끝내어 표현한다. 그리고 “,”로 값들을 구분한다.

[1,2,3,4,5,6,7,8,9]

array 구조도

Value
Value는 큰 따옴표 안에 string, number, true, false, null, object, array 등이 올 수 있다.

value 구조도

String
String은 큰 따옴표 안에 둘러 싸인 유니코드 문자들의 조합이며 (역슬러시) 문자도 지원한다.

string 구조도

Number
Number는 10진수만 사용한다. 8진수, 16진수는 사용되지 않는다.

number 구조도

JSON의 장점
1. 가독성이 좋다.
2. 데이터 크기가 작다.
3. 파싱이 빠르다.
4. 메모리 사용량이 적다.
5. RFC 표준으로 승인되었다.
6. 객체 구조를 쉽게 표현 할 수 있다.
7. 많은 언어가 지원하고 있다.

JSON을 사용하기 위한 Core Library 사용 방법
FLEX 2에서 JSON을 사용하려면 JSON을 파싱해 주는 관련 라이브러리가 필요하다. Adobe Labs에서 Core Library 안에 JOSN Parser를 제공해주고 있다. Adobe Labs에서 라이브러리를 다운 받고 프로젝트에 Library Path에 잡아주면 JSON 포맷을 사용할 수 있게 된다. 서버와 데이터 통신하기 앞서 기본 API와 간단한 예제를 살펴보도록 하겠다.

JSON API 사용법
1. JSON 클래스를 임포트한다.
- import com.adobe.serialization.json.JSON;

2. 객체를 JSON을 이용하여 작업한다.
- 객체를 JOSN 포맷으로 변경
var json:String = JSON.encode(obj);
- JSON 포맷을 객체로 변경
var obj:Object = JSON.decode(json);

<코드 1> JSON Example

http://www.adobe.com/2006/mxml"
layout="absolute" creationComplete="initApp()">


<코드 1>의 내용은 간단히 사람 이름과 나이를 객체에 저장하고 JSON 포맷으로 바꾸고 바꾼 내용을 출력하고 바꾼 내용을 다시 객체로 만들어 이름과 나이를 출력하는 예제이다.
<결과 1> JSON 간단 에제

{"name":"홍길동","age":30}
홍길동
30
<결과 1>는 <코드 1>의 결과 출력이다. 첫번째 줄이 JSON 포맷 형태이고, 나머지는 객체로 만든 후 이름과 나이를 출력한 결과이다.

JSON을 사용하여 Yahoo Open API 연동하기
간단히 JSON Parser를 사용하는 것을 해보았으니 실제 서버에 데이터를 JSON 포맷 형식으로 가져와서 객체화 시켜서 데이터 그리드에 출력하는 예제를 만들어 보도록 하겠다.

JSON으로 Yahoo API 연동 예제 [ 메모리 측정 추가 ]

서 버 프로그램을 배우는 것이 아니기 때문에 Open API를 사용하겠다. Open API는 웹 사이트에서 자신들의 서비스를 개발자가 사용할 수 있게 열어주는 서비스이다. 국내에는 Naver Open API가 있고 국외에는 Google, Yahoo, Amazon 등이 있다.
우리는 Yahoo의 이미지 검색 Open API에서 검색을 하여 검색된 결과를 데이터 그리드에 출력해보도록 하자.
우선 해야할 것은 Yahoo 웹사이트에 가서 Application ID를 발급 받아야 한다. <참고 사이트>에서 “Yahoo Application ID 발급 페이지”로 가서 Application ID를 발급 받는다.
그리고 Flex 어플리케이션에서 HTTPService로 서버에서 JSON 포맷으로 데이터를 가져 온다. HTTP Service의 url은 이미지 검색이기 때문에 다음과 같이 설정한다.

http://api.search.yahoo.com/ImageSearchService/V1/imageSearch
<참고 사이트>에서 “Yahoo 이미지 검색 매뉴얼”을 참고하면서 파라미터를 입력해주고 서버로 데이터를 요청한다.
서버로부터 JSON 포맷 형식의 데이터를 받으면 JSON Parser로 객체를 만들고 데이터 그리드의 데이터 프로바이더에 객체를 넣는다.
private function onJSONLoad(event:ResultEvent):void
{
//서버로 받아온 JSON 결과를 파싱한다..
var obj:Object = JSON.decode(event.result as String);
//JSON을 파싱한 결과를 Grid에 적용시킨다.
grid.dataProvider = obj.ResultSet.Result;

//Flash 사용 메모리를 측정한다.
memory.text = System.totalMemory + "Byte";
}
실제 구동 예제는 첨부된 파일을 실행해보면 될 것이다. 첨부된 파일을 실행하기 전에 Yahoo에서 발급 받은 Application ID는 수정해 주어야 한다.
이제까지 XML 포맷의 단점을 보완하는 JSON 포맷에서 대해 알아보고 실제 예제를 만들어 보았다. 실제 작동시켜 보면 XML 포맷과 속도와 성능 그리고 메모리 사용량의 차이를 알 수 있을 것이다. 현재 Ajax에서도 XML 포맷보다는 JSON 포맷을 선호하고 있고 필자 개인적으로도 통신 포맷은 JSON이 최적이라고 생각한다. Flex로 구현하였는데 데이터가 많다거나 성능을 높여야 한다면 JSON 포맷을 머리 속에서 한번 떠올려보는 것도 괜찮을 것이다.

<참고 사이트>
• JSON 공식 홈페이지 http://www.json.org/
• JSON 한글 페이지 http://openframework.or.kr/JSPWiki/Wiki.jsp?page=IntroducingJSON
• JSON - RFC 4627 페이지 http://www.ietf.org/rfc/rfc4627.txt?number=4627
• ActionScript 3.0 라이브러리 페이지
http://labs.adobe.com/wiki/index.php/ActionScript_3:resources:apis:libraries
• Yahoo 이미지 검색 매뉴얼 http://developer.yahoo.com/search/image/V1/imageSearch.html
• Yahoo Application ID 발급 페이지 http://api.search.yahoo.com/webservices/register_application

출처 : http://flytojin.springnote.com/pages/1406608

==================================사용법==================================

http://slothink.tistory.com/61

서버 온도를 알아낼 수 있는 방법아시는 분??

Submitted by dnagod on 화, 2009/08/11 - 10:16am.

• 설치 및 활용 QnA

0

points

HP rx2600
Red Hat Enterprise Linux ES release 4 (Nahant Update 4)
Kernel 2.6.9-42.EL on an ia64

사양의 서버입니다.

5분마다 온도를 측정하여 로그를 저장하고 싶은데요..

명령어를 알 수가 없네용.

아시는 분 도움 부탁드릴께요~

Proliant Support Pack을 깔려고 했는데, 잘 안깔리네요..ㅡㅜ

흐미...

‹ INIT: VERSION 2.85 RELOADING 라고 뜨는 경우 삼바 ads가 정확히 뭐조? ›

»

• Login or register to post comments

스프링소스와 VMWare의 전략적 관계

VMWare의 스프링소스 인수를 이상한 눈으로 보는 사람들이 많이 있는 것 같다. 스프링이라는 자바 엔터프라이즈 프레임워크와 VMWare 가상화 솔루션과 무슨 상관이있다고 5천억이라는 적지 않은 돈을 들여서 인수를 했을까 하는 것이다. 그냥 초고속으로 성장하면서 잘나가는 회사의 생각없는 돈지랄이라거나, 돈에 환장한 로드 존슨이 회사 팔아먹고 J사의 M처럼 먹튀하려는게 아닌가 하는 식으로 생각하는 인간들도 있는 것 같다.

내가 인수 당사자가 아니니 속사정이나 진행과정은 잘 모르겠고, 인수경쟁자가 있었는지도 모르겠다. 나를 포함해서 많은 사람들은 스프링을 초기부터 친 스프링적인 모습을 보였고(스프링 1.0시절에 등장한 TopLink스프링지원 기능은 오라클이 먼저 나서서 제공한 것이다) 심지어 스프링을 자신의 미들웨어 솔루션의 핵심 엔진으로 가져간 오라클이 인수하지 않을까 하는 생각을 했을 것이다.

아무튼 VMWare가 인수했고 로드 존슨은 그것이 단순한 투자목적 내지는 인력확보를 위한 인수가 아니라 새로운 비즈니스와 기술적인 기회를 만드는 것이라고 설명했다.

스프링소스 하면 스프링 프레임워크만을 생각하기 쉬운데 이미 스프링소스는 몇낸 째 서버플랫폼과 관리를 위한 기술에 더 많은 투자를 하고 있다. 사실상 스프링의 개발은 유겐횔러 1인이 대부분 진행하고 있고, 보조적으로 몇명의 개발자들이 필요할 때만 돕는 수준이다. 그에 반해 그동안 스프링소스는 많은 인력을 각종 서버제품과 dm,tc플랫폼, 툴 등에 투입했고 Build, Run, Manage라는 구조의 엔터프라이즈 개발과 운영에 관한 종합 서비스와 플랫폼을 만드는데 힘을 쏟아왔다. 그런면에서 스프링 프레임워크 자체는 스프링소스의 가장 중요한 자산이긴 하지만 비즈니스적으로는 작은 한 부분에 불과하다.

스프링소스가 서버와 플랫폼에 치중하면서 가장 신경을 쓴 것은 바로 OSGi기반의 DM서버이다. 기존의 JEE와는 차원이 다른 진정한 "차세대" 자바 모듈 플랫폼으로서의 OSGi의 가치를 일찍 인지하고 이에 전력을 기울인 결과 스프링소스은 자바 엔터프라이즈 OSGi의 가장 앞서나가는 리더가 되었다. 이미 다음 버전 OSGi의 엔터프라이즈 서비스 표준은 스프링소스가 주도했고, 스펙을 보자면 거의 이름만 다르지 스프링 그 자체이다. 스프링은 2.0부터 스스로 OSGi호환 모듈로 패키징 되어서 제공되고 있고, 가장 방대한 OSGi호환 번들을 제공하는 리포지토리도 운영하고 있다.

OSGi의 매력은 바로 배포이다. JEE와는 비교도 할 수 없을 만큼 유연하고 안정적인 배포기술이 바로 OSGi플랫폼의 매력이다. 거기에 JEE의 솔루션을 그대로 가져다 쓸 수 있도록 만드는 Spring OSGi-DM기술이 결합하면 스프링으로 만들기만 하면 아주 손쉽게 OSGi호환 모듈로 만들 수 있고, 플랫폼에 라이브 배포와 관리가 가능해진다. 거기에 편리한 관리기능이 첨부된 SpringDM서버까지 제공하고 있다.

DM서버가 좀 서두른 감이 있긴 하지만 1.0으로 공개되고 본격적으로 발전하려는 계획을 설명하면서 스프링소스의 리더들이 언급한 것이 바로 VMWare가상화와 OSGi/DM기술의 결합이다. 소위 Cloud 시스템으로 만들어진 VMWare의 대용량 서버가상화기술과 OSGi플랫폼의 장점을 극대화하고 스프링 기반의 JEE애플리케이션을 잘 공급할 수 있는 SpringDM 기술이 결합하면 환상적인 Cloud-OSGi/DM 플랫폼을 만들어 낼 수 있는 것이다. 기껏해야 제한된 API만을 지원하고 서블릿 수준의 배포만 가능한 구글의 GAE(AppEngine)와는 차원이 다른 배포환경을 만들어 낼 수도 있다.

작년에 이미 VMWare와 스프링소스는 이 플랫폼 개발과 스프링 솔루션의 각종 가상화 기술에 대해서 파트너쉽을 맺었고 이를 공동으로 연구해오고 있었다. SpringDM과 VMWare의 통합솔루션 진행에 대해서는 SpringOne에서 밝힌 바가 있고, 스프링 플랫폼을 가상화하는 부분에 대해서는 http://www.eweek.com/c/a/Application-Development/SpringSource-Teams-with-VMware-for-Virtualized-Spring-Solutions/ 이 기사에 잘 나와있다. VMWare는 이미 그 이전부터 스프링소스의 전략적인 파트너였기도 했다.

내 생각엔 아마도 그런 공동의 플랫폼과 JEE/OSGi 환경에 대한 가상화 연구의 결과가 매우 흡족하게 나왔고, 그에 대한 충분한 비전을 공유할 수 있었기에 이번 인수가 진행될 수 있었다고 생각된다. 물론 앞으로의 진행은 두고봐야 겠지만, 비즈니스로서 스프링소스 입장에서 또 VMWare입장에서 볼 때 이번 인수는 상당히 의미있고 가치있는 것이라고 평가될 수 있을 것이다.

java 프로세스 죽이지 않고 dump 뜨기

java 프로세스 죽이지 않고 dump 뜨기

흔히 사용되는 dump뜨는 방법은 프로세스를 죽이면서 콘솔에 뿌리는 것인데
StackTrace를 사용하면 프로세스를 죽이지 않고도 dump를 뜰 수 있다.

설치하지 않고도 web start를 사용하여 실행되는 것도 마음에 든다.
http://www.adaptj.com/main/download

화면의 “Launch” 버튼을 클릭하여 StackTrace 실행한다.

만약 실행되지 않고 다음과 같이 물어보면 파일로 저장하고 cmd창에서 javaws launch.jnlp하면 실행된다.

실행된 후에 메뉴에서 Process > Select...를 클릭하고 팦업된 창에서 "..."를 클릭하여 java 프로세스를 고른다.

그리고 메뉴에서 Process > Thread Dump를 클릭하면 dump가 떠지고, 파일로도 저장할 수 있다.

이클립스 속으로 들어간 드림위버같은 웹 편집기

이클립스 속으로 들어간 드림위버같은 웹 편집기

이클립스 JEE 패키지에 기본으로 포함된 편집기입니다. 파일을 선택하고 오른버튼메뉴에서 Open With > Web Page Editor 를 선택해서 엽니다. 한 번 열면 계속 그 파일은 마지막 열었던 편집기로 열리게 됩니다.

마치 드림위버처럼 웹페이지 디자인 편집이 가능한 편집기가 열립니다. 파일 탭부분의 아이콘을 보면 지구표시가 함께 보입니다.

툴바에 있는 네 개의 아이콘을 클릭하면 다르게 볼 수 있습니다.

가로 분할, 세로 분할, 디자인 보기, 코드 보기가 지원되고 하단의 Preview를 통해서 브라우저에서 보이는 모습을 확인할 수 있습니다.

파일이 이것저것 열리면 에러창이 뜰 수도 있는데, 모든 파일 다 닫으시고 새로 시작하면 됩니다.

이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-동일조건변경허락 2.0 대한민국 라이센스에 따라 이용하실 수 있습니다.

• 그림 2.png 86973 Bytes (8)

• 그림 3.png 140211 Bytes (4)

• 그림 4.png 192713 Bytes (4)

• 그림 5.png 8442 Bytes (4)

eclipse3.5 Subversive 플러그인 설치법

eclipse3.5 Subversive 플러그인 설치법

1. SVN 기본 플러그인 설치
eclipse 메뉴 Help > Install New Software... >



상단 Work with 항목에서 Galileo - http://download.eclipse.org/releases/galileo 선택 후 1~5분 기다립니다.




아래 창의 Pending... 사라지면 Collaboration 항목의 + 를 확장합니다.
Collaboration의 제일 아래 있는 Subversive SVN Team Provider(Incubation) 만 선택합니다.



Next 버튼 > Next 버튼 > I agree 체크하고 > Finish 로 설치합니다.

시간 아주 오래 걸립니다. 지금 20분째. ㅡㅡ;


2. SVN Connector 설치
http://www.eclipse.org/subversive/downloads.php
사이트에 접속해서 SVN Connector를 선택할 차례입니다.
polarion 사이트를 통해서 다운로드 받아야되는 라이선스 이슈가 있지만, 일단 설치하면 안정적인 듯 합니다.
다음 주소줄을 복사해서 eclipse 메뉴 Help > Install New Software... >
상단 Work with 항목에 붙여놓고 우측 Add... 버튼을 클릭합니다.
http://community.polarion.com/projects/subversive/download/eclipse/2.0/galileo-site/


다음 항목들을 선택합니다.
Subversive SVN Connectors
- JavaHL 1.6.0 Win32 Binaries (Optional)
- Native JavaHL 1.6 Implementation (Optional)
- Subversive SVN Connectors
- SVNKit 1.3.0 Implementation(Optional)



Next > Finish

eclipse를 재시작하고 우측 상단의 Perspective Selector 아이콘에서 SVN Repository Exploring을 선택합니다.

http://daysago.googlecode.com/svn/ 주소를 넣어 연결해 봅니다.

이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-동일조건변경허락 2.0 대한민국 라이센스에 따라 이용하실 수 있습니다.

• subversive1.png 6755 Bytes (6)

• subversive2.png 9115 Bytes (5)

• subversive3.png 5529 Bytes (4)

• subversive4.png 18624 Bytes (6)

• subversive5.png 6992 Bytes (4)

• subversive6.png 14438 Bytes (3)

• subversive7.png 12523 Bytes (6)

구글 크롬에서 IE TAB으로 인터넷뱅킹을 이용하다

요즘 김기창 교수의 책 '한국웹의 불편한 진실' 덕분에 더 화제가

되고 있지만, 한국의 웹사이트들이 익스플로러 이외의 브라우저를

거부하는 문제 때문에 다른 브라우저들이 제대로 대접받지 못하고

있는 것이 현실입니다. 그놈의 Active X 때문이죠.

하지만 해결책이 없는 것은 아닙니다.

파이어폭스와 구글 크롬에서는 플러그인을 사용해서

가상의 IE 환경을 구현해줍니다.

이를 통해 인터넷뱅킹도 이용할 수 있습니다.

구글 크롬 사용자인 저는 이 방법을 통해 드디어 인터넷뱅킹 등

한국 웹사이트를 방문할 때 발생했던 문제를 해결했습니다.

인터넷 뱅킹에 들어가서 자금이체까지 완벽히 마쳤습니다.

단점이 있다면 IE 환경에서는 속도가 조금 느려진다는 것.

하지만 그럭저럭 쓸 만합니다. 딱 익스플로러 만큼 느려집니다.

이제 익스플로러는 점점 더 기억 속으로 묻히게 되겠네요.

파이어폭스에서 IE TAB을 구현하는 것은 아주 간단히 설치 한 번으로

해결할 수 있었지만, 구글 크롬에서 IE TAB을 설치하는 것은

조금은 더 복잡합니다. 니켈 플러그인 같은 것을 쓰면 좀더 쉬울지는 모르지만

저처럼 단순히 IE TAB만 설치하려는 분들에게는 좀더 깔끔한 방식이 있습니다.

그 방법을 여기에 설명해볼까 합니다.

 npmeadax.dll

1. 우선 위 첨부파일을 다운받아서 아래 폴더에 저장합니다.

C:\Documents and Settings\(자신의 계정)\Local Settings\Application Data\Google\Chrome\User Data\Default\Plugin Data

2. 윈도 -> '실행'에서 cmd 창을 띄웁니다. cd 를 이용해 위 경로로 이동합니다.

cd C:\Documents and Settings\(자신의 계정)\Local Settings\Application Data\Google\Chrome\User Data\Default\Plugin Data

3. 레지스트리에 위 파일을 등록합니다.

regsvr32 npmeadax.dll

4. 크롬 북마크바에서 마우스 오른쪽 버튼을 눌러 '페이지 추가'를 선택합니다. 이름에는 'IE TAB' 등 적당한 이름을 넣으시고 URL에는 아래를 복사해서 넣습니다.

javascript:(function () { var lh=location.href; if( !lh || lh.match(/^(javascript|about):/i) ) return; document.write('<html><head><title> '+(document.title?document.title:lh).replace(/</g,'<').replace(/>/g,'>')+' - using Internet Explorer rendering<\/title><\/head><body style=\'margin:0px;padding:0px;\'> <script type=\'text/javascript\'>var script = document.createElement(\'script\'); var embed = \'<embed type=\\\'application\/x-meadco-neptune-ax\\\' width=\\\'100\x25\\\' height=\\\'100\x25\\\' param-location=\\\'' + lh + '\\\'><\/embed>\'; script.setAttribute(\'src\',\'data:text/javascript,document.write(embed);\'); document.body.appendChild(script);<\/script><\/body><\/html>'); })();

5. 자 이제 IE TAB 설치가 완료되었습니다. 은행 사이트에 가셔서 북마크바의 IE TAB을 누르시면 이제 IE 환경으로 바뀝니다.

자바스크립트의 클래스화

31일차: 자바스크립트의 클래스화

Ajax 2009/08/12 09:48



*자바에서 클래스 정의

class 클래스 이름{

변수들

메서드들(){ }

}




*자바스크립트에서 클래스 정의

클래스 이름 = function(){

변수;

}




//함수 정의(클래스에 함수 추가시켜주기)

클래스이름.prototype.함수이름 = function(){

함수 내용;

}




Member = function(id, name){

this.id = id;

this.name = name;

}







Member.prototype.setValue(newId,newName){

this.id = newId;

this.name = newName;

}




==> var mem = new Member("elvo", "이정석");

==> mem.setValue("abc","홍길동");







*JSON 기법




클래스 이름 = function(){

변수;

}




클래스이름.prototype ={

함수명1: function(){

함수내용;

}, <- 함수사이에 쉼표 꼭 해줘야함 

함수명2: function(){

함수내용;

}

}







*자바스크립트에서 패키지 정의하기




package ajax.xhr;

class aaa{}




var ajax = new Object();

ajax.Request = function(){}




var ajax = new Object();

ajax.xhr = new Object();

ajax.xhr.Request = function(){}




=>

var ajax = {};

ajax.xhr={};

ajax.xhr.Request = function(){}










* httpRequest.js를 패키지, 클래스화 하여 ajax.js로 바꾸기






httpRequest.js

function getXMLHttpRequest(){ //XHR객체를 리턴해주는 함수 만들기
if(window.ActiveXObject){//IE 6.0 이라면..
try{
return new ActiveXObject("Msxml2.XMLHTTP");
}catch (e) {
try {//IE의 옛날 버전 이라면..
return new ActiveXObject("Microsoft.XMLHTTP");
} catch (e1) {
return null;
}
}
}else if(window.XMLHttpRequest){ //다른 모든 기타 브라우저들 이라면 (IE 7.0이후 포함)
return new XMLHttpRequest();
}else{
return null;
}
}

var httpRequest = null;

function sendRequest(url, params, callback, method) {
httpRequest = getXMLHttpRequest();//XMLHttpRequest객체 구하기
var httpMethod = method ? method : 'GET'; //메소드값이 없으면 겟방식으로..


if(httpMethod != 'GET' && httpMethod != 'POST'){
httpMethod = 'GET';
}

var httpParams = (params == null || params == '')? null : params;

var httpUrl = url;

if(httpMethod == 'GET' && httpParams != null){
httpUrl = httpUrl + "?" + httpParams;
}

httpRequest.open(httpMethod, httpUrl, true);
httpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

httpRequest.onreadystatechange = callback;
httpRequest.send(httpMethod == 'POST' ? httpParams : null);

}




ajax.js

var ajax = {};
ajax.xhr = {};

ajax.xhr.Request = function(url,params,callback, method){
this.url = url;
this.params = params;
this.callback = callback;
this.method = method;
this.send();
}

ajax.xhr.Request.prototype = {
getXMLHttpRequest: function(){ //XHR객체를 리턴해주는 함수 만들기
if(window.ActiveXObject){//IE 6.0 이라면..
try{
return new ActiveXObject("Msxml2.XMLHTTP");
}catch (e) {
try {//IE의 옛날 버전 이라면..
return new ActiveXObject("Microsoft.XMLHTTP");
} catch (e1) {
return null;
}
}
}else if(window.XMLHttpRequest){ //다른 모든 기타 브라우저들 이라면 (IE 7.0이후 포함)
return new XMLHttpRequest();
}else{
return null;
}
},

send: function() {
this.req = this.getXMLHttpRequest();//XMLHttpRequest객체 구해서 req라는 멤버변수를 만들어 거기에 넣어줌
var httpMethod = this.method ? this.method : 'GET'; //메소드값이 없으면 겟방식으로..

if(httpMethod != 'GET' && httpMethod != 'POST'){
httpMethod = 'GET';
}

var httpParams = (this.params == null || this.params == '')? null : this.params;

var httpUrl = this.url;

if(httpMethod == 'GET' && httpParams != null){
httpUrl = httpUrl + "?" + httpParams;
}

this.req.open(httpMethod, httpUrl, true);
this.req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

var request = this;
this.req.onreadystatechange = function(){
request.onStateChange.call(request);
}

this.req.send(httpMethod == 'POST' ? httpParams : null);

},
onStateChange: function(){
this.callback(this.req);
}
}

XMLHttpRequest 사용시 한글 파라미터 전송 방법

http://javacan.tistory.com/entry/113

Quick Ajax Debugging Tip

Quick Ajax Debugging Tip
Ok, so this has been bugging me for the past few hours so I thought I'd share a quick hack. I've got a prototype I'm working on for a client that has a bit of Ajax in it. My Application.cfc code comes from a snippet I have in ColdFusion Builder and has the following onError:

Short and simple. An ugly dump is fine for testing. However, when an Ajax called was made, Firebug displayed a butt load of HTML (the dump) and it was difficult to find the exact message. I just changed it to the following code and it was incredibly helpful. Still not something I'd recommend on production, but I may change my snippet to support this:
message=#arguments.exception.message# detail=#arguments.exception.detail#
Basically, if method exists in the URL, assume it's Ajax. (I could also check the headers, as described here.)