❤
npm
Sign UpSign In

ncmb-react-native
TypeScript icon, indicating that this package has built-in type declarations

2.0.14 • Public • Published

React Native SDK for NCMB（ニフクラ mobile backend）

ニフクラ mobile backendをReact Nativeから操作するためのSDKです。詳細な使い方はブログでもご覧いただけます。

v2から大幅に利用法が変わっています。v1のREADMEはこちら。

インストール

npm i ncmb-react-native -S

使い方

読み込み

必要なものを取得してください。

import NCMB, { NCMBUser, NCMBObject, NCMBQuery, 
  NCMBFile, NCMBAcl, NCMBRole, 
  NCMBRequest, NCMBRelation, NCMBGeoPoint, 
  NCMBInstallation, NCMBPush } from 'ncmb-react-native';
  • NCMBUser（会員管理）
  • NCMBObject（データストア。保存、更新、削除）
  • NCMBQuery（データストア。検索、取得）
  • NCMBFile（ファイルストア）
  • NCMBAcl（権限管理）
  • NCMBRole（ロール、ユーザやロールのグルーピング）
  • NCMBRequest（NCMBへのリクエスト用。通常は利用しません）
  • NCMBRelation（データストアのリレーション）
  • NCMBGeoPoint（位置情報）
  • NCMBInstallation（デバイストークン）
  • NCMBPush（プッシュ通知）

初期化

const applicationKey = 'YOUR_APPLICATION_KEY';
const clientKey = 'YOUR_CLIENT_KEY';
new NCMB(applicationKey, clientKey);

データストア

データ保存

const obj = new NCMBObject('Test');
await obj
  .set('message', 'Hello, world')
  .save();
データ型
const obj = new NCMBObject('Test');
await obj
  .set('message', 'Hello, world')
  .set('number', 500)
  .set('date', new Date)
  .set('object', {a: 'b', c: 'd'})
  .set('array', [1, 2, 3, 'test'])
  .save();

データ更新

const obj = new NCMBObject('Test');
await obj
  .set('message', 'Hello, world')
  .save();
await obj
  .set('message', 'Hello, again')
  .save();

データ取得

obj2.set('objectId', 'OBJECT_ID');
await obj2.fetch();

インクリメント

const obj = new NCMBObject('Test');
await obj
  .set('num', 1)
  .save();
await obj.setIncrement('num', 1).save();
await obj.fetch();
obj.get('num') // -> 2

配列操作

追加
const obj = new NCMBObject('Test');
await obj
  .set('ary', ['first'])
  .save();
await obj
  .add('ary', 'second')
  .save();
await obj.fetch();
obj.get('ary')) // -> ['first', 'second']
削除
const obj = new NCMBObject('Test');
await obj
  .set('ary', ['first', 'second'])
  .save();
await obj
  .remove('ary', 'second')
  .save();
await obj.fetch();
obj.get('ary') // -> ['first']
追加（ユニーク）
const obj = new NCMBObject('Test');
await obj
  .set('ary', ['first', 'second'])
  .save();
await obj
  .addUnique('ary', ['second', 'third'])
  .save();
await obj.fetch();
obj.get('ary') // => ['first', 'second', 'third']

データ削除

await obj.delete();

位置情報

const obj = new NCMBObject('Test');
const geo = new NCMBGeoPoint(30.0, 130.0);
await obj
  .set('geo', geo)
  .save();

クエリー

通常

const query = new NCMBQuery('Test');
const ary = await query.fetchAll();

利用できるオペランド

  • equalTo(name: string, value: any): NCMBQuery
  • notEqualTo(name: string, value: any): NCMBQuery
  • greaterThan(name: string, value: any): NCMBQuery
  • greaterThanOrEqualTo(name: string, value: any): NCMBQuery
  • lessThan(name: string, value: any): NCMBQuery
  • lessThanOrEqualTo(name: string, value: any): NCMBQuery
  • in(name: string, value: any): NCMBQuery
  • notIn(name: string, value: any): NCMBQuery
  • exists(name: string): NCMBQuery
  • notExists(name: string): NCMBQuery
  • inArray(name: string, value: any): NCMBQuery
  • notInArray(name: string, value: any): NCMBQuery
  • allInArray(name: string, value: any): NCMBQuery
  • regularExpressionTo(name: string, value: RegExp): NCMBQuery
  • near(name: string, geo: NCMBGeoPoint): NCMBQuery
  • withinKilometers(name: string, geo: NCMBGeoPoint, distance: number): NCMBQuery
  • withinMiles(name: string, geo: NCMBGeoPoint, distance: number): NCMBQuery
  • withinRadians(name: string, geo: NCMBGeoPoint, distance: number): NCMBQuery
  • withinSquare(name: string, southWestGeo: NCMBGeoPoint, northEastGeo: NCMBGeoPoint): NCMBQuery

そのほかのパラメータ

  • limit(value: number): NCMBQuery {
  • skip(value: number): NCMBQuery {
  • order(name: string, desc: boolean = false): NCMBQuery {
  • include(name: string): NCMBQuery {

件数取得

const query = new NCMBQuery('Test');
const {count, results} = await query.count().fetchWithCount();

OR検索

const query = new NCMBQuery('Test');

const query1 = new NCMBQuery('Test');
const query2 = new NCMBQuery('Test');
query1.equalTo('number', 0);
query2.equalTo('number', 2);

const ary = await query.or([query1, query2]).fetchAll();

サブクエリー

const queryTest = new NCMBQuery('Test');
const queryTest2 = new NCMBQuery('Test2');
queryTest2.in('num', [1,4]);
const ary = await queryTest
  .select('number', 'num', queryTest2)
  .fetchAll();

サブクエリー（オブジェクト）

const queryTest = new NCMBQuery('Test');
const queryTest2 = new NCMBQuery('Test2');
queryTest.in('number', [1,4]);
const ary3 = await queryTest2
  .inQuery('num', queryTest)
  .include('num')
  .fetchAll();

位置情報

付近検索
const tokyoTower = new NCMBGeoPoint(35.6585805, 139.7454329);
const query = new NCMBQuery('Station');
const ary = await query
  .withinKilometers('geo', tokyoTower, 2)
  .fetchAll();
ボックス検索
const geo1 = new NCMBGeoPoint(35.6622568, 139.7148997);
const geo2 = new NCMBGeoPoint(35.6206607, 139.7049691);
const query = new NCMBQuery('Station');
const ary = await query
  .withinSquare('geo', geo1, geo2)
  .fetchAll();

リレーション

作成

const item1 = new NCMBObject('Test');
await item1.set('message', 'Hello, world from item1').save();
const item2 = new NCMBObject('Test');
await item2.set('message', 'Hello, world from item2').save();

const relation = new NCMBRelation('Test');
relation.add(item1).add(item2);

const mainObj = new NCMBObject('Main');
await mainObj.set('relation', relation).save();

取得

const query = new NCMBQuery('Test');
const ary = await query
  .relatedTo(mainObj, 'relation')
  .fetchAll();

削除

const relation = new NCMBRelation('Test');
relation.remove(item1);
await mainObj
  .set('relation', relation)
  .save();

ロール

作成

const role = new NCMBRole;
role
  .set('roleName', 'admin');
await role.save();

削除

await role.delete();

ユーザ追加

await role.addUser(user).save();

所属ユーザ取得

const query = NCMBRole.query();
const role2 = await (query
  .equalTo('roleName', roleName)
  .fetch()) as NCMBRole;
const users = await role2.fetchUser();

検索

const query = NCMBRole.query();
const role2 = await (query
  .equalTo('roleName', roleName)
  .fetch()) as NCMBRole;

子ロール追加

await role
  .addRole(role2)
  .save();

子ロール取得

const query = NCMBRole.query();
const role = await (query
  .equalTo('roleName', roleName)
  .fetch()) as NCMBRole;
const roles = await role
  .fetchRole();

会員管理

ユーザ登録（ID、パスワード）

const user = new NCMBUser;
user
  .set('userName', 'tester')
  .set('password', 'tester');
await user.signUpByAccount();

ユーザ削除

await user.delete();

ログアウト

NCMBUser.logout();

ユーザ登録メール送信

await NCMBUser
  .requestSignUpEmail(`test@example.com`);

ログイン

const user = await NCMBUser
  .login('tester', 'tester');

ログイン（メールアドレス）

const user = await NCMBUser
  .loginWithMailAddress(config.test.emailAddress, config.test.password);

永続化

LocalStrage系のインタフェースを持ったライブラリ、オブジェクトが利用できます。

ncmb.storage = LocalStorage;

想定

  • LocalStorage (for web)
  • @react-native-async-storage/async-storage

復元する場合

const user = await NCMBUser.currentUser();

匿名ログイン

const user = await NCMBUser.loginAsAnonymous();

ソーシャルログイン

NCMBUser.signUpWith(provider: string, authData: authData)

が公式対応しています。必要なパラメータ authData は公式ドキュメント（リンク先）を参照してください。

ファイルストア

アップロード（テキストファイル）

const fileName = 'test.csv';
const file = await NCMBFile.upload(fileName, '1,2,3');

アップロード（バイナリファイル）

const fileName = 'test.jpg';
const blob = await promisify(fs.readFile)(`./test/${fileName}`);
const file = await NCMBFile.upload(fileName, blob);

ファイル削除

await file.delete();

ファイルダウンロード（テキストファイル）

const download = await file.download();

ファイルダウンロード（バイナリファイル）

const download = await file.download('binary');
download.type // -> eg. image/jpeg

ファイルダウンロード（DataURI）

const download = await file.download('datauri');

ファイル取得

const query = NCMBFile.query();
const files = await query.fetchAll();
// 検索
const files2 = await query.regularExpressionTo('fileName', /^.*?\.txt/).fetchAll();
const files3 = await query.greaterThan('fileSize', 8).fetchAll();

ファイルアップロード（ACL付き）

const acl = new NCMBAcl;
acl
  .setPublicReadAccess(false)
  .setUserWriteAccess(loginUser, true)
  .setUserReadAccess(loginUser, true);
const text = '1,2,3';
const fileName = 'acl2.csv';
const file = await NCMBFile.upload(fileName, text, acl);

デバイストークン

登録

const installation = new NCMBInstallation;
await installation
  .set('deviceToken', 'aaa')
  .set('deviceType', 'ios')
  .save();

更新

const installation = new NCMBInstallation;
await installation
  .set('deviceToken', 'aaa')
  .set('deviceType', 'ios')
  .set('message', 'Hi!')
  .save();
await installation
  .set('message', 'Hello')
  .save();

取得

await installation.fetch();

削除

await installation.delete();

検索

const query = NCMBInstallation.query();
const ary = await query
  .fetchAll();

プッシュ通知

登録

const push = new NCMBPush;
await push
  .set('immediateDeliveryFlag', true)
  .set('target', ['ios'])
  .save();

取得

await push.fetch();

更新

const push = new NCMBPush;
await push
  .set('immediateDeliveryFlag', true)
  .set('message', 'Hello')
  .set('target', ['ios'])
  .save();
await push
  .set('message', 'Hello, again')
  .save();

配信条件の設定

const query = NCMBPush.query();
query
  .equalTo('objectId', 'aaa');
const push = new NCMBPush;
await push
  .set('immediateDeliveryFlag', true)
  .set('message', 'Hello')
  .set('searchCondition', query)
  .set('target', ['ios'])
  .save();

削除

await push.delete());

License

MIT.

Readme

Keywords

none

Package Sidebar

Install

npm i ncmb-react-native

Weekly Downloads

0

Version

2.0.14

License

MIT

Unpacked Size

1.33 MB

Total Files

67

Last publish

Collaborators

  • moongift
Try on RunKit
Report malware