ในบทความนี้ เราจะยกตัวอย่างวิธีการตั้งค่าการลงชื่อเข้าใช้ \ กระบวนการสมัครใช้งานสำหรับ แอปพลิเคชันมือถือ ก่อนอื่น ลองนึกภาพว่าเรามีหน้าในแอปพลิเคชันมือถือของเราแล้ว ซึ่งแสดงรายชื่อหนังสือ หนังสือแต่ละเล่มมีชื่อ ชื่อผู้แต่ง ประเภท และหน้าปกเป็นของตัวเอง
เริ่มจากหน้าลงชื่อเข้าใช้ก่อนแล้วสร้างหน้าจอเปล่าใหม่ (ดู)
เลย์เอาต์ของหน้าจอมีคอนเทนเนอร์สำหรับจัดแนวเนื้อหา ส่วนประกอบฟิลด์อีเมลและส่วนประกอบฟิลด์รหัสผ่านอยู่ภายในคอนเทนเนอร์นี้ ปุ่มสำหรับเรียกกระบวนการอนุญาตก็อยู่ภายในนั้นด้วย โครงสร้างองค์ประกอบของหน้าจอมีลักษณะดังนี้:
ในนักออกแบบดูเหมือนว่า
ส่วนแรกของกระบวนการทางธุรกิจการอนุญาตที่เกี่ยวข้องกับเวิร์กโฟลว์ของปุ่ม และคุณสามารถดูได้จากรูปภาพด้านล่าง:
- มันถูกกระตุ้นโดยการกระทำเมื่อแตะ
- ก่อนอื่นมันได้รับค่า (รับคุณสมบัติ) จากช่องใส่ (อีเมลและรหัสผ่าน);
- ค่าจากอินพุตจะถูกส่งผ่านไปยังบล็อกกระบวนการทางธุรกิจ POST /auth
- หากคำขอสำเร็จ (If-Else = การประเมินค่าจริง) Auth Token ใหม่จะถูกกำหนดให้กับผู้ใช้ปัจจุบันที่ดำเนินการตามคำขอนี้
- หลังจากกำหนด Auth Token แล้ว - ผู้ใช้จะต้องถูกนำทางไปยังหน้าจอใหม่ (หน้ารายการหนังสือในตัวอย่างนี้)
- หากคำขอไม่สำเร็จ - จะต้องอัปเดตสถานะฟิลด์อีเมลและองค์ประกอบฟิลด์ผ่าน (อัปเดตคุณสมบัติ) ด้วยข้อความที่เกี่ยวข้อง (ตรวจสอบข้อความ) และสถานะ (ตรวจสอบสถานะ)
นั่นคือมันเกี่ยวกับการอนุญาต ขั้นตอนต่อไปคือการสร้างตรรกะการลงทะเบียนสำหรับแอปพลิเคชันของเรา มาสร้างหน้าจอเปล่าใหม่ (View) อย่างที่เราทำไปแล้วสำหรับตรรกะการลงชื่อเข้าใช้ อย่าลืมเติมส่วนประกอบด้วย
โครงสร้างส่วนประกอบหน้าจอมีลักษณะดังนี้:
เค้าโครงหน้าจอในภาพหน้าจอด้านล่าง:
กระบวนการทางธุรกิจลงทะเบียนที่เกี่ยวข้องกับเวิร์กโฟลว์ของปุ่มและถูกทริกเกอร์โดยการดำเนินการ on-Tap ส่วนแรกของกระบวนการทางธุรกิจแสดงอยู่ในภาพหน้าจอด้านล่าง
- ตามที่ได้กล่าวไปแล้วกระบวนการทางธุรกิจเริ่มต้นจากการดำเนินการเมื่อแตะ
- ก่อนอื่น ต้องรับค่าทั้งหมดจากอินพุตเพื่อการประมวลผลต่อไป (รับคุณสมบัติ)
- รหัสผ่านทั้งสองจะต้องเปรียบเทียบกัน เมื่อต้องการทำเช่นนี้ จะต้องแปลงเป็นรูปแบบสตริง (เป็นสตริง);
- กำลังจัดการการเปรียบเทียบโดยบล็อกตรรกะที่เท่าเทียมกัน
- หากรหัสผ่านตรงกัน ค่าจากอินพุตจะถูกระบุในบล็อก POST /register
- หากการลงทะเบียนสำเร็จ (ตรวจสอบโดยบล็อก if-else) Auth Token ใหม่จะถูกกำหนดให้กับผู้ใช้ปัจจุบัน
- หลังจากกำหนดโทเค็นแล้ว ผู้ใช้จะต้องไปที่หน้าใหม่ (รายชื่อหนังสือในตัวอย่างนี้)
- หากรหัสผ่านไม่ตรงกัน (การตรวจสอบความถูกต้องของบล็อก if-else แรก) หรือการลงทะเบียนไม่สำเร็จ (การตรวจสอบความถูกต้องของบล็อก if-else ที่สองเป็นเท็จ) สถานะของส่วนประกอบอินพุต (ตรวจสอบสถานะ) และข้อความ (ตรวจสอบข้อความ) จะเป็น ที่จะปรับปรุงด้วยค่าที่สอดคล้องกัน
นั่นคือทั้งหมดที่เราต้องการสำหรับตรรกะการลงทะเบียน
ขั้นตอนสุดท้ายที่เราต้องทำคือตรวจสอบให้แน่ใจว่าผู้ใช้จะถูกนำทางไปยังหน้าที่ถูกต้อง (หน้าลงชื่อเข้าใช้ในตัวอย่างนี้) เมื่อเขาลงชื่อเข้าใช้แล้ว เรายังต้องเพิ่มตรรกะที่ผู้ใช้จะถูกนำทางไป หน้ารายการหนังสือหากเขาลงชื่อเข้าใช้แล้วและมีโทเค็นการตรวจสอบสิทธิ์ที่ใช้งานอยู่ ซึ่งสามารถทำได้ในส่วนทริกเกอร์และการดำเนินการ
ทริกเกอร์ซึ่งรับผิดชอบการดำเนินการเมื่อเปิดใช้ - คือทริกเกอร์ onLaunch โดยปกติจะมีการกำหนดไว้ล่วงหน้าโดยค่าเริ่มต้นสำหรับทุกแอปพลิเคชันใหม่ แต่เราต้องการสร้างตรรกะที่กำหนดเองที่นี่ ดังนั้นผลลัพธ์สุดท้ายจะมีลักษณะดังนี้ในภาพหน้าจอด้านล่าง:
- ประการแรกจะได้รับ Auth Token ล่าสุดของผู้ใช้ปัจจุบัน
- จากนั้นจะส่งคำขอไปยังเซิร์ฟเวอร์ที่ต้องมีการตรวจสอบสิทธิ์ ตัวอย่างเช่น GET /user/profile ขอเนื่องจากยอมรับ Auth Token
- ความสำเร็จของคำขอได้รับการตรวจสอบโดย If-Else block
- หากคำขอสำเร็จ (การตรวจสอบความถูกต้องของบล็อก if-else) ผู้ใช้จะถูกนำทางไปยังหน้าจอรายการหนังสือ
- หากไม่เป็นเช่นนั้น ระบบจะนำทางไปยังหน้าจอลงชื่อเข้าใช้
นั่นคือกระบวนการลงชื่อเข้าใช้/สมัครใช้งานที่ง่ายดายในแอปพลิเคชันมือถือบนแพลตฟอร์ม AppMaster.io วิดีโอสอนแบบเต็ม:
บทสรุป
AppMaster แพลตฟอร์มที่ไม่มีโค้ดช่วยให้สร้าง แอปบนอุปกรณ์เคลื่อนที่ ได้ง่าย คุณสามารถ ลงทะเบียนบนแพลตฟอร์ม และตรวจสอบการทำงานทั้งหมดได้ตลอดเวลา