![// Cloud code
Parse.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 特性
多句查詢需要層層嵌套](https://image.slidesharecdn.com/parsecloudcode-150519113856-lva1-app6892/85/Parse-cloud-code-10-320.jpg)
![// Cloud code
Parse.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]
交叉組成以下四個方法
beforeSave
beforeDelete
afterSave
afterDelete
可應用在許多功能上，例如
beforeSave
伺服器端驗證
截字處理 …
beforeDelete
地圖內還有地點資料，不允許刪除
afterSave
發 push
afterDelete
刪除地圖後也一併刪除相關的地點](https://image.slidesharecdn.com/parsecloudcode-150519113856-lva1-app6892/85/Parse-cloud-code-11-320.jpg)
![var Message = Parse.Object.extend("Message");
var groupMessage = new Message();
var groupACL = new Parse.ACL();
// userList 為 Parse.User 物件組合成的 array
for (var i = 0; i < userList.length; i++) {
groupACL.setReadAccess(userList[i], true);
groupACL.setWriteAccess(userList[i], true);
}
groupMessage.setACL(groupACL);
groupMessage.save();
此為官網程式範例
示範一則訊息
允許多個協作者共同擁有讀寫權限
ACL 協作權限示範](https://image.slidesharecdn.com/parsecloudcode-150519113856-lva1-app6892/85/Parse-cloud-code-14-320.jpg)
Parse, cloud code 介紹
- 1. 快速建構MVP的利器 - Parse, Cloud Code 介紹 Wan-Ting Jheng 2015/5/19
- 3. 功能一覽 ● Data ○ 基本的 CRUD 操作 ○ 關聯式資料 ○ ACL (Access Control List 安全性配置) ● Push 推送通知 ○ iOS, Andorid, Windows, Windows Phone 8 ● Analytics ○ Events, 錯誤回報 ● Social 使用者相關 ○ 註冊、登入、email 驗證、忘記密碼、user session、FB login、Role
- 4. 功能一覽(續) ● Cloud Code ○ 網頁 前/後端 程式放置平台 ○ 提供各平台 SDK ● Hosting ○ 提供 subdomain.parseapp.com ○ 可以自訂網域名稱 連結至 parse app ○ 後台 Log：console.log, console.error, console.warn ○ Background Job 背景排程 ● Embedded ○ Arduino Yun, Raspberry pi, RTOS
- 5. 使用 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
- 6. Parse.Object ● Parse 會自動替每一筆資料生成以下三個欄位 ○ id ○ createdAt ○ updatedAt ● 上述三個欄位可以直接取 ○ Obj.id ○ Obj.createdAt ○ Obj.updateAt ● 其於欄位要透過 getter/setter ○ Obj.get(“name”) ○ Obj.set(“name”, “value”)
- 7. 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 新增地點
- 8. 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 新增地圖
- 9. // Client Parse.Cloud.run('initPage', { mapId: mapId }, { success: function(result) { // do something // ex. gMapId = result.targetMapId; }, error: function(error) { } } 前端呼叫後端定義的 api
- 10. // Cloud code Parse.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 特性 多句查詢需要層層嵌套
- 11. // Cloud code Parse.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] 交叉組成以下四個方法 beforeSave beforeDelete afterSave afterDelete 可應用在許多功能上，例如 beforeSave 伺服器端驗證 截字處理 … beforeDelete 地圖內還有地點資料，不允許刪除 afterSave 發 push afterDelete 刪除地圖後也一併刪除相關的地點
- 12. // 登入 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 重覆
- 13. 忘記密碼 ● 發信至註冊信箱 ● 點擊信箱裡提供的連結，見到如下畫面，重設密碼 ● 連結執行過就失效 ● Parse app 可以設定信件內容樣版
- 14. var Message = Parse.Object.extend("Message"); var groupMessage = new Message(); var groupACL = new Parse.ACL(); // userList 為 Parse.User 物件組合成的 array for (var i = 0; i < userList.length; i++) { groupACL.setReadAccess(userList[i], true); groupACL.setWriteAccess(userList[i], true); } groupMessage.setACL(groupACL); groupMessage.save(); 此為官網程式範例 示範一則訊息 允許多個協作者共同擁有讀寫權限 ACL 協作權限示範
- 15. 建置網站 步驟 ● 在 parse 上註冊帳號 ● 如果是透過OAuth註冊帳號，需手動設定密碼 ○ 右上角 username > Account > click “Update” button > 填入密碼 ● 到 parse app (https://www.parse.com/apps) 新增APP ● 在本機要建立工作目錄的地方，執行以下指令，藍字表示依自身情況而變動 $ parse new MyCloudCode Email: your@gmail.com Password: 1:MyApp 2:MyOtherApp Select an App: 1 $ cd MyCloudCode 以上會自動產生工作目錄，有三個資料夾： config, public, cloud 分別存放：設定檔、前端程式、伺服端器程式
- 16. 建置網站 步驟(續) ● 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
- 17. 結語 讓開發新產品 更快速、容易 使我們得以專注在 產品功能 精進介面設計 以提供更加豐富的產品體驗 缺點是 server 端 debug 有點困難 … XD
- 18. Reference Parse 官網 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