const AV = require('leancloud-storage');
const { Realtime, TextMessage } = require('leancloud-realtime');
// For a list of all members exposed by Rich Media Message Plugin, refer to its API doc: https://leancloud.github.io/js-realtime-sdk/plugins/typed-messages/docs/module-leancloud-realtime-plugin-typed-messages.html
const { TypedMessagesPlugin, ImageMessage } = require('leancloud-realtime-plugin-typed-messages');
To avoid compatibility issues, the JavaScript SDK has been distributing ES5 code with all the polyfills (e.g. Promise) bundled.
Since v5.0.0-rc.2, the JavaScript LeanMessage SDK also offers a version targeted to the latest version of ECMAScript, which has a smaller size and better runtime optimization for use in scenarios that only need compatibility with latest browsers.
If your application uses @babel/preset-env or something similar, you can also use the latest ECMAScript version of LeanCloud SDK, and let Babel or other tools to compile your code to the specific ECMAScript version you need.
Since the latest version of ECMAScript changes every year, and the goal of that version is to provide code that is aligned with the latest standards, introducing new features from newer versions of ECMAScript will not be considered as a breaking change.
The current version of ECMAScript is 2020.
JavaScript SDK also works with Node.js. If you plan to use LeanStorage within LeanEngine, you can import leanengine into your project by following instructions in LeanEngine Quick Start.
Installing and Referencing SDK
You can use npm to install and reference our SDK for Node.js as well. See npm for more details.
React Native
You can use npm to install and reference our SDK for React Native.
React Native support is provided by a separate adapter library (@leancloud/platform-adapters-react-native).
Installing:
# Step 1: Install
$ yarn add leancloud-storage @leancloud/platform-adapters-react-native @react-native-community/async-storage@1
# Step 2: Link
# For React Native 0.60+
$ npx pod-install
# For React Native <= 0.59
# npx react-native link @react-native-community/async-storage
# For Expo >= 38
# No need to link.
# Step 1: Install
$ yarn add leancloud-storage @leancloud/platform-adapters-react-native @react-native-community/async-storage@1
# Step 2: Link
# For React Native 0.60+
$ npx pod-install
# For React Native <= 0.59
# npx react-native link @react-native-community/async-storage
# For Expo >= 38
# No need to link.
# Step 1: Install
$ yarn add leancloud-realtime leancloud-realtime-plugin-typed-messages leancloud-storage @leancloud/platform-adapters-react-native @react-native-community/async-storage@1
# Step 2: Link
# For React Native 0.60+
$ npx pod-install
# For React Native <= 0.59
# npx react-native link @react-native-community/async-storage
# For Expo >= 38
# No need to link.
Referencing:
import AV from 'leancloud-storage/core';
import * as adapters from '@leancloud/platform-adapters-react-native';
AV.setAdapters(adapters);
import AV from 'leancloud-storage/live-query-core';
import * as adapters from '@leancloud/platform-adapters-react-native';
AV.setAdapters(adapters);
import { Realtime, setAdapters } from 'leancloud-realtime/im';
import * as adapters from '@leancloud/platform-adapters-react-native';
setAdapters(adapters);
import AV from 'leancloud-storage/core';
import { Realtime, setAdapters } from 'leancloud-realtime/im';
import { TypedMessagesPlugin, ImageMessage } from 'leancloud-realtime-plugin-typed-messages';
import * as adapters from '@leancloud/platform-adapters-react-native';
AV.setAdapters(adapters);
setAdapters(adapters);
Electron
Electron uses npm for managing dependencies. You can install our SDK with the following command:
The way of using script to import the SDK works in most scenarios. However, if you have the following needs, you can also use require('leancloud-storage') to import the SDK as Node.js modules:
Using the SDK in the main process
Constructing AV.File with Buffer or Stream provided by Node.js
require and script import two different sets of SDK. Each of them needs to be initialized separately and cannot be used interchangeably.
Other
The JavaScript SDK provides platform-independent versions to support other platforms.
All platform-related APIs are abstracted into configurable adapters, which need to be configured for the target platform after introducing the SDK core.
Assuming there is an adapter package (platform-adapters-xyz) for a platform (xyz) on npm, you can configure the JavaScript SDK as follows:
const AV = require('leancloud-storage/core');
const adapters = require('platform-adapters-xyz');
AV.setAdapters(adapters);
const AV = require('leancloud-storage/live-query-core');
const adapters = require('platform-adapters-xyz');
AV.setAdapters(adapters);
You can implement your own adapter for a target platform.
Interface definitions for adapters can be found in the @leancloud/adapter-types package.
You can also search for adapters contributed by other developers with the keyword platform-adapters.
const realtime = new Realtime({
appId: '{{appid}}',
appKey: '{{appkey}}',
});
const realtime = new Realtime({
appId: '{{appid}}',
appKey: '{{appkey}}',
// Register plugins for rich media messages
plugins: [TypedMessagesPlugin],
});
// You need to initialize LeanStorage, too.
AV.init({
appId: "{{appid}}",
appKey: "{{appkey}}"
});
Enabling Debug Logs
You can easily trace the problems in your project by turning debug logs on during the development phase. Once enabled, details of every request made by the SDK along with errors will be output to IDE, browser console, or your app's Dashboard > LeanEngine > App logs.
const AV = require('leancloud-storage');
AV.debug.enable();
AV.debug.disable();
const AV = require('leancloud-storage');
AV.debug.enable();
AV.debug.disable();
This guide is written for the latest version of our SDK. If you encounter any error, please first make sure you have the latest version installed.
401 Unauthorized
If you get a 401 error or see the following content in network logs:
{
"code": 401,
"error": "Unauthorized."
}
It means that the App ID or App Key might be incorrect or don't match. If you have multiple apps, you might have used the App ID of one app with the App Key of another one, which will lead to such error.
Client Cannot Access the Internet
Make sure you have granted enough permissions for your mobile app.
How to Install the JavaScript SDK
Installing SDK
Depending on the platform you're using, there are different ways for you to install the SDK.
Web
The following method can be used if your project runs in browser, WebView, or other in-app HTML platforms.
Installing and Referencing SDK
npm
The easiest way to integrate our SDK into your project is to use npm:
Create references to the SDK with
require
:To avoid compatibility issues, the JavaScript SDK has been distributing ES5 code with all the polyfills (e.g. Promise) bundled. Since v5.0.0-rc.2, the JavaScript LeanMessage SDK also offers a version targeted to the latest version of ECMAScript, which has a smaller size and better runtime optimization for use in scenarios that only need compatibility with latest browsers. If your application uses
@babel/preset-env
or something similar, you can also use the latest ECMAScript version of LeanCloud SDK, and let Babel or other tools to compile your code to the specific ECMAScript version you need. Since the latest version of ECMAScript changes every year, and the goal of that version is to provide code that is aligned with the latest standards, introducing new features from newer versions of ECMAScript will not be considered as a breaking change. The current version of ECMAScript is 2020.If you want to try out this version:
CDN
You can also import the SDK with a
script
tag:When using this method, you can reference the SDK with the global variable
AV
:If you want to try out the latest ECMAScript version of LeanMessage SDK:
Node.js
JavaScript SDK also works with Node.js. If you plan to use LeanStorage within LeanEngine, you can import
leanengine
into your project by following instructions in LeanEngine Quick Start.Installing and Referencing SDK
You can use npm to install and reference our SDK for Node.js as well. See npm for more details.
React Native
You can use npm to install and reference our SDK for React Native. React Native support is provided by a separate adapter library (
@leancloud/platform-adapters-react-native
).Installing:
Referencing:
Electron
Electron uses npm for managing dependencies. You can install our SDK with the following command:
Importing SDK as Browser Scripts
You can import the SDK by adding a
script
tag into index.html:Importing SDK as Node.js Modules
The way of using
script
to import the SDK works in most scenarios. However, if you have the following needs, you can also userequire('leancloud-storage')
to import the SDK as Node.js modules:AV.File
withBuffer
orStream
provided by Node.jsrequire
andscript
import two different sets of SDK. Each of them needs to be initialized separately and cannot be used interchangeably.Other
The JavaScript SDK provides platform-independent versions to support other platforms. All platform-related APIs are abstracted into configurable adapters, which need to be configured for the target platform after introducing the SDK core. Assuming there is an adapter package (
platform-adapters-xyz
) for a platform (xyz) on npm, you can configure the JavaScript SDK as follows:Precompiled UMD files are also available, in case you cannot or do not want to use npm:
You can implement your own adapter for a target platform. Interface definitions for adapters can be found in the @leancloud/adapter-types package. You can also search for adapters contributed by other developers with the keyword platform-adapters.
Initializing Your Project
To begin with, get your App ID and App Key from your app's Dashboard > Settings > App Keys.
Enabling Debug Logs
You can easily trace the problems in your project by turning debug logs on during the development phase. Once enabled, details of every request made by the SDK along with errors will be output to IDE, browser console, or your app's Dashboard > LeanEngine > App logs.
Alternatively, you can enable debug logs via configuring
localStorage
(for browsers) orDEBUG
environment variable (for Node.js applications).For browsers:
For Node.js applications:
Make sure debug logs are turned off before your app is published. Failure to do so may lead to the exposure of sensitive data.
Verifying
First of all, make sure you are able to connect to LeanCloud server. You can test it by running the following command:
If everything goes well, it will return the current date:
Then add the following code into your project:
Save the file and run it.
Then go to your app's Dashboard > LeanStorage > Data >
TestObject
. If you see the following content, it means that you have correctly installed the SDK.See Debugging if you're not seeing the content.
Debugging
This guide is written for the latest version of our SDK. If you encounter any error, please first make sure you have the latest version installed.
401 Unauthorized
If you get a
401
error or see the following content in network logs:It means that the App ID or App Key might be incorrect or don't match. If you have multiple apps, you might have used the App ID of one app with the App Key of another one, which will lead to such error.
Client Cannot Access the Internet
Make sure you have granted enough permissions for your mobile app.