使用Cloud DB构建APP 快速入门-Web篇

概述

Web应用的数据将会储存在云侧，本地不会缓存数据。在进行数据管理操作时，您将会直接操作云侧数据。Web SDK将会为您的应用与云数据库的通讯和通讯安全提供保障。

此示例应用演示了如何快速的使用Cloud DB构建简单的图书管理服务。通过快速入门和示例应用，您将会了解到如下信息：

• 如何使用Cloud DB进行应用开发。

• 应用数据如何写入到Cloud DB。

• 如何实现数据的查询。

• 实时侦听数据的更改。

• 体验端云数据同步等功能。

开发准备

使用Cloud DB构建应用服务，需要完成以下准备工作：

• 您已经在开发者联盟官网注册帐号并通过实名认证，详细请参见帐号注册认证。
• 您已经在AppGallery Connect控制台上创建项目和应用，详细请参见创建项目。
• 示例应用使用了认证用户的相关权限，需要开通AppGallery Connect认证服务中“匿名帐号”服务，详细请参见认证服务。
• 您已经获取到示例代码，请从示例代码获取。

注意事项

当对象类型中字段的默认值设置为中文字符或者其他特殊字符时，本地编辑器或IDE默认编码格式应设置为utf-8，否则会导致端云数据同步失败。

支持的浏览器

Cloud DBJavaScript SDK支持的浏览器：

服务

Chrome

Edge

Firefox

华为浏览器

Safari

UC浏览器

QQ浏览器

IE11

Cloud DB

√

√

√

√

√

√

√

√

说明

由于IE11只支持ES5，需要通过如下步骤将ES6配置为兼容ES5，让JavaScript SDK支持IE11。

1. 执行如下命令，安装babel-polyfill到您的项目中。

   npm install --save-dev babel-polyfill
   

2. 在代码入口主文件中导入babel-polyfill组件。

   import 'babel-polyfill';
   

3. 打开工程的配置文件，例如vue2.x+vue-cli中的webpack.base.conf.js文件，修改entry字段值，假设_main.js_是代码入口主文件。

   entry:['babel-polyfill','./src/main.js']
   

4. 在package.json文件中查看是否包含babel-loader，如果无babel-loader，请执行如下命令安装babel-loader。

   npm install babel-loader
   

5. 在工程的配置文件中添加如下规则，例如vue2.x+vue-cli中的webpack.base.conf.js文件。

   {
       test: /.js$/,
       loader: 'babel-loader',
       include: [resolve('node_modules/@agconnect/database')]
   }
   

启用服务

使用Cloud DB服务前，您需要先启用服务。

1. 登录