[Flex] 로컬이미지 서버 전송 후 다시 불러오기 소스
2008/04/15 15:31
[공지]이미지나 링크가 깨졌다면 댓글 부탁드립니다.
Flex에서 이미지 에디터 제작에 가장 기초가 되는 것은 이미지를 편집하기 위한 환경을 만드는 것이다.하지만 보안문제로 로컬에 있는 자원(이미지를 포함)을 직접사용하는 것을 불가능하다.
그래서 로컬자원을 서버에 전송후 그 전송된 자원을 읽어와 사용하게 되는데,
이러한 과정에 대해 공부해볼 수 있는 Flex & PHP 소스를 첨부했다.
동작방식은 다음과 같다.
로컬에 있는 이미지를 FileReference를 이용해 서버에 전송후
그 이미지를 다시 로드하며 화면에 보여준다.
이미지를 로드할 때, 보통 이미지의 경로를 이용해 Image 클래스의 source나 Loader 클래스의 load 함수를 이용한다.
하지만 여기서 사용한 방식은 이와 다르다.
저장된 이미지만 로드할 뿐 아니라 그에 관련된 여러정보도 함께 가져오고자 한다.
가령, 여러정보에는 사진의 각종 Header 정보가 담겨있을 수 있다. 이것을 서버단에서 해석해서 Flex에 전송하고 싶을때가 있을 것이다. 이럴때는 단순히 Image나 Loader로 이미지만 받아서는 안 될 것이다.
(물론 할 수 있지만 이미지와 다른 정보를 분리해서 load처리해야하므로 복잡하다.)
그래서 URLLoader를 이용해 이미지의 Base64로 encode된 정보와 기타정보를 얻어온다.
Base64로 얻어온 정보는 다시 decode를 거쳐 ByteArray로 변환한다음 Image의 load() 함수의 인자로 넘겨주면 이미지가 화면에 보이게 된다. 디지털 카메라로 찍은 이미지는 Header정보가 담겨있을 수 있으므로 ByteArray형태로 이미지를 가져올 수 있는 것은 좋은 방법이다. 여기서는 그에 대한 방법은 제시하지 않았다.
첨부한 프로그램에는 사진을 편집하는 기능이 없지만
편집기능을 추가할 수 있겠다.
이미지 편집을 완료 후
서버에 전송하기 위해 ImageSnapshot 클래스를 이용해 JPG또는 PNG에 대한 Base64 형태의 정보를 뽑아낼 수 있고 이 정보를 서버에 전송해서 이미지를 저장하도록 한다.
첨부소스를 보면 알겠지만
아주 단순하게 만들어져있고 개선을 해야 쓸 수 있다.
여러개의 이미지를 동시에 전송할려면 여러가지 수정해야할 것이다.
그리고 "저장-로드-다시저장" 과정에 대한 Process가 담긴 Class를 만들어 사용해야 효율적이겠다.
소스는 다음 링크에서 볼 수 있겠다.
ImageUpDown.zip실행화면
참고내용
Using the ImageSnapshot class to capture images as JPEGs or PNGs in Flex 3
Displaying an image saved as a Base64 encoded string in Flex 3
[Flex] 화면캡쳐는 ImageSnapshot 클래스를 사용하자.
글쓴이 : 지돌스타(http://blog.jidolstar.com/317)
'개발 > Database' 카테고리의 다른 글
| [Flex] 로컬이미지 서버 전송 후 다시 불러오기 소스 (7) | 2008/04/15 |
|---|---|
| MS Visual C++ 6.0 환경에서 MySQL 연동하는 방법 (13) | 2007/10/17 |
| [MySQL] 가로행과 세로열 값을 모두 구분자로 묶기(GROUP_CONCAT,CONCAT_WS) (1) | 2007/07/25 |
| [대용량 Database의 Table] Clustering Factor 에 대한 이해 (0) | 2007/07/07 |
와.. 안그래도 만들어야 했던 부분인데.. 이리 오픈을 해주시다니.. 정말 감사합니다^^
좋은 정보가 되었으면 합니다. ^^
정말 좋은 소스 공개해주셔서 감사합니다.
사랑합니다!!!! 존경합니다!!!! ^_^ 정말 큰 도움이 되었네요^^
정말 옆에 계셨다면 졸졸 따라다니면서 많은것을 배우고 싶습니다.
도움이 되셨다니 뿌듯하네요.
민호님도 열심히 공부하셔서 멋진 소스 공개 기대해볼께요. ^^
쏘스는 잘모구 있는데 에러가 발생 하네요
혹시 무슨문제인지 알려 줄수 있나요 ?
에러 내용 입니다.
[IOErrorEvent type="ioError" bubbles=false cancelable=false eventPhase=2 text="Error #2038: 파일 I/O 오류입니다. URL: http://localhost/images/upload.php"]
경로문제입니다.
APM을 구축하시고 upload.php를 웹루트/images 에 복사하신뒤 사용하셨나요?
위 에러는 localhost/images/upload.php 를 찾을 수 없기 때문에 발생한 에러랍니다.
1년전 내용이라 그런지..
링크가 상태가 안 좋네요 ㅠ ㅠ 어흑