HanG321 Blog
Be Shine, Be Smile, Be Wild
  • Home
  • Blog
    • 好文閱讀 readings
    • 生活記事 diary
    • 時事評論 commentary
    • 科技資訊 technology
    • 電腦編程 programming
    • 金融財經 finance
    • 音樂電影 music/movie
  • About

Serverless Cloud Run Development: Challenge Lab

February 7, 2021|Cloud Run, GCP, Qwiklabs|電腦編程

This article provide a guidance to complete GSP328 Serverless Cloud Run Development: Challenge Lab. It won’t provide steps directly, only tips to finish the lab.

The challenge contains 7 tasks. As it has staging and production environment, so actually is 3 different sets of tasks.

Provision the Qwiklabs environment

run those commands to set config and checkout files

Task 1:

Assessment

Build an image using Cloud Build
Deploy a Cloud Run service as an unauthenticated service
Test service responds when the endpoint is accessed

1
2
3
4
5
6
7
8
+-----------------+-----------------------------------+
|      FIELD      |               VALUE               |
+-----------------+-----------------------------------+
| Billing Image   | billing-staging-api:0.1           |
| Billing Service | public-billing-service            |
| Authentication  | unauthenticated                   |
| Code            | pet-theory/lab07/unit-api-billing |
+-----------------+-----------------------------------+
 

  1. gCloud build command reference: https://cloud.google.com/sdk/gcloud/reference/beta/builds/submit
Shell
1
2
3
cd ~/<CODE>
gcloud builds submit \
--tag gcr.io/$GOOGLE_CLOUD_PROJECT/<BILLING_IMAGE>
 

2. gCloud deploy command reference:

  • https://cloud.google.com/sdk/gcloud/reference/run/deploy
  • https://cloud.google.com/sdk/gcloud/reference/run/deploy#–[no-]allow-unauthenticated
Shell
1
2
3
gcloud run deploy <SERVICE> \
--image gcr.io/$GOOGLE_CLOUD_PROJECT/<BILLING_IMAGE> \
--<AUTHENTICATED>
 

3. optional: click on the Service URL  in cloud shell, or curl manually. e.g. curl https://public-billing-service-XXXXXXX.a.run.app

Task 2:

Same as task 1, with different values.

1
2
3
4
5
6
7
8
+----------------+-------------------------------------------+
|     FIELD      |                   VALUE                   |
+----------------+-------------------------------------------+
| Image Name     | frontend-staging:0.1                      |
| Service Name   | frontend-staging-service                  |
| Authentication | unauthenticated                           |
| Code           | pet-theory/lab07/staging-frontend-billing |
+----------------+-------------------------------------------+
 

Task 3:

1
2
3
4
5
6
7
8
+----------------+--------------------------------------+
|     FIELD      |                VALUE                 |
+----------------+--------------------------------------+
| Image Name     | billing-staging-api:0.2              |
| Service Name   | private-billing-service              |
| Authentication | authenticated                        |
| Code           | pet-theory/lab07/staging-api-billing |
+----------------+--------------------------------------+
 

  1. Delete the existing Billing Service
Shell
1
2
cd ~/<CODE>
gcloud beta run services delete public-billing-service
 

2. Build an image using Cloud Build: similar to task 1

3. Deploy the image to Cloud Run requiring authentication: similar to above, just be aware this time is authenticated. --no-allow-unauthenticated

4. Test service:

Shell
1
2
3
4
BILLING_SERVICE=private-billing-service
BILLING_URL=$(gcloud run services describe $BILLING_SERVICE \
  --format "value(status.URL)")
curl -X get -H "Authorization: Bearer $(gcloud auth print-identity-token)" $BILLING_URL
 

Task 4:

1
2
3
4
5
6
+-----------------+---------------------------+
|      FIELD      |           VALUE           |
+-----------------+---------------------------+
| Service Account | billing-service-sa        |
| Display Name    | Billing Service Cloud Run |
+-----------------+---------------------------+
 

  1. create service account reference: https://cloud.google.com/iam/docs/creating-managing-service-accounts#creating
Shell
1
gcloud iam service-accounts create <SERVICE_ACOUNT> --display-name "<DISPLAY_NAME>"
 

Task 5:

1
2
3
4
5
6
7
8
9
+-----------------+-----------------------------------+
|      FIELD      |               VALUE               |
+-----------------+-----------------------------------+
| Image Name      | billing-prod-api:0.1              |
| Service Name    | billing-prod-service              |
| Authentication  | authenticated                     |
| Code            | pet-theory/lab07/prod-api-billing |
| Service Account | billing-service-sa                |
+-----------------+-----------------------------------+
 

  1. Deploy the image to Cloud Run & Enable Authentication
Shell
1
2
cd ~/<CODE>
## similar to task 3 build and deploy command above
 

2. Enable Service Account

https://cloud.google.com/sdk/gcloud/reference/run/services/add-iam-policy-binding

Shell
1
2
3
gcloud run services add-iam-policy-binding <SERVICE_NAME> \
  --member=serviceAccount:<SERVICE_ACCOUNT>@$GOOGLE_CLOUD_PROJECT.iam.gserviceaccount.com \
  --role=roles/run.invoker
 

3. optional: Test service url: lab instructions URL  is case sensitive.

Shell
1
2
3
4
5
6
PROD_BILLING_SERVICE=private-billing-servicePROD_BILLING_URL=$(gcloud run services \
    describe $PROD_BILLING_SERVICE \
    --format "value(status.URL)")
curl -X get -H "Authorization: Bearer \
    $(gcloud auth print-identity-token)" \
    $PROD_BILLING_URL
 

Task 6:

1
2
3
4
5
6
+-----------------+-----------------------------------+
|      FIELD      |               VALUE               |
+-----------------+-----------------------------------+
| Service Account | frontend-service-sa               |
| Display Name    | Billing Service Cloud Run Invoker |
+-----------------+-----------------------------------+
 

  1. same command as Task 4

Task 7:

1
2
3
4
5
6
7
8
9
+-----------------+----------------------------------------+
|      FIELD      |                 VALUE                  |
+-----------------+----------------------------------------+
| Image Name      | frontend-prod:0.1                      |
| Service Name    | frontend-prod-service                  |
| Authentication  | unauthenticated                        |
| Code            | pet-theory/lab07/prod-frontend-billing |
| Service Account | frontend-service-sa                    |
+-----------------+----------------------------------------+
 

  1. Deploy the image to Cloud Run & Enable Authentication: refer to Task 5
Shell
1
2
cd ~/<CODE>
## similar to task 5 build and deploy command above
 

2. Enable Service Account: similar to task 5

Shell
1
2
3
gcloud run services add-iam-policy-binding <SERVICE_NAME> \
  --member=serviceAccount:<SERVICE_ACCOUNT>@$GOOGLE_CLOUD_PROJECT.iam.gserviceaccount.com \
  --role=roles/run.invoker
 

3. optional: click on URL printed in cloud shell to verify endpoint access

Congratulations

After that you should be able to finish this challenge lab and obtain a skill badge:

Image for post

ionic 4: capacitor & pwa

ionic 4: capacitor & pwa

January 2, 2019|capacitor, cordova, ionic, pwa, service-worker|電腦編程

This blog post is recording my journey on proof of concept development on ionic 4 capacitor & PWA development in December 2018, just note down some obstacles I faced or founding in the journey, and this is not a tutorial.

Although Progressive Web Apps (PWA) are installable without app store, as of today business requirement may still need the distribute channel via app store. With ionic (UI) and Cordova framework, one single code base can serve native apps and web apps together.

ionic 4

Capacitor or Stencil

Capacitor is still in Release Candidate in Dec 2018, and 1.0 production in 2019. Integrate with Angular. Cross platform: iOS, android, Web, Electron (win & macOS)

Stencil: web component (similar to ploymer), reusable, independent (angular, react, vue)

selected Capacitor as per requirement.

Toolings: Intellij Idea (as subscribed), or Visual Studio Code (free)

Installation

follow the official documentation.  run $ ng build  to create /www folder

Creation on iOS & android projects is smooth and easy. ionic team really did a great job there. However, PWA isn’t that user-friendly.  npm install @ionic/pwa-elements only adding UI component.

PWA services worker

angular-worker: basic usage,  npm install -g @angular/cli ; ng add @angular/pwa  ngsw-config.json.
workbox: advance usage. pre-caching, background sync …etc

very difficult to setup, due to angular builder. Need to manually add “glob”: “workbox-<Component>.<dev|prod>.js” to angular.json . See https://golb.hplar.ch/2018/06/workbox-serviceworker-in-angular-project.html for more details

Development

$ ionic server –> live reload on source folder, so PWA doesn’t work as pre-caching & routing info in /www (build) folder, not src/service-worker.js

edit package.json, add  "dist": "ng build && workbox injectManifest"  Then run $ npm run dist to build.  Then run $ npx cap serve 

alternatively, http-server can be used, that will use /www file. e.g.  http-server www -c-1 -o -a -S localhost -p 8200

HTTPS: PWA works on localhost, 192.168.x.x . Others need HTTPS. It won’t work on non-SSL, took some time to find out, as office wifi is not Class C network. Yet it runs okay at home.

 

 

 

Open file limit of tomcat and mysql in Linux server

December 1, 2018|電腦編程

唔想每個server 行一次 ssh 再run command,寫個script 同做一次所有servers 既時間差。不過下次再run 就可以慳好多時間。IaC / automation always win. Ansible playbook 可能都有,可惜冇機會用到Ansible 。

放左去gist。有用既請拍下 likecoin ,Thanks:)

1234...30...

 

如果你喜歡我的文章,請幫忙按 1-10次 LikeButton 化讚為賞,非常感謝!越喜歡當然可以越按越多 😛

搜尋 Search

簡介 Bio

香港人,現居南十字星空下。

為人貪心,科技、生活、財經、散文 皆有興趣,周身刀冇張利。

思想矛盾,喜歡現在work-life balance 既生活又懷念a city never sleep。

 

每月送我一杯咖啡支持我: liker.land/hang321




分類 Categories

  • 好文閱讀
  • 時事評論
  • 未分類
  • 生活記事
  • 科技資訊
  • 金融財經
  • 電腦編程
  • 音樂電影

文章存檔 Archives




熱門文章 Popular Posts

  • Install XPEnology (DSM) 5.1 on ESXi 6 (HP MicroServer Gen 8)
    Install XPEnology (DSM) 5.1 on ESXi 6 (HP MicroServer Gen 8) June 8, 2015
  • 呢幾日個blogger 有問題….
    呢幾日個blogger 有問題…. October 28, 2004
  • assembly
    assembly February 11, 2006
  • 新工作
    新工作 January 6, 2009
  • 嫁人要嫁工程師
    嫁人要嫁工程師 April 27, 2006

標籤雲 Tag Cloud

CentOS Character chroot Cluster crash cryptography DD-WRT debug Domino DSM Dual Core DWA email ESXi GCP git google HylaFax IE Java Javascript JRE LikeCoin Linux log LotusScript mint MX MySQL nginx PKI PowerShell Qwiklabs srt telent VMware vpn vSphere WinXP wordpress XPEnology 專欄 網絡資訊 選股 風帆

日曆 Calendar

March 2023
M T W T F S S
  « Feb    
 12345
6789101112
13141516171819
20212223242526
2728293031  

Follow Me

Follow Us on RSSFollow Us on TwitterFollow Us on YouTube

文章存檔 Archives

Copyright © 2004-2021 hang321.net. All Rights Reserved