ป้ายกำกับ

วันจันทร์ที่ 19 สิงหาคม พ.ศ. 2556

Safari Web Content

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

ครั้งนี้ก็นับเป็นครั้งที่เท่าไหร่แล้วไม่รู้ ที่ผมพยายามหาทางเขียนโปรแกรมให้ใช้บน iPad ได้ แต่ที่ยังไม่ลงตัวก็เพราะว่า ถ้าจะทำอย่างนั้นได้แบบตรงไปตรงมา ก็ต้องซื้อเครื่อง Mac มาใช้ และต้องเสียค่าสมัครเป็น iOS Developer อีก แล้วก็ต้องไปผ่านกระบวนการตรวจสอบโปรแกรมของเราจาก Apple ถึงจะสามารถขึ้นไปอยู่บน App Store ได้ ประมาณว่า ถ้าคิดจะทำโปรแกรมเล่นๆ ก็ถือว่าต้องลงทุนมากเป็นพิเศษ นี่ถ้าไม่ใช่รักกันจริง ก็คงจะไม่มีใครยอมลงทุนมากขนาดนั้น ซึ่งผมเองก็อยู่ในกลุ่มนี้เสียด้วยสิ

ครั้งนี้ ผมก็ได้พบความน่าสนใจของการพัฒนาโปรแกรมให้เป็น Web App และนำมาใช้งานบน iPad เนื่องจาก ผมพบว่า Safari สามารถสร้าง icon ของ Web Site ที่เราต้องการบน Home Screen ได้ด้วยการกดปุ่มส่งออก แล้วเลือก Add to Home Screen ซึ่งจะได้ปุ่ม icon เช่นเดียวกับ Application ต่างๆเลย ดังภาพข้างล่างนี้ ผมได้ทดลองเอาโลโก้ของมหาวิทยาลัยสงขลานครินทร์มาใส่ (เนื่องจากมีไฟล์เก่าอยู่ ตอนที่ผมเคยแปลงไฟล์ภาพ เป็น SVG)
ซึ่งเวลาจะลบ icon ทิ้งก็ทำได้ตามปกติ

จากการหาข้อมูลการพัฒนา Web App บน iPad ผมก็พบว่า Apple ให้เราสมัครเป็น Safari Extension Developer ได้ฟรี ผมก็เลยเข้าไปสมัครมาเรียบร้อย จากนั้นก็ได้อ่าน Resource แนะนำการเขียนโปรแกรมมากมาย โดยเฉพาะ Safari Web Content Guide ทำให้ผมรู้วิธีกำหนดภาพ icon ของ Web Site คือ การใส่ไฟล์รูปภาพชื่อ apple-touch-icon.png ไว้ที่ root ของ Web Site หรือกำหนด tag link ไปยังไฟล์ภาพของเรา เช่น

<link rel="apple-touch-icon" href="/custom_icon.png"/>

หลายคนอาจจะมีคำถามว่า วิธีนี้ก็จะทำให้โปรแกรมของเราต้องออนไลน์อยู่ตลอดเวลานะสิ คำตอบคือ ไม่ครับ เราสามารถกำหนดให้ Browser (Safari) ทำการ cache ไฟล์ต่างๆที่จำเป็นไว้ได้ โดยใช้ความสามารถของ HTML5 เรื่อง Application Cache ร่วมกับ Storage จากนั้น การทำงานทุกอย่างก็สามารถทำด้วย JavaScript ได้ ยกเว้นว่า เราต้องการส่งข้อมูลกลับไปยัง Server เท่านั้น ซึ่งสามารถกำหนดเงื่อนไขตรวจสอบการออนไลน์ของผู้ใช้ได้

หวังว่าแนวทางนี้ จะช่วยให้หลายๆคนพัฒนา App ดีๆบน iPad ได้เลยทันทีนะครับ

หมายเหตุ: การใช้ HTML5 Application Cache นั้น มีข้อจำกัดกับ Browser บางตัวที่จำกัดเนื้อที่ของไฟล์ให้ไม่เกินที่กำหนด Safari กำหนดได้ไม่เกิน 100MB

ไม่มีความคิดเห็น:

แสดงความคิดเห็น