[Day30] GCP云端部属说明(前後端)

How - 部属MongoDB

  1. 登入以下网址
    https://www.mongodb.com/cloud/atlas

  2. 点选Start Free (一个Mail帐号可以提供一个免费的Sandbox 512mb空间的MongoDB)

  3. 填写基本资料

  4. 选取Create a cluster 开始吧

  5. 选取Cloud的供应商,这边我们选择GCP,在选择GCP在台湾的机房,未来也可以依照你想要提供服务的区域进行相关的选择部属

  6. 选择M0 Sandbox,此为开发与测试环境,当需要部署到正式环境时可以修改设定即可不停机的状况下轮巡升级

  7. 进阶设定包含备份等机制,可以在这边设定,不过需要付费的才有。再输入Cluster 名称即可点下Create

  8. 这边如果选择付费的服务,则会显示价钱by hour 收费

  9. 接下来等待完成建置

  10. 建立DB使用者,并选取其角色 (https://docs.atlas.mongodb.com/security-add-mongodb-users/#database-user-privileges)



  11. 建立可连线到DB的IP白名单,很重要,建议一定要设定,避免被骇客加密勒索 (也可以设定CDN等网址进行授权)



  12. 回到Cluster,点选Connect,这里可以依照需求选取连线方式,透过AP连线可以取得连线字串,并且可以取得对应程序语言的SampleCode,是不是很方便呢!!



  13. 到这就完成MongoDB的部属

How - 部属GO API

  1. 登入GCP
    https://console.cloud.google.com
  2. Creating a Cloud project
gcloud projects create PROJECT_ID
  1. Create your App Engine app
gcloud app create
  1. 准备yaml档案 (follow Structuring your files)
runtime: go114  # or go112 or go113 for Go 1.12 or Go 1.13

instance_class: F2

env_variables:
  BUCKET_NAME: "example-gcs-bucket"

handlers:
- url: /stylesheets
  static_dir: stylesheets

- url: /(.*\.(gif|png|jpg))$
  static_files: static/\1
  upload: static/.*\.(gif|png|jpg)$

- url: /.*
  script: auto
  1. Deploy
gcloud app deploy
  1. View (https://PROJECT_ID.REGION_ID.r.appspot.com)
gcloud app browse
  1. Finished

How - 部属Web

  1. 将Angular Project先行编译
ng build --prod
  1. 准备app.yaml档案
runtime: python27
api_version: 1
threadsafe: true
handlers:


# Initial route that will serve up index.html, main entry point to your app


- url: /
secure: always
static_files: {$ your app folder name}/index.html
upload: {$ your app folder name}/.*


# Routing for typedoc, assets and favicon.ico to serve directly


- url: /((?:assets|docs)/.*|favicon\.ico)
secure: always
redirect_http_response_code: 301
static_files: {$ your app folder name}/\1
upload: {$ your app folder name}/.*


# Routing for any js files
- url: /(.*\.js)
secure: always
redirect_http_response_code: 301
static_files: {$ your app folder name}/\1
upload: {$ your app folder name}/.*\.js


# Routing for any css files


- url: /(.*\.css)
secure: always
redirect_http_response_code: 301
static_files: {$ your app folder name}/\1
mime_type: text/css
upload: {$ your app folder name}/.*\.css


# Routing for anything (wild card) after
- url: /.*
secure: always
static_files: {$ your app folder name}/index.html
upload: {$ your app folder name}/.*
  1. 将Angular Build 的 dist 里面的资料夹和 app.ymal 上传

  2. Deploy

gcloud app deploy
  1. Finished

<<:  [DAY 30] 总结及回顾

>>:  拯救资工系学生的基本素养—程序除错的心得&方法

WordPress Google Search Console 安装教学 让新文章马上列入搜寻名单

新建置的 WordPress 辛苦写了几篇文章,可是这时候跟本就不会被 Google 搜寻看到我的文...

Day 19-infrastructure 也可以 for each 之四:for & dynamic block

这篇是 infrastructure 也可以 for each 第四篇,上次漏发了,今天补发 本章介...

[Day 25] Facial Alignment

有了前两天的人脸关键点侦测後,我们今天终於要谈到人脸对齐 (Facial Alignment)这个工...

Day10 - 今天只先铺底座标轴,明天来画 BMO

var canvasBmo = document.getElementById('canvasBmo...

[Day27] 建立购物车系统 - 10

本篇同步发文在个人Blog: 一袋.NET要扛几楼?打造容器化的ASP.NET Core网站!系列文...