parse, cloud code 介紹
TRANSCRIPT
快速建構MVP的利器 -Parse, Cloud Code 介紹
Wan-Ting Jheng2015/5/19
Parse 提供以下服務
https://www.parse.com/apps/quickstart
功能一覽
● Data○ 基本的 CRUD 操作
○ 關聯式資料
○ ACL (Access Control List 安全性配置)
● Push 推送通知○ iOS, Andorid, Windows, Windows Phone 8
● Analytics○ Events, 錯誤回報
● Social 使用者相關○ 註冊、登入、email 驗證、忘記密碼、user session、FB login、Role
功能一覽(續)
● Cloud Code○ 網頁 前/後端 程式放置平台
○ 提供各平台 SDK
● Hosting○ 提供 subdomain.parseapp.com
○ 可以自訂網域名稱 連結至 parse app
○ 後台 Log：console.log, console.error, console.warn
○ Background Job 背景排程
● Embedded○ Arduino Yun, Raspberry pi, RTOS
使用 javascript - 網站示範
● MapPoint○ http://map-point.parseapp.com/
○ https://github.com/wantingj/MapPoint
○ 自製類似 google map 我的地圖 服務
● 提供以下功能
○ 使用者 登入/註冊/忘記密碼
○ 使用者建立新地圖
○ 地圖上增加地點
○ 待辦：地點呈現在 map 上 (還沒有空接上 google map api …)
● Data Class (可想像成 DB table)
○ User
○ MyMap
○ MapPoint
Parse.Object
● Parse 會自動替每一筆資料生成以下三個欄位○ id
○ createdAt
○ updatedAt
● 上述三個欄位可以直接取○ Obj.id
○ Obj.createdAt
○ Obj.updateAt
● 其於欄位要透過 getter/setter○ Obj.get(“name”)
○ Obj.set(“name”, “value”)
var MyMap = Parse.Object.extend("MyMap");var myMap = new MyMap();var currentUser = Parse.User.current();
myMap.set("name", “value”);myMap.set("author", currentUser); // 用物件存關聯
var myMapACL = new Parse.ACL(currentUser);myMapACL.setPublicReadAccess(true);myMap.setACL(myMapACL);
myMap.save(null, { success: function(object){ //... }, error: function(model, error) { // error = {code: number, message: string} }});
建立類別、物件
currentUser 已登入時，為 Parse.User；未登入時，為 null
設定變數值author 對應到 Parse.User 物件
資料存取設定此處示範：只有目前登入使用者可寫，所有人可讀
存入資料庫接受 success, error callback
新增地點
var MapPoint = Parse.Object.extend("MapPoint")var mapPoint = new MapPoint();
mapPoint.set("name", “value”);mapPoint.set("addr", “value”);mapPoint.set("map", myMap.id); // 用 id 存關聯
var myACL = new Parse.ACL(currentUser);myACL.setPublicReadAccess(true);mapPoint.setACL(myACL);
mapPoint.save(null, { success: function(object){ // ... }, error: function(model, error) { // error = {code: number, message: string} }});
設定變數值map 對應到 MyMap 物件 id
資料存取設定此處示範：只有目前登入使用者可寫，所有人可讀
存入資料庫接受 success, error callback
新增地圖
// ClientParse.Cloud.run('initPage', { mapId: mapId }, { success: function(result) { // do something
// ex. gMapId = result.targetMapId; }, error: function(error) { }}
前端呼叫後端定義的 api
// Cloud codeParse.Cloud.define("initPage", function(request, response) { var mapId = request.params.mapId || "xjPDDwHsvK"; console.log("mapid: "+mapId); var MyMap = Parse.Object.extend("MyMap"); var query = new Parse.Query(MyMap); query.get(mapId, { success: function(queryMyMap) { // 查詢 目標地圖 成功
queryMyMap.get("author").fetch({ success: function(user) { // 撈作者成功
var targetMapAuthorName = ""; if(user){ targetMapAuthorName = user.get("username");
response.success({ targetMapId: mapId, targetMapName: queryMyMap.get("name"), targetMapAuthorName: targetMapAuthorName, editable: queryMyMap.getACL().getWriteAccess(currentUser.id) }); } } });},error: function(error) { response.error("查詢失敗; ["+error.code+"] "+error.message);}});}
在 server 端，定義 api透過 request.params 取得輸入值
log 內容會記錄在 parse app > 上方ｃcore > 左側 Logs > info
mapId 是 MyMap id 可由 get 直接取得物件
Parse.Query 其它方法，舉例如下 equalTo, notEqualTo, greaterThan, greaterThanOrEqualTo limit, skip ascending, descending find, first
欲回傳前端的內容以 JSON 包裝塞進 response 的 success/error
ACL 要透過 get/setACL 才能取得
由於 javascript 的 unblock 特性多句查詢需要層層嵌套
// Cloud codeParse.Cloud.beforeSave("MapPoint", function(request, response) { if(request.object.get("addr").length < 5){ response.error("地址太短"); } else { response.success(); }});
Parse.Cloud.beforeSave(Parse.User, function(request, response) { if (request.object.get("username").length < 4) { response.error("帳號太短，至少四個字元 "); } else { response.success(); }});
第一個參數，要應用在自訂類別的話填入類別名稱字串要應用在系統類別，如 Parse.User直接傳遞該類別
[before/after] x [save/delete]交叉組成以下四個方法
beforeSavebeforeDeleteafterSaveafterDelete
可應用在許多功能上，例如
beforeSave 伺服器端驗證
截字處理 …beforeDelete 地圖內還有地點資料，不允許刪除
afterSave 發 pushafterDelete 刪除地圖後也一併刪除相關的地點
// 登入
Parse.User.logIn("username", "password", { success: function(user) { /* ... */ }, error: function(user, error) { /* ... */ }});
// 註冊
var user = new Parse.User();user.set("username", name);user.set("email", email);user.set("password", pw);
user.signUp(null, { success: function(user) { /* ... */ }, error: function(user, error) { /* ... */ }});
// 忘記密碼
Parse.User.requestPasswordReset(email, { success: function() { /* ... */ }, error: function(error) { /* ... */ }});
// 登出
Parse.User.logOut();
登入/註冊成功後，會自動快取不需要每次開頁面都要做 login可透過 Parse.User.current() 來判斷
Parse 檢查不允許 帳號、email 重覆
忘記密碼
● 發信至註冊信箱
● 點擊信箱裡提供的連結，見到如下畫面，重設密碼
● 連結執行過就失效
● Parse app 可以設定信件內容樣版
var Message = Parse.Object.extend("Message");var groupMessage = new Message();var groupACL = new Parse.ACL();
// userList 為 Parse.User 物件組合成的 arrayfor (var i = 0; i < userList.length; i++) { groupACL.setReadAccess(userList[i], true); groupACL.setWriteAccess(userList[i], true);}
groupMessage.setACL(groupACL);groupMessage.save();
此為官網程式範例示範一則訊息允許多個協作者共同擁有讀寫權限
ACL 協作權限示範
建置網站 步驟
● 在 parse 上註冊帳號
● 如果是透過OAuth註冊帳號，需手動設定密碼
○ 右上角 username > Account > click “Update” button > 填入密碼
● 到 parse app (https://www.parse.com/apps) 新增APP● 在本機要建立工作目錄的地方，執行以下指令，藍字表示依自身情況而變動
$ parse new MyCloudCode Email: [email protected]:1:MyApp2:MyOtherAppSelect an App: 1 $ cd MyCloudCode
以上會自動產生工作目錄，有三個資料夾： config, public, cloud
分別存放：設定檔、前端程式、伺服端器程式
建置網站 步驟(續)
● parse app > target app > 上方 Setting > 左側 Keys，取得 key
填到程式裡對應的地方 (根據要開發平台而不同)○ ex. 開發 javascript 網站 Parse.initialize("Application ID", "Javascript Key");
● parse app > target app > 上方 Setting > 左側 Hosting > 右側 Web Hosting
填入想要的 ParseApp subdomain
● 前後端程式寫好，放進 public, cloud 資料夾
● 執行 $ parse deploy● 完成，到剛指定的網址上觀看結果 ex. your-subdomain.parseapp.com
結語
讓開發新產品
更快速、容易
使我們得以專注在 產品功能
精進介面設計
以提供更加豐富的產品體驗
缺點是 server 端 debug 有點困難 … XD
ReferenceParse 官網 javascript doc - Parse JavaScript SDK & Cloud Code Reference
https://www.parse.com/docs/js/api/symbols/Parse.html
Parse 官網 快速開始 教學
https://www.parse.com/apps/quickstart
Parse 官網 javascript guide
https://www.parse.com/docs/js/guide
Parse 官網 javascript guide 中文翻譯版
https://www.parse.com/docs/tw/js/guide
Node.js and Parse
http://www.slideshare.net/NicholasMcClay/nodejs-and-parse