Ionic FrameworkPhoneGap/Cordova

วิธีจัดการ Whitelist URL ในแอพ Android สร้างด้วย Cordova ตัวล่าสุด

เรื่องที่เกี่ยวข้อง - , , ,

หลังจากที่ PhoneGap CLI และ Cordova CLI ปล่อยเวอร์ชั่นอัพเดตรุ่นใหญ่มา (เวอร์ชั่น 5.0) หลายๆ คนที่ใช้ PhoneGap/Cordova ทำแอพ Android น่าจะอึ้งเป็นไก่ตาแตกกันถ้วนหน้า เพราะเหมือนคราวนี้ แอพเราจู่ๆ ก็เชื่อมต่อกับ Web Service ไม่ได้ซะงั้น?!

อย่าตกใจ ใช้เวลาไม่เกิน 5 นาทีก็สามารถแก้ไขได้แล้วครับ

สาเหตุของปัญหาแอพ Android ใน PhoneGap/Cordova CLI 5.0

จริงๆ รายละเอียดทั้งหมดเขียนไว้ในเรื่องวันก่อนเรียบร้อยแล้ว แต่เพื่อความสะดวก ขอยกมาสรุปสั้นๆ ที่นี่แล้วกัน

ใน PhoneGap CLI และ Cordova CLI 5.0 เป็นต้นไป ส่วนการจัดการ White List Domain จะแยกออกมาเป็น Plugin ต่างหาก (มีผลตั้งแต่ Cordova for Android เวอร์ชั่น 4.0 เป็นต้นไป)

นั่นหมายความว่าการกำหนด access origin ใน config.xml จะไม่เหมือนเดิมนั่นเอง

ไป ลงไป อ่านวิธีกำหนดการใช้งานกัน

วิธีติดตั้ง White List plugin

อย่างแรกเลย เราต้องติดตั้ง Cordova White List plugin ครับ ให้เข้าไปใน folder ของโปรเจคเรา แล้วใช้คำสั่งติดตั้ง plugin

cd NextflowApp
cordova plugin add https://github.com/apache/cordova-plugin-whitelist

เท่านี้เราก็พร้อมตั้งค่าใน config.xml แล้ว

วิธีกำหนด White List URL ในส่วนของ Network Request

ด้านล่างเป็นรูปแบบการกำหนด URL ต่างๆ ที่ผมสรุปมาเป็นภาษาไทยให้ครับ

<!-- อนุญาตให้แอพเข้าถึง รูปภาพ, xhrs, และอื่นๆ อีกมากมาย ของเว็บ google.com -->
<access origin="http://google.com" />
<access origin="https://google.com" />

<!-- อนุญาตให้เข้าถึง subdomain ชื่อ maps.google.com -->
<access origin="http://maps.google.com" />

<!-- อนุญาตให้เข้าถึงทุกๆ   subdomains ของเว็บ google.com -->
<access origin="http://*.google.com" />

<!-- เข้าถึง Domain ใดๆ ก็ได้ -->
<access origin="*" />

<!-- Don't block any requests -->
<access origin="*" />

หวังว่าจะช่วยให้โล่งใจกันได้นะครับ โค้ชพลไปละ

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

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

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

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

 

Loading Facebook Comments ...
Menu