6. leanCloud 实现登录注册

安装

yarn add leancloud-storage

配置

注意：leanCloud推荐使用国际版，国内版需要自定义域名才能使用https
文档：安装sdk
文档：初始化
初始化需要的 appId 在创建的项目的设置-应用凭证里

import AV, { Query, User } from 'leancloud-storage';
// 初始化
AV.init({
  appId: "rp4figvP1pteyxRAyzYjRSHo-gzGzoHsz",
  appKey: "SsjIAupQFlvKqHtnpeOOan5j",
  serverURL: "https://please-replace-with-your-customized.domain.com"
});

编写登录注册API

参考文档

import AV, { Query, User } from 'leancloud-storage';
AV.init({
  appId: "rp4figvP1pteyxRAyzYjRSHo-gzGzoHsz",
  appKey: "SsjIAupQFlvKqHtnpeOOan5j",
  serverURL: "https://rp4figvp.lc-cn-n1-shared.com"
});
const Auth = {
  register(username: string, password: string) {
    const user = new User();
    user.setUsername(username);
    user.setPassword(password);
    return new Promise((resolve, reject) => {
      user.signUp().then((user) => resolve(user), (error) => reject(error))
      })
  },
  login(username: string, password:string) {
    return new Promise((resolve, reject) => {
      User.logIn(username, password).then((user) => resolve(user), (error) => reject(error));
    })
  },
  logOut() {
    User.logOut();
  },
  getCurrentUser() {
    return User.current()
  }
}
export default Auth;

在 store 中使用登录注册API

  @action login() {
    return new Promise((resolve, reject) => {
      Auth.login(this.values.username, this.values.password)
          .then(
            (user) => { 
              console.log('登录成功')
              resolve(user)
            }, 
            (err) => {
              console.log('登录失败')
              reject(err)
            })
    })
  }

在组件中使用 store

import { useStore } from '../store';
const Login: React.FC = () => {
  const {AuthStore} = useStore()
  const onFinish = (values: any) => {
    console.log('Success:', values);
    AuthStore.setUsername(values.username)
    AuthStore.setPassword(values.password)
    AuthStore.login().then((user) => {
      console.log(user)
      console.log('登录成功')
    }, (err) => {
      console.log('登录失败')
      console.log(err)
    })
  };
  // ...
}