前往控制台
文档

# Web 快速开始

# 准备工作

  1. 拥有腾讯云账号；
  2. 务必创建云开发环境，获得 环境 ID；
  3. 安装 Node.js (opens new window)；
  4. 安装 Cloudbase CLI。
npm install -g @cloudbase/cli

注意

如果 npm install -g @cloudbase/cli 失败，您可能需要修改 npm 权限 (opens new window)，或者以系统管理员身份运行：

sudo npm install -g @cloudbase/cli

# 第 1 步：创建初始项目

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

    <html>
  <head>
    <meta charset="utf-8" />
    <script src="https://imgcache.qq.com/qcloud/cloudbase-js-sdk/1.3.3/cloudbase.full.js"></script>
    <script>
      const app = cloudbase.init({
        env: "您的环境ID" // 此处填入您的环境ID
      });
      app
        .auth()
        .signInAnonymously()
        .then(() => {
          alert("登录云开发成功！");
        });
    </script>
  </head>
  <body>
    Hello Cloudbase!
  </body>
</html>

    以下是 cloudbaserc.json 的内容：

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

    # 第 2 步：添加安全域名

    登录云开发 CloudBase 控制台 (opens new window)，在安全配置 (opens new window)页面中，将域名添加到 Web 安全域名中。

    提示

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

    # 第 3 步：开启匿名登录

    请参考：开启匿名登录授权

    # 第 4 步：开启本地开发环境

    在项目根目录运行：

    npx serve

    即可打开一个本地静态服务器，然后访问 http://localhost:5000 (opens new window)

    提示

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

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

    # 第 5 步（可选）：使用云开发部署静态页面

    1. 开通 静态网站服务 (opens new window)
    2. 在项目根目录下运行以下命令，上传网站文件：
    cloudbase hosting deploy index.html

    注意

    在运行 cloudbase hosting deploy 之前，请先登录命令行工具：

    cloudbase login
    1. 使用 envId-instanceId.tcloudbaseapp.com 访问您的网站，其中 envId 与 instanceId 是您 CloudBase 环境的标识符。

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

    # 查看更多示例

    ← Flutter 快速开始 →