PhoneGap/Cordova

ลองใช้ HealthKit บน iOS ด้วย Ionic/PhoneGap/Cordova

เรื่องที่เกี่ยวข้อง - HealthKit, Ionic Framework @th, ngCordova, PhoneGap/Cordova

ตอนนี้ Apple Watch ก็ใกล้จะเปิดตัวแล้ว สิ่งหนึ่งที่ Apple Watch จะทำได้ ก็คงไม่พ้น sensor ที่จะทำงานควบคู่กับระบบตรวจวัดสุขภาพของเราใน iOS ที่ตอนนี้คนที่ใช้ iOS ก็คงเห็นแอพ Health ที่ดูมันจะบันทึกกิจกรรมของเราเกือบทุกอย่าง

ซึ่ง Apple ได้เตรียมชุดคำสั่งที่เรียกเก๋ๆ ว่า HealthKit ให้นักพัฒนาพร้อมที่จะดึงข้อมูลสุขภาพไปใช้กันอย่างสะดวกโยธิน ในการพัฒนาแอพด้วย HTML5 อย่าง PhoneGap/Cordova ก็ได้ ng-Cordova เพิ่มชุดคำสั่งที่รองรับเจ้า HealthKit นี่มาเช่นกัน

โค้ชพลเห็นมันเพิ่งออกใหม่เลย ลองมาเล่นกันดูครับ

ติดตั้ง Cordova HealthKit Plugin

แรกสุดเลย ให้เราทำการรันคำสั่งติดตั้ง Plugin ใน Project ของเราดังนี้

cordova plugin add https://github.com/Telerik-Verified-Plugins/HealthKit

Plugins ตัวนี้สร้างขึ้นโดยทีมของ Telerik หนึ่งในเจ้าพ่อ Web UI (และเป็นเจ้าของ Kendo UI framework แบบเสียเงินสำหรับแอพ Hybrid ที่สร้างด้วย PhoneGap/Cordova)

เราจะมาสร้างแอพง่ายๆ กันเพื่อลองใช้คำส่ังต่างๆ โดยโค้ชพลจะดึงข้อมูลสุขภาพบางส่วนผ่านทาง HealthKit ซึ่งก็คือ

  1. เพศของเจ้าของเครื่อง
  2. สถิติการเดิน

ขอเข้าถึงข้อมูลใน Health App

อย่างแรกสุด เราจะ “ขอ” HealthKit ว่าต้องการอ่านข้อมูลอะไรบ้าง โดยใช้ method ที่ชื่อว่า requestAuthorization()

$cordovaHealthKit.requestAuthorization(
   [
      'HKBiologicalSex',
      'HKQuantityTypeIdentifierStepCount'
   ]
).then(function(success) {
   alert('granted');
}, function(err) {
   alert('not granted');
});

โดยในที่นี้ผมขอแค่ “เพศ” (HKBiologicalSex) และ “สถิติการเดิน” (HKQuantityTypeIdentifierStepCount) ครับ

ขอทราบเพศ (Biological Sex)

พอเราขอเข้าถึงข้อมูลเรียบร้อยแล้ว ก็มาถึงการดึงข้อมูลกันบ้าง โดยตัวแรกคือเพศ ดึงผ่าน method ที่ชื่อ readGender()

$cordovaHealthKit.readGender().then(function(gender) {
   $scope.gender = gender;
}, function(err) {
   alert('Opps...');
});

ซึ่งในที่นี่จะเอาไปแสดงใน UI อีกที

ขอทราบสถิติการเดิน (Step Count) ปัจจุบันทั้งหมด

ปัจจุบันตัว HealthKit Plugin จะยังไม่สามารถใช้ Parameter เพื่อค้นหากิจกรรมที่เจาะจงได้ ดังนั้นข้อมูลที่คืนกลับมาจะเป็นไปตามที่ขออนุญาติไว้ (ตรงนี้ต้องระวังด้วย)

โดยเราจะใช้ method ที่ชื่อว่า findWorkouts()

$cordovaHealthKit.findWorkouts().then(function(v) {
   // convert to json
}, function(err) {
   alert('Opps...');
});

พอได้ข้อมูลมาในรูปแบบ JSON แล้วก็แปลงเป็น Array แสดงในหน้า List ครับ

สรุป HealthKit Plugin ด้วย Ionic Framework

HealthKit ถือเป็นอีกพรมแดนหนึงที่ใหม่มาก แหล่งข้อมูลทางสุขภาพที่ (น่าจะ) ถูกบันทึกไว้ทุกอย่าง สามารถนำมาสร้างเป็นแอพที่ช่วยเหลือผู้ใช้ได้มากกว่าแต่ก่อน และตอนนี้สำหรับนักพัฒนา Web developer ส่วนของการทำ Mobile App ด้วย PhoneGap/Cordova หรือ Ionic Framework ก็ได้ก้าวเข้าไปก้าวหนึงแล้วครับ

แล้วเจอกันครั้งหน้า เร็วๆ นี้

อ้างอิง

เปิดอบรมสร้าง Cross Platform Mobile Application ด้วย Ionic Framework

เหมาะสำหรับคนทำเว็บ, เริ่มต้น JavaScript ES6 และ Angular เข้าใจง่าย, ใช้ได้จริง

สอบถาม หรือติดต่อจัดอบรมโทร 083-071-3373

โปรหน้าฝน! เรียนรอบสด รับคอร์สออนไลน์มูลค่ากว่า 5800 บาทฟรี!

เริ่มต้นยุค AI ด้วยคอร์สฟรี และพรีเมี่ยม กับพล

หากชอบสิ่งที่พลเล่า เรื่องที่พลสอน สามารถสนับสนุนพลโดยการเข้าเรียนคอร์สออนไลน์ของพลนะคร้าบ

  • เข้าใจง่าย ใช้ได้จริง ออกแบบการสอนอย่างเข้าใจโดยโค้ชพล
  • มีคอร์สสำหรับคนใช้งานทั่วไป จนถึงเรียนรู้เพื่อใช้งานในสายอาชีพขั้นสูง
  • ทุกคอร์สมีใบประกาศณียบัตรรับรองหลังเรียนจบ

เราใช้คุกกี้เพื่อพัฒนาประสิทธิภาพ และประสบการณ์ที่ดีในการใช้เว็บไซต์ของคุณ คุณสามารถศึกษารายละเอียดได้ที่ นโยบายความเป็นส่วนตัว และสามารถจัดการความเป็นส่วนตัวเองได้ของคุณได้เองโดยคลิกที่ ตั้งค่า

Privacy Preferences

คุณสามารถเลือกการตั้งค่าคุกกี้โดยเปิด/ปิด คุกกี้ในแต่ละประเภทได้ตามความต้องการ ยกเว้น คุกกี้ที่จำเป็น

Allow All
Manage Consent Preferences
  • Always Active

Save