靜態網站的全生命周期實戰
- 創建應用
- 開發部署
- 下線&洗掉應用

靜態網站的全生命周期實戰

云開發平臺官網：https://workbench.aliyun.com/

往期文章：
阿里云開發平臺普及篇——創建應用

創建應用

這里我們使用默認的產品，就不再創建產品了

在這里插入圖片描述

然后會有一些依賴服務，沒開通的話開通一下就好了

在這里插入圖片描述
然后就可以看到我們剛創建的demo了

在這里插入圖片描述

開發部署

在這里插入圖片描述
然后就會跳轉到一個云端的 IDE

在這里插入圖片描述

左上角這個是提供的workbench插件，有部署和除錯功能

.workbench檔案是來做一些默認的配置

{
  "fcRouteDefault" : [  // 可以理解為路由表
    {"apiUri":"/*",  // 匹配路徑
     "fcHandler":"serverless.handler",  // 請求處理
     "httpMethod":"ANY"
    }
  ],
  "cicd": {  // 部署要執行
    "package": "mkdir zip && rsync -a --exclude node_modules/ --exclude package-lock.json --exclude zip/ . ./zip && cd zip && npm install --production && zip -r ../code.zip ./ -x '*.git*' -x '*.zip' -x '.DS_Store' && cd ../ && rm -rf zip"
  }
}

開發一個最簡單的頁面
新建一個index.html檔案
在這里插入圖片描述
隨便寫一寫

我們可以除錯一下

可以看到，控制臺輸出了除錯的日志資訊

在這里插入圖片描述
我們可以點擊控制臺的url進行訪問，也可以勾選預覽模式，這樣直接在IDE中就可以看到網頁

在這里插入圖片描述
處理請求的代碼在serverless.js檔案中，可以看到默認訪問的檔案

然后我這邊使用一個案例demo，大家需要的話可以訪問 https://github.com/royalrover/demo 進行下載，我將下載好的檔案直接拖到 IDE，如下

然后我們再進行除錯，可以看到靜態html頁面顯示出來了
在這里插入圖片描述
然后進行部署，直接點擊部署即可

部署完成后，我們會得到一個測驗域名，這個域名就可以公網訪問，但是這個域名是有時效的，我們可以在應用頁面進行查看
在這里插入圖片描述
我們訪問測驗域名看一下

然后還有一個二級域名，二級域名需要系結到我們自己的域名上，在域名決議中添加一條記錄即可【記錄值填二級域名就好了】
然后在云開發平臺系結我們的域名與二級域名的關系，在應用串列頁點擊應用配置
在這里插入圖片描述
把自己的域名輸入到系結域名即可

最后重新部署一下就ok了

下線&洗掉應用

在應用串列點擊一下就好了
在這里插入圖片描述
洗掉應用如下

轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/240589.html

標籤：區塊鏈

上一篇：Vue-cli安裝及使用

下一篇：Flutter AppBar定義頂部Tab切換（滑動）

阿里云-云開發平臺入門篇——靜態網站的全生命周期實戰

靜態網站的全生命周期實戰

創建應用

開發部署

下線&洗掉應用