web开发快速新建html,web快速开始

准备工作

npm install -g @cloudbase/cli

? 如果 npm install -g @cloudbase/cli 失败,您可能需要修改 npm 权限,或者以系统管理员身份运行:

sudo npm install -g @cloudbase/cli

第 1 步:创建初始项目

"MacOS 或 Linux"

使用命令行创建目录 my-cloudbase-app,和其下的两个文件。

mkdir my-cloudbase-app && cd my-cloudbase-app && touch index.html && touch cloudbaserc.json

该目录下存在两个文件:index.html 与 cloudbaserc.json

├── cloudbaserc.json

└── index.html

Windows

创建 my-cloudbase-app 文件夹

在此文件夹下,创建两个空白文件 index.html 与 cloudbaserc.json

以下是 index.html 内容,我们尝试登录云开发,如果成功,那么产生一个弹窗:

const app = tcb.init({

env: "您的环境ID" // 此处填入您的环境ID

});

app

.auth()

.signInAnonymously()

.then(() => {

alert("登录云开发成功!");

});

Hello Cloudbase!

以下是 cloudbaserc.json 的内容:

{

"envId": "此处填入您的环境ID"

}

第 2 步:添加安全域名

登录腾讯云 云开发控制台,选择左侧菜单栏【环境】>【环境设置】,单击【安全配置】,将域名添加到【Web 安全域名】中。

dd2119491ca64e42ce47c7ac59afa950.png

? 这里我们把 localhost:5000 加入到安全域名中,让此域名下的页面可以使用 SDK 访问云开发服务。

第 3 步:开启匿名登录

第 4 步:开启本地开发环境

在项目根目录运行:

npx serve

? 如果 SDK 成功使用匿名身份登录,那么您应该可以看到一个弹窗。

登录成功后,便可以访问和使用云开发的各类资源,详情请参看 Web SDK 文档

第 5 步(可选):使用云开发部署静态页面

在项目根目录下运行以下命令,上传网站文件:

cloudbase hosting:deploy index.html

? 在运行 cloudbase hosting:deploy 之前,请先登录命令行工具:

cloudbase login

使用 envId.tcloudbaseapp.com 访问您的网站

详情请参考静态网站托管相关文档

查看更多示例

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值