阿里云-云开发平台入门篇——静态网站的全生命周期实战

本文涉及的产品
.cn 域名,1个 12个月
简介: 阿里云-云开发平台入门篇——静态网站的全生命周期实战

静态网站的全生命周期实战

云开发平台官网: 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了

下线&删除应用

在应用列表点击一下就好了
在这里插入图片描述
删除应用如下
在这里插入图片描述

目录
相关文章
|
6月前
|
小程序
云开发电商小程序实战教程-详情页原型
云开发电商小程序实战教程-详情页原型
|
小程序 JavaScript 前端开发
小程序云开发实战二:小程序云开发云函数安装依赖步骤
小程序云开发实战二:小程序云开发云函数安装依赖步骤
170 0
|
2月前
|
Java 开发工具 Maven
开发工具,能力强的伙伴可以直接参考官方文档
该教程详细介绍了如何使用Gluon将JavaFX项目编译成exe文件,涵盖开发工具配置、环境搭建及异常处理。开发工具包括Idea 2023.3、Gluon插件、Git和Maven等。环境搭建需安装VS 2022 Community、JDK 11或17+及GraalVM CE Gluon 22.1.0.1-Final,并配置相应环境变量。通过拉取示例项目、修改`pom.xml`并执行`build.bat`完成编译。教程还提供了异常处理及将编译动作绑定到Maven生命周期的方法。
53 0
|
3月前
|
监控 Linux 数据库连接
手把手教你从本地到云端:全面解析Blazor应用的部署流程与最佳实践,助你轻松掌握发布Blazor WebAssembly应用到Azure的每一个细节
【8月更文挑战第31天】本文详细介绍了将 Blazor 应用从本地部署到 Azure 的全过程。首先确保已在 Visual Studio 中创建 Blazor WebAssembly 应用,接着清理项目并配置发布选项。然后在 Azure 中创建 App Service 并完成应用部署。最后,配置环境变量、SSL 和监控,确保应用稳定运行。附带示例代码,展示如何加载和使用 Azure 环境变量。通过最佳实践指导,帮助你顺利完成 Blazor 应用的云端部署。
88 0
|
4月前
怎么使用零代码平台,在线搭建一套应用系统 — 敲敲云免费
怎么使用零代码平台,在线搭建一套应用系统 — 敲敲云免费
43 0
|
小程序 JavaScript 前端开发
小程序云开发全套实战教程(最全)
小程序云开发全套实战教程(最全)
130 0
|
JSON 小程序 前端开发
云开发入门第六章,云函数的讲解
云开发入门第六章,云函数的讲解
356 0
|
小程序 JavaScript 数据可视化
一分钟搭建小程序管理后台,借助云开发CMS搭建可视化的数据管理网页平台
一分钟搭建小程序管理后台,借助云开发CMS搭建可视化的数据管理网页平台
855 0
|
小程序 数据库
小程序云开发学习笔记
在app.js里面 小程序一开始就初始化,多次调用只有第一次触发
162 0
小程序云开发学习笔记
|
前端开发 Shell
如何使用阿里云云开发平台发布vuecli前端项目
如何使用阿里云云开发平台发布vuecli前端项目