많은 앱은 웹 요청의 컨텍스트 외부에서 백그라운드 처리를 해야 합니다. 이 튜토리얼에서는 사용자가 번역할 텍스트를 입력하고 이전 번역 목록을 표시하는 웹 앱을 만듭니다. 사용자 요청이 차단되지 않도록 번역이 백그라운드 프로세스로 수행됩니다.
다음 다이어그램은 번역 요청 프로세스를 보여줍니다.
다음은 튜토리얼 앱 작동 방법을 보여주는 이벤트 시퀀스입니다.
- 웹 페이지를 방문하여 Firestore에 저장된 이전 번역 목록을 확인합니다.
- HTML 양식을 입력하여 텍스트 번역을 요청합니다.
- 번역 요청이 Pub/Sub에 게시됩니다.
- 해당 Pub/Sub 주제에 구독된 Cloud Run 함수가 트리거됩니다.
- Cloud Run 함수는 Cloud Translation을 사용하여 텍스트를 번역합니다.
- Cloud Run 함수는 결과를 Firestore에 저장합니다.
이 튜토리얼은 Google Cloud를 사용한 백그라운드 처리에 관심이 있는 모든 사용자를 대상으로 합니다. Pub/Sub, Firestore, App Engine, Cloud Run 함수와 관련된 사전 경험은 필요하지 않습니다. 하지만 모든 코드를 이해하기 위해서는 Go, 자바스크립트, HTML 관련 경험이 도움이 됩니다.
목표
- Cloud Run 함수를 이해하고 배포합니다.
- App Engine 앱을 이해하고 배포합니다.
- 앱을 사용해봅니다.
비용
이 문서에서는 비용이 청구될 수 있는 다음과 같은 Google Cloud 구성요소를 사용합니다.
프로젝트 사용량을 기준으로 예상 비용을 산출하려면 가격 계산기를 사용하세요.
이 문서에 설명된 태스크를 완료했으면 만든 리소스를 삭제하여 청구가 계속되는 것을 방지할 수 있습니다. 자세한 내용은 삭제를 참조하세요.
시작하기 전에
- Sign in to your Google Cloud account. If you're new to Google Cloud, create an account to evaluate how our products perform in real-world scenarios. New customers also get $300 in free credits to run, test, and deploy workloads.
-
In the Google Cloud console, on the project selector page, select or create a Google Cloud project.
-
Make sure that billing is enabled for your Google Cloud project.
-
Enable the Firestore, Cloud Run functions, Pub/Sub, and Cloud Translation APIs.
-
In the Google Cloud console, on the project selector page, select or create a Google Cloud project.
-
Make sure that billing is enabled for your Google Cloud project.
-
Enable the Firestore, Cloud Run functions, Pub/Sub, and Cloud Translation APIs.
-
Google Cloud 콘솔의 Cloud Shell에서 앱을 엽니다.
Cloud Shell을 사용하면 브라우저에서 직접 명령줄을 통해 클라우드 리소스에 액세스할 수 있습니다. 브라우저에서 Cloud Shell을 열고 계속을 클릭하여 샘플 코드를 다운로드하고 앱 디렉터리로 변경합니다.
- Google Cloud 프로젝트를 사용하도록 Cloud Shell에서
gcloud
도구를 구성합니다.# Configure gcloud for your project gcloud config set project YOUR_PROJECT_ID
Cloud Run 함수 이해
- 이 함수는 Firestore 및 Translation과 같은 일부 종속 항목 가져오면서 시작합니다. 또한 전역 변수와 유형도 있습니다.
- 함수를 호출할 때 재사용할 수 있도록 전역 Firestore 및 Translation 클라이언트가 초기화됩니다. 이렇게 하면 함수를 호출할 때마다 새 클라이언트를 초기화할 필요가 없으므로 실행 시간이 빨라집니다.
- Translation API는 문자열을 선택된 언어로 번역합니다.
-
Cloud Run 함수는 Firestore 및 Pub/Sub 클라이언트를 초기화하면서 시작합니다. 그런 다음 Pub/Sub 메시지를 파싱하여 번역할 텍스트와 원하는 도착어를 가져옵니다.
그런 다음 중복된 번역이 저장되지 않도록 앱에서 번역 요청의 고유한 이름을 표시합니다. 그런 다음 Firestore 트랜잭션으로 번역하여 동시 실행이 실수로 동일한 번역을 두 번 실행하지 않도록 합니다.
Cloud Run 함수 배포
Cloud Shell의
translate.go
파일과 동일한 디렉터리에서 Pub/Sub 트리거로 Cloud Run 함수를 배포합니다.gcloud functions deploy Translate --runtime go111 \ --trigger-topic=translate --set-env-vars GOOGLE_CLOUD_PROJECT=YOUR_GOOGLE_CLOUD_PROJECT
여기서
YOUR_GOOGLE_CLOUD_PROJECT
는 Google Cloud 프로젝트 ID입니다.
앱 이해
웹 앱에는 두 가지 주요 구성요소가 있습니다.
-
하나는 웹 요청 처리를 위한 Go HTTP 서버입니다. 이 서버에는 다음 두 가지 엔드포인트가 있습니다.
/
: 기존 번역을 모두 나열하고 새 번역을 요청하기 위해 사용자가 제출할 수 있는 양식을 표시합니다./request-translation
: 양식 제출은 이 엔드포인트로 전송됩니다. 이 엔드포인트는 비동기적으로 번역되도록 요청을 Pub/Sub에 게시합니다.
- 다른 하나는 Go 서버가 기존 번역으로 채우는 HTML 템플릿입니다.
HTTP 서버
index
디렉터리에서 앱을 설정하고 HTTP 핸들러를 등록하여main.go
가 시작됩니다.색인 핸들러
/
는 Firestore에서 모든 기존 번역을 가져오고 HTML 템플릿을 목록으로 채웁니다.새 번역은 HTML 양식을 제출하여 요청됩니다.
/request-translation
에 등록된 번역 요청 핸들러는 양식 제출을 파싱하고, 요청을 검증하고, 메시지를 Pub/Sub에 게시합니다.
HTML 템플릿
HTML 템플릿은 이전 번역을 보고 새 번역을 요청할 수 있도록 사용자에게 표시되는 HTML 페이지의 기본 페이지입니다. HTTP 서버가 이 템플릿에 기존 번역 목록을 채웁니다.
-
HTML 템플릿의
<head>
요소에는 해당 페이지의 메타데이터, 스타일 시트, 자바스크립트가 포함됩니다.이 페이지는 Material Design Lite(MDL) CSS 및 자바스크립트 애셋을 확인합니다. MDL을 사용하면 Material Design 스타일과 느낌을 웹 사이트에 추가할 수 있습니다.
이 페이지는 JQuery를 사용하여 문서 로드가 완료될 때까지 기다리고 양식 제출 핸들러를 설정합니다. 번역 요청 양식이 제출될 때마다 페이지가 최소 양식 검증을 수행하여 값이 비어 있지 않은지 확인한 후 비동기 요청을
/request-translation
엔드포인트로 전송합니다.마지막으로 요청이 성공했는지 또는 오류가 발생했는지를 나타내는 MDL 스낵바가 표시됩니다.
- 페이지의 HTML 본문은 MDL 레이아웃 및 여러 MDL 구성요소를 사용하여 번역 목록과 추가 번역 요청 양식을 표시합니다.
앱 빌드
-
웹 앱을 배포하기 전에 앱을 빌드하여 컴파일되었는지 확인하고 모든 종속 항목이 제대로 작동하는지 확인합니다.
go build -o start ./index
아무것도 인쇄되지 않고
start
파일이 생성되면 성공적으로 빌드된 것입니다.
웹 앱 배포
App Engine 표준 환경을 사용하면 많은 양의 데이터를 사용해 작업하고 과도한 부하가 발생하는 애플리케이션을 쉽게 빌드하고 배포하며 안정적으로 실행할 수 있습니다.
이 튜토리얼에서는 App Engine 표준 환경을 사용하여 HTTP 프런트엔드를 배포합니다.
app.yaml
은 App Engine 앱을 구성합니다.
app.yaml
파일과 동일한 디렉터리에서 App Engine 표준 환경에 앱을 배포합니다.gcloud app deploy
앱 테스트
Cloud Run 함수 및 App Engine 앱을 배포한 후 번역 요청을 시도합니다.
-
브라우저에서 앱을 보려면 다음 URL을 입력합니다.
https://PROJECT_ID.REGION_ID.r.appspot.com
다음을 바꿉니다.
PROJECT_ID
: Google Cloud 프로젝트 IDREGION_ID
: App Engine이 앱에 할당하는 코드
빈 번역 목록과 새 번역 요청 양식이 포함된 페이지가 있습니다.
- 번역 할 텍스트 필드에 번역할 텍스트를 입력합니다(예:
Hello, World
). - 드롭다운 목록에서 텍스트를 번역할 언어를 선택합니다.
- 제출을 클릭합니다.
- 페이지를 새로 고침하려면 새로 고침refresh을 클릭합니다. 번역 목록에 새 행이 있습니다. 번역이 표시되지 않으면 몇 초 후 다시 시도합니다. 그래도 번역이 표시되지 않으면 앱 디버깅에 대한 다음 섹션을 참조하세요.
앱 디버깅
App Engine 앱에 연결할 수 없거나 새 번역이 표시되지 않으면 다음을 확인합니다.
-
gcloud
배포 명령어가 성공적으로 완료되었고 오류를 출력하지 않았는지 확인합니다. 오류가 있으면 수정하고, Cloud Run 함수 및 App Engine 앱 배포를 다시 시도합니다. -
Google Cloud 콘솔에서 로그 뷰어 페이지로 이동합니다.
로그 뷰어 페이지로 이동- 최근에 선택한 리소스 드롭다운 목록에서 GAE 애플리케이션을 클릭하고 전체 module_id를 클릭합니다. 앱을 방문했을 때의 요청 목록이 표시됩니다. 요청 목록이 표시되지 않는 경우 드롭다운 목록에서 전체 module_id를 선택했는지 확인합니다. Google Cloud 콘솔에 오류 메시지가 출력되는 것이 보이면 앱 이해 관련 섹션에 있는 코드와 앱 코드가 일치하는지 확인합니다.
-
최근에 선택한 리소스 드롭다운 목록에서 Cloud 함수를 클릭하고 전체 함수 이름을 클릭합니다. 요청된 각 번역마다 나열된 함수가 보입니다. 그렇지 않으면 Cloud Run 함수 및 App Engine 앱이 동일한 Pub/Sub 주제를 사용 중인지 확인합니다.
background/index/main.go
파일에서topicName
상수가"translate"
인지 확인합니다.- Cloud Run 함수를 배포할 때,
--trigger-topic=translate
플래그를 포함합니다.
삭제
이 튜토리얼에서 사용된 리소스 비용이 Google Cloud 계정에 청구되지 않도록 하려면 리소스가 포함된 프로젝트를 삭제하거나 프로젝트를 유지하고 개별 리소스를 삭제하세요.
Google Cloud 프로젝트 삭제
- In the Google Cloud console, go to the Manage resources page.
- In the project list, select the project that you want to delete, and then click Delete.
- In the dialog, type the project ID, and then click Shut down to delete the project.
App Engine 인스턴스 삭제
- In the Google Cloud console, go to the Versions page for App Engine.
- Select the checkbox for the non-default app version that you want to delete.
- 앱 버전을 삭제하려면 삭제를 클릭합니다.
Cloud Run 함수 삭제
-
이 튜토리얼에서 만든 Cloud Run 함수를 삭제합니다.
gcloud functions delete Translate
다음 단계
- Cloud Run 함수 튜토리얼 살펴보기
- App Engine 자세히 알아보기
- 완전 관리형 환경 또는 자체 Google Kubernetes Engine 클러스터에서 스테이트리스(Stateless) 컨테이너를 실행할 수 있는 Cloud Run 사용해 보기