ニフクラ mobile backendは3月末で終了します。

ニフクラ mobile backendからの移行先として、お勧めしているのがParse Serverです。設計思想が近く、変更するコード量が少なく済むのではないかと思います。

Parse ServerではWebアプリやCordova（Monaca）アプリ向けにSDKを提供していますが、ドキュメントは英語のみとなっています。そこで、各機能の使い方を解説します。今回は地図アプリなどで使える位置情報オブジェクトの使い方を解説します。

JavaScript SDKのインストール

JavaScript SDKはCDN版を使うか、npmでインストールする方法があります。CDNの場合は、下記のタグでインストールできます。

<script src="https://npmcdn.com/parse/dist/parse.min.js"></script>

npmの場合は、下記のコマンドでインストールできます。

npm install parse

ただし、JavaScript SDKはTypeScript用の型定義を提供していませんので注意してください。

初期化

SDKの初期化は任意の場所で行えますが、npmの場合はまずインポートが必要です。

const Parse = require('parse');
// または
import Parse from 'parse';

React Nativeの場合は下記になります。

const Parse = require('parse/react-native.js');
// または
import Parse from 'parse/react-native';

さらにNode.js向けは以下になります。

const Parse = require('parse/node');
// または
import Parse from 'parse/dist/parse.min.js';

初期化はアプリIDとJavaScriptキーを指定します。さらにサーバーURLを指定します。

Parse.initialize("YOUR_APP_ID", "YOUR_JAVASCRIPT_KEY");
Parse.serverURL = 'http://YOUR_PARSE_SERVER:1337/parse'

位置情報オブジェクトの作成

Parseの位置情報オブジェクトの作成は Parse.GeoPoint になります。緯度経度をオブジェクトで指定します。

const point = new Parse.GeoPoint({latitude: 40.0, longitude: -30.0});
placeObject.set("location", point);

取得する際には get メソッドを使います。

placeObject.get("location");

位置情報検索

位置情報検索は複数のメソッドがありますが、基本は ParseObject.GetQuery を使った方法で変わりません。

// ユーザーの位置情報を取得
const userGeoPoint = userObject.get("location");
// クエリーを作成
const query = new Parse.Query(PlaceObject);
// ユーザーの位置情報から近いデータを取得
query.near("location", userGeoPoint);
// 検索実行
const placesObjects = await query.find();

二つの位置情報を指定する、 withinGeoBox メソッドなども用意されています。

const southwestOfSF = new Parse.GeoPoint(37.708813, -122.526398);
const northeastOfSF = new Parse.GeoPoint(37.822802, -122.373962);

const query = new Parse.Query(PizzaPlaceObject);
query.withinGeoBox("location", southwestOfSF, northeastOfSF);
const pizzaPlacesInSF = await query.find();

他、位置情報検索系は以下のようなメソッドがあります。

withinKilometers(key, point, maxDistance, sorted)
withinMiles(key, point, maxDistance, sorted)
withinRadians(key, point, maxDistance, sorted)

ポリゴン

複数の位置情報を用いたポリゴンを利用できるのはParse Serverのみです。

const points = [[0,0], [0,1], [1,1], [1,0]];
const inside = new Parse.GeoPoint(0.5, 0.5);
const outside = new Parse.GeoPoint(10, 10);
const polygon = new Parse.Polygon(points);
// trueが返ってくる
polygon.containsPoint(inside);
// falseが返ってくる
polygon.containsPoint(outside);

検索する場合には withinPolygon を使います。

query.withinPolygon("location", [geoPoint1, geoPoint2, geoPoint3]);
const robjectsWithGeoPointInPolygon = await query.find();

まとめ

Parse Serverの位置情報オブジェクトは、NCMBと変わらず利用できます。なお、Parseにはポリゴンという複数の位置情報を利用したオブジェクトがあります。

データの管理方法などはParse ServerとNCMBで似ています。他のmBaaSと比べると、全体の修正量はそこまで多くないと思われます。載せ替え先として検討に挙げてください。

JavaScript Developers Guide | Parse