라트노팜 차크라바티 는 현재 에릭슨에서 근무하는 소프트웨어 개발자입니다. 그는 오랫동안 IoT, 기계 간 기술, 커넥티드 카, 스마트 시티 분야에 집중해 왔습니다. 그는 새로운 기술을 배우고 이를 실무에 적용하는 것을 좋아합니다. 일하지 않을 때는 3살 난 아들과 함께 시간을 보내는 것을 즐깁니다.
이번 포스팅에서는 사용자가 원하는 이미지(.png 또는 .jpg 형식)를 업로드하고 다른 사용자가 업로드한 모든 이미지를 볼 수 있는 사진 갤러리 애플리케이션을 소개하는 시리즈 글의 1부입니다. 이 앱을 통해 사용자는 특정 이미지에 '좋아요'를 표시할 수 있습니다. 사용자가 이미지를 업로드하면 앱은 Amazon Web Services의 인식 API 를 사용하여 해당 이미지의 레이블을 스캔하고 감지합니다. 가장 높은 신뢰도로 반환된 라벨은 이미지에 태그를 지정하는 데 사용됩니다. 또한 이 앱에서는 사용자가 특정 태그를 클릭하면 해당 태그의 모든 이미지를 볼 수 있습니다.
데모
다음은 링크 를 클릭해 완성된 앱의 데모로 이동합니다.
기술 스택
Couchbase - 이미지 메타데이터 저장용
Express - 노드로 프론트엔드 구축용
AWS SDK 및 S3 - 이미지 파일 저장 및 이미지 재인식용
Node.js - 앱 백엔드 구축용
또한 jQuery는 클라이언트 측에서 server.js 파일로 Ajax 호출을 수행하는 데 사용됩니다.
Node.js는 앱이 활용하는 모든 RESTful API를 빌드하는 데 사용됩니다. 작업을 완료하기 위해 다음과 같은 종속성을 사용합니다:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
패키지.json "aws-sdk": "*", "couchbase": "^2.3.3", "express": "4.13.0", "강력한": "1.0.17", "gm": "^1.20.0", "호건-익스프레스": "^0.5.2", "knox": "^0.9.2", "socket.io": "1.0.5", "uuid": "^2.0.1" |
이러한 모듈의 용도는 다음과 같습니다:
- aws-sdk - AWS Rekognition API를 호출하는 데 사용됩니다.
- knox - Amazon S3와 상호 작용하는 데 사용됩니다.
- gm - 이미지 크기를 조정하는 데 사용됩니다(큰 크기의 이미지를 S3에 저장하고 싶지 않으므로 결국 가격표가 있습니다).
- 강력한 - 입력 파일을 처리하는 데 사용됩니다.
- 호건-익스프레스 - 제공 콧수염 익스프레스 프레임워크용 템플릿 엔진
- socket.io - 서버에서 클라이언트로 이벤트를 전송하여 조치를 취할 수 있도록 하는 데 사용됩니다.
- 카우치베이스 - 카우치베이스 데이터베이스와 상호 작용하는 데 사용됩니다.
- uuid - 카우치베이스에 JSON 문서를 저장하기 위한 임의의 문서 ID를 생성하는 데 사용됩니다.
카우치베이스의 역할
이 앱에서 Couchbase를 사용하여 다음을 수행합니다.
- 파일 이름과 같은 이미지 메타데이터 저장
- 이미지에 대한 '좋아요' 수 및 이미지에 할당된 태그와 같은 기타 유용한 정보를 저장합니다.
이 글(1부)에서는 사진 갤러리 앱에서 Couchbase를 사용하는 데 필요한 단계를 설명합니다. 앱의 전체 소스 코드는 다음 링크에서 확인할 수 있습니다. GitHub.
카우치베이스 및 기타 노드 모듈 설치하기
위의 package.json에 나열된 모든 모듈을 설치하려면 앱 루트 디렉터리로 이동하여 다음을 입력합니다:
|
1 |
npm 설치 |
Couchbase를 포함한 모든 모듈이 설치되면 이제 애플리케이션에서 이를 사용하기만 하면 됩니다.
Config.json
config.json이라는 .json 파일에 구성 가능한 정보 중 일부를 정의합니다.
|
1 2 3 4 5 6 7 8 9 10 11 |
{ "couchbase": { "서버": "127.0.0.1:8091", "bucket": "포토갤러리" } } |
여기에서는 이미지 메타데이터 정보가 저장될 버킷과 Couchbase Server 호스트 및 포트를 지정했습니다.
서버 = 127.0.0.1:8091(로컬에서 Couchbase를 실행하는 경우)
구성이 정의되면 다음 작업은 이 구성을 익스프레스 앱으로 가져오는 것입니다.
다음은 앱의 코드 스니펫입니다:
|
1 2 3 4 5 6 7 |
var 카우치베이스 = require("couchbase"); var 구성 = require("./config"); 모듈.수출.버킷 = (new 카우치베이스.클러스터(프로세스.환경.COUCHBASE_HOST || 구성.카우치베이스.서버)).오픈버킷( 프로세스.환경.카우치베이스_버킷 || 구성.카우치베이스.버킷); |
여기에서는 몇 가지 환경 변수를 사용하여 Couchbase 호스트와 버킷을 식별합니다. 이러한 변수가 런타임에 제공되지 않으면 기본값은 위에서 언급한 config.json으로 설정됩니다.
Couchbase 실행 및 구성
앱을 로컬에서 실행하기 위한 전제 조건으로 먼저 Couchbase Server를 설치 및 실행해야 합니다. 다음 페이지에서 터치베이스 다운로드 페이지 를 클릭하고 사용 중인 OS에 따라 설치하세요. 제 경우에는 Windows 시스템에서 Couchbase 4.6을 설치하고 있습니다. Couchbase가 실행되면 "포토갤러리"라는 버킷을 만듭니다. 이 버킷에는 모든 이미지 메타 정보가 저장됩니다. 한 가지 중요한 점은 버킷을 사용하기 전에 버킷에 색인을 만들어야 한다는 것입니다. 색인을 만들려면 다음과 같이 하세요:
|
1 |
만들기 기본 INDEX 켜기 <버킷명> |
색인이 생성되면 색인 탭으로 이동하면 색인이 나열됩니다.
프로덕션 환경에서는 성능 저하를 유발할 수 있으므로 글로벌 보조 인덱스를 사용하지 않는 것이 좋습니다. 하지만 앱의 규모를 고려할 때 글로벌 보조 인덱스가 있어도 괜찮습니다.
Couchbase에서 문서 저장 및 검색
포토갤러리 앱은 다음과 같은 작업을 수행합니다:
- 사용자가 파일을 선택하고 업로드를 클릭하면 앱이 Amazon S3 버킷에 파일을 저장합니다.
- 파일이 S3에 성공적으로 저장되면 AWS Rekognition API를 호출하여 이미지에 태그를 할당합니다.
- 태그가 할당되면 앱은 이미지의 메타데이터 정보를 Couchbase에 저장합니다. 포토갤러리 버킷.
Couchbase에 데이터를 저장하려면 다음 코드 조각이 필요합니다:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 |
// 변수 가져오기 var uuid = require("uuid"); var db = require("../업로드").버킷; var 구성 = require("../config"); var N1qlQuery = require('couchbase').N1qlQuery; //모델 정의 함수 이미지 모델() { }; // 저장 함수 정의 이미지 모델.저장 = 함수(데이터, 콜백) { var jsonObject = { 파일 이름: 데이터.파일 이름, 좋아요: 데이터.좋아요, 태그: 데이터.태그 } // 문서 ID가 존재하지 않는 경우 삽입할 고유 ID를 생성합니다. var documentId = 데이터.id ? 데이터.id : uuid.v4(); db.업서트(documentId, jsonObject, 함수(오류, 결과) { 만약(오류) { 콜백(오류, null); 반환; } 콜백(null, {메시지: "성공", 데이터: 결과}); }); } |
위의 코드는 Couchbase 데이터베이스와 상호 작용하기 위해 적절한 종속성을 가져오고 데이터를 저장하는 함수를 정의합니다. 이미지의 파일명, 좋아요, 태그가 포함된 JSON 본문이 생성된 다음 upsert() 함수가 호출되어 데이터를 저장합니다. 문서에 'id' 속성이 할당되지 않은 경우 이 함수는 uuid.v4()를 사용하여 속성을 생성합니다.
문서를 검색하려면 다음 코드 스니펫을 살펴보세요:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 |
/* * N1QL을 사용하여 카우치베이스 서버에서 모든 문서 가져오기 */ 이미지 모델.getAll = 함수(콜백) { var 문 = "SELECT META(photos).id, 파일명, 좋아요, 태그" + "FROM `" + 구성.카우치베이스.버킷 + "` 사진"; var 쿼리 = N1qlQuery.fromString(문).일관성(N1qlQuery.일관성.REQUEST_PLUS); db.쿼리(쿼리, 함수(오류, 결과) { 만약(오류) { 반환 콜백(오류, null); } 콜백(null, 결과); }); }; |
위의 코드 스니펫은 N1QL 쿼리를 사용하여 버킷의 모든 이미지를 반환합니다. 이는 포토갤러리 버킷의 모든 이미지를 나열하는 데 유용합니다. Couchbase 버킷은 파일 이름만 저장하고, Amazon s3 URL의 한 부분은 정적이며, 전체 URL은 이미지의 정적 s3 URL에 파일 이름을 추가하여 생성됩니다.
정적 부분 -> https://s3.amazonaws.com/la-image-tagger-chakrar27/
동적 부분 -> 파일 이름
여기, LA-이미지-태거-차크라27 은 제가 만든 S3 버킷입니다. 이 버킷을 만들려면 이 클라우드포메이션 템플릿을 AWS에 업로드하고 스택을 생성합니다. 그러면 s3 버킷이 생성됩니다.
이 게시물은 카우치베이스 커뮤니티 글쓰기 프로그램의 일부입니다.
[...] 이 블로그 시리즈의 1부에서는 Couchbase 버킷에 이미지 메타데이터를 저장하고 검색하는 방법에 대해 살펴보았습니다. 이번 [...]에서는 [...]