การรับรองความถูกต้องของผู้ใช้เป็นข้อกำหนดพื้นฐานในแอพมือถือขององค์กรเกือบทั้งหมด สำหรับแอพมือถือภายในเช่นแอพที่เกี่ยวข้องกับการจ่ายเงินเดือนและการจองการเดินทางเพื่อธุรกิจองค์กรต้องการใช้ประโยชน์จากการลงนามแบบเดียวโดยการตรวจสอบผู้ใช้กับเซิร์ฟเวอร์ LDAP ในสถานที่ และสำหรับแอพที่กำหนดเป้าหมายไปยังผู้ใช้ปลายทางที่ข้อมูลองค์กรไม่ได้รับการเปิดเผยเช่นแอพสำหรับผู้ใช้ผลิตภัณฑ์ที่อนุญาตให้พวกเขายกคำขอบริการทำให้ผู้ใช้สามารถตรวจสอบสิทธิ์โดยใช้การเข้าสู่ระบบโซเชียลของพวกเขาเช่นการเข้าสู่ระบบ Facebook/Google เข้าสู่ระบบจะง่ายขึ้นมาก รูปแบบรหัสนี้แสดงให้เห็นว่านักพัฒนาสามารถใช้ประโยชน์จากบริการมูลนิธิมือถือ IBM เพื่อนำไปใช้ตามกลไกการรับรองความถูกต้องของผู้ใช้ได้อย่างไร:
เมื่อคุณกรอกรูปแบบรหัสนี้คุณจะเข้าใจ:

แผนภาพด้านบนแสดงให้เห็นถึงการเข้าสู่ระบบ (ที่นี่อธิบายกับ Google แต่ยังเกี่ยวข้องกับ Facebook หรือผู้ให้บริการทางสังคมอื่น ๆ ) แผนภาพแสดงให้เห็นว่าไกด์เรียกผู้ให้บริการทางสังคมเริ่มต้นโดยลูกค้า

1. การตั้งค่าไอออนิกและ mobilefoundation CLI
2. สร้างฐานข้อมูลที่มีเมฆมากและเติมข้อมูลด้วยข้อมูลตัวอย่าง
3. สร้างบริการจัดเก็บอ็อบเจ็กต์ IBM Cloud Object และเติมข้อมูลด้วยข้อมูลตัวอย่าง
4. สร้างบริการรองพื้นมือถือและกำหนดค่า MFP CLI
5. การตั้งค่าเซิร์ฟเวอร์ LDAP และไคลเอ็นต์เกตเวย์ที่ปลอดภัย
6. ลงทะเบียนแอพ Android พร้อม Google และ Facebook สำหรับเข้าสู่ระบบโซเชียล
7. ดาวน์โหลดแหล่งที่มา repo และปรับแต่ง
7.1 โคลน repo
7.2 อัปเดตรหัสแอพชื่อและคำอธิบาย
7.3 ระบุข้อมูลประจำตัวที่มีเมฆมากในอะแดปเตอร์ mobilefoundation
7.4 ระบุข้อมูลรับรองการจัดเก็บข้อมูลวัตถุคลาวด์ในอะแดปเตอร์ MobileFoundation
7.5 ระบุข้อมูลรับรอง LDAP ในอะแดปเตอร์ MobileFoundation
7.6 ระบุข้อมูลรับรองของ Google Sign-in ในอะแดปเตอร์ Moilefoundation
7.7 ระบุ Facebook AppID และ Google ClientID ในแอพ Ionic
8. ปรับใช้อะแดปเตอร์ mobilefoundation และการทดสอบ
8.1 สร้างและปรับใช้อะแดปเตอร์ mobilefoundation
8.2 เปิดตัวแดชบอร์ด MobileFoundation และตรวจสอบการกำหนดค่าอะแดปเตอร์
9. เรียกใช้แอปพลิเคชันบนโทรศัพท์ Android
โครงการนี้สร้างขึ้นบน https://github.com/ibm/ionic-mfp-app ดำเนินการตามขั้นตอนต่อไปนี้จากโครงการฐานนั้นเพื่อให้บริการแบ็กเอนด์มือถือที่จำเป็นจาก IBM Cloud และเติมข้อมูลด้วยข้อมูลตัวอย่างรวมถึงการตั้งค่า Ionic และ MobileFoundation CLI บนเครื่องพัฒนาของคุณ
ขั้นตอนที่ 1. การตั้งค่า Ionic และ Mobilefoundation CLI
ขั้นตอนที่ 2. สร้างฐานข้อมูลที่มีเมฆมากและเติมข้อมูลด้วยข้อมูลตัวอย่าง
ขั้นตอนที่ 3. สร้างบริการจัดเก็บออบเจ็กต์ IBM Cloud Object และเติมข้อมูลด้วยข้อมูลตัวอย่าง
ขั้นตอนที่ 4. สร้างบริการรองพื้นมือถือและกำหนดค่า MobileFoundation CLI
หากคุณมีการตั้งค่าและทำงานเซิร์ฟเวอร์ LDAP Enterprise ของคุณคุณสามารถข้ามส่วนที่เหลือของส่วนนี้และย้ายไปที่ 'Setup Secure Gateway Client' หากคุณไม่มีการตั้งค่าเซิร์ฟเวอร์ LDAP คุณสามารถลองติดตั้ง apacheds - https://directory.apache.org/apacheds คู่มือการติดตั้งและตั้งค่าพื้นฐานสำหรับ Apacheds มีอยู่ที่-https://directory.apache.org/apacheds/basic-user-guide.html (โปรดอ้างอิงส่วนที่ 1) นำเข้าข้อมูลตัวอย่างที่มีอยู่ที่นี่โดยทำตามขั้นตอนที่นี่ เพิ่มรายการใหม่พร้อมรายละเอียดของคุณเช่น
เพื่อให้สามารถเข้าถึงเซิร์ฟเวอร์ LDAP ในสถานที่ของคุณจากภายในเซิร์ฟเวอร์ Foundation Mobile ที่ทำงานบน IBM Cloud เราต้องสร้างการเชื่อมต่อเกตเวย์ที่ปลอดภัยก่อนเซิร์ฟเวอร์ LDAP ในสถานที่และ IBM Cloud ตามขั้นตอนต่อไปนี้:
เข้าสู่ระบบคลาวด์ IBM คลิก
Catalog > All Categories > Integration > Secure Gateway > Create
ภายในแผงควบคุมบริการเกตเวย์ที่ปลอดภัยคลิก Add Gateway ระบุชื่อแล้วคลิก Add Gateway คลิกที่ไอคอนสำหรับเกตเวย์ที่คุณเพิ่งเพิ่ม
คลิก Add Clients ปล่อยให้การเลือกเริ่มต้นของ IBM Installer เป็น AS-IS จดบันทึก Gateway ID และ Security Token
คัดลอก URL ดาวน์โหลดสำหรับตัวติดตั้งไคลเอนต์ Secure Gateway สำหรับระบบปฏิบัติการที่เซิร์ฟเวอร์ LDAP กำลังทำงานอยู่
เข้าสู่ระบบในเครื่องในสถานที่ที่เซิร์ฟเวอร์ LDAP กำลังทำงานอยู่ ดาวน์โหลด Secure Gateway Client Installer โดยใช้ URL ดาวน์โหลดที่ได้รับจาก Secure Gateway Dashboard ติดตั้งและเริ่มไคลเอนต์เกตเวย์ที่ปลอดภัยโดยใช้คำแนะนำที่นี่
เพิ่มเซิร์ฟเวอร์ LDAP เป็นปลายทางในไคลเอนต์เกตเวย์ที่ปลอดภัยโดยใช้คำแนะนำที่นี่ หากปลายทางที่เพิ่มเข้ามาใหม่จะแสดงมือที่เพิ่มขึ้นด้วยสีแดงพร้อม Access blocked by ACL ให้แน่ใจว่าคุณได้เรียกใช้ acl allow < host >:< port > ในบรรทัดคำสั่งไคลเอ็นต์เกตเวย์ที่ปลอดภัย
hostname:port ของเซิร์ฟเวอร์ LDAP 

$ git clone https://github.com/IBM/MFP-Auth-LDAP
$ cd MFP-Auth-LDAP
อัปเดต IonicMobileApp/config.xml ดังต่อไปนี้ เปลี่ยน id name description และรายละเอียด author อย่างเหมาะสม
<?xml version='1.0' encoding='utf-8'?>
<widget id="org.mycity.myward" version="2.0.0" xmlns="https://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0" xmlns:mfp="http://www.ibm.com/mobilefirst/cordova-plugin-mfp">
<name>MyWard</name>
<description>Get your civic issues resolved by posting through this app.</description>
<author email="[email protected]" href="https://developer.ibm.com/code/author/shivahr/">Shiva Kumar H R</author>
...
เปิด MobileFoundationAdapters/MyWardData/src/main/adapter-resources/adapter.xml และอัปเดตคุณสมบัติต่อไปนี้เพื่อชี้ไปที่ฐานข้อมูลเมฆที่สร้างขึ้นในขั้นตอนที่ 2
key และ password ด้วยคีย์ API Loudant ตามที่สร้างขึ้นในขั้นตอนที่ 2.2account อสังหาริมทรัพย์ให้ระบุส่วน URL ของแดชบอร์ดที่มีเมฆมากไม่เกิน (และรวมถึง) -bluemix.cloudant.com ดังแสดงในสแนปชอตของขั้นตอนที่ 2.2DBName ให้ปล่อยค่าเริ่มต้นของ myward As-IS
<mfp:adapter name="MyWardData" ...>
<property name="account" displayName="Cloudant account" defaultValue=""/>
<property name="key" displayName="Cloudant key" defaultValue=""/>
<property name="password" displayName="Cloudant password" defaultValue=""/>
<property name="DBName" displayName="Cloudant DB name" defaultValue="myward"/>
...
</mfp:adapter>
เปิด MobileFoundationAdapters/MyWardData/src/main/adapter-resources/adapter.xml และอัปเดตคุณสมบัติต่อไปนี้เพื่อชี้ไปที่ที่เก็บข้อมูลวัตถุคลาวด์ที่สร้างขึ้นในขั้นตอนที่ 3
bucketName ตามที่สร้างขึ้นในขั้นตอนที่ 3.1serviceId และ apiKey ที่สร้างขึ้นในขั้นตอน 3.2endpointURL ตามข้อกำหนดใน https://cloud.ibm.com/docs/services/cloud-object-storage/basics/endpoints.html#select-regions และ endpoints
<mfp:adapter name="MyWardData" ...>
...
<property name="endpointURL" displayName="Cloud Object Storage Endpoint Public URL" defaultValue="https://s3-api.us-geo.objectstorage.softlayer.net"/>
<property name="bucketName" displayName="Cloud Object Storage Bucket Name" defaultValue=""/>
<property name="serviceId" displayName="Cloud Object Storage Service ID" defaultValue="" />
<property name="apiKey" displayName="Cloud Object Storage API Key" defaultValue=""/>
</mfp:adapter>
เปิด MobileFoundationAdapters/LDAPLoginAdapter/src/main/adapter-resources/adapter.xml และอัปเดตคุณสมบัติต่อไปนี้เพื่อชี้ไปที่ไคลเอนต์เกตเวย์ที่ปลอดภัยที่สร้างขึ้นในขั้นตอนที่ 5.2
<property name="ldapUserAttribute" defaultValue="uid" displayName="The LDAP attribute for username"/>
<property name="ldapNameAttribute" defaultValue="cn" displayName="The LDAP attribute for display name"/>
<property name="ldapURL" defaultValue="ldap://caplonsgprd-5.integration.ibmcloud.com:15315" displayName="The LDAP Server URL"/>
<property name="userFilter" defaultValue="(&(uid=%v))" displayName="The LDAP user filter, use %v as placeholder for user"/>
<property name="bindDN" defaultValue="uid=admin,ou=system" displayName="The LDAP bind DN (- for none)"/>
<property name="bindPassword" defaultValue="apacheds" displayName="The LDAP bind password (- for none)" type="string"/>
เปิด MobileFoundationAdapters/SocialLoginAdapter/src/main/adapter-resources/adapter.xml และอัปเดต Google Client-ID ที่สร้างขึ้นในขั้นตอนที่ 6 ดังที่แสดงด้านล่าง
<property name="google.clientId"
defaultValue="618106571370-nie902ccc0i3id6sgdu4nc58bslabcde.apps.googleusercontent.com"
displayName="google client Id"
description="OAuth 2.0 client ID that was created for your server. Get it from Google Developers Console
at https://console.developers.google.com/projectselector/apis/credentials"/>
ติดตั้งปลั๊กอิน Cordova และ Ionic Facebook และปลั๊กอิน googleplus โดยใช้คำสั่งต่อไปนี้ (Python2 เป็นสิ่งที่จำเป็นต้องใช้ล่วงหน้า)
$ ionic cordova plugin add cordova-plugin-facebook4 --variable APP_ID="your_appid_from_step6" --variable APP_NAME="your application name"
$ npm install --save @ionic-native/facebook
$ ionic cordova plugin add cordova-plugin-googleplus --variable REVERSED_CLIENT_ID="reverseclientid_from_step6"
$ npm install --save @ionic-native/google-plus
หลังจากติดตั้งปลั๊กอิน Facebook และ GooglePlus แล้วให้ตรวจสอบว่าแอพ Facebook และ Google WebClientId ที่ได้รับในขั้นตอนที่ 6 มีอยู่ในไฟล์ config.xml ดังที่แสดงด้านล่าง
<plugin name="cordova-plugin-facebook4" spec="^1.9.1">
<variable name="APP_ID" value="your_appid" />
<variable name="APP_NAME" value="MyWard" />
</plugin>
<plugin name="cordova-plugin-googleplus" spec="^5.3.0">
<variable name="REVERSED_CLIENT_ID" value="your_reverse_clientid" />
</plugin>
REVERSED_CLIENT_ID เป็นรูปแบบย้อนกลับของ Google WebClientId ที่ได้รับในขั้นตอนที่ 6
นอกจากนี้ยังเพิ่ม webClientId ในไฟล์ auth_handler.ts ในวิธี googlepluslogin ()
สร้างและปรับใช้อะแดปเตอร์ MyWardData ดังต่อไปนี้
$ cd MobileFoundationAdapters/
$ cd MyWardData
$ mfpdev adapter build
$ mfpdev adapter deploy
หมายเหตุ- หากเซิร์ฟเวอร์ไม่ใช่ค่าเริ่มต้นโปรดพูดถึงชื่อเซิร์ฟเวอร์ 'MFPDEV Adapter DEPLING ADAPTER' ในคำสั่ง
สร้างและปรับใช้อะแดปเตอร์ LDAPLoginAdapter ดังต่อไปนี้
$ cd ../LDAPLoginAdapter/
$ mfpdev adapter build
$ mfpdev adapter deploy
สร้างและปรับใช้อะแดปเตอร์ SocialLoginAdapter ดังต่อไปนี้
$ cd ../SocialLoginAdapter/
$ mfpdev adapter build
$ mfpdev adapter deploy
เปิดตัวแดชบอร์ด MobileFoundation ด้านล่าง:
Cloud Foundry Services คลิกที่บริการ Mobile Foundation ที่คุณสร้างขึ้นในขั้นตอนที่ 4 หน้าภาพรวมบริการที่ได้รับการแสดงจะมีแดชบอร์ด MobileFoundation ที่ฝังอยู่ภายใน นอกจากนี้คุณยังสามารถเปิดแดชบอร์ด MobileFoundation ในแท็บเบราว์เซอร์แยกต่างหากโดยต่อท้าย /mfpconsole กับ URL ที่กล่าวถึงในขั้นตอนที่ 4LDAPLoginAdapter , SocialLoginAdapter และอะแดปเตอร์ MyWardData ที่ระบุไว้ตรวจสอบการกำหนดค่าอะแดปเตอร์ mobilefoundation ดังต่อไปนี้:
MyWardData ภายใต้แท็บ Configurations คุณควรเห็นคุณสมบัติต่าง ๆ ที่เราระบุไว้ในขั้นตอนที่ 7.3 และขั้นตอนที่ 7.4 สำหรับการเข้าถึงฐานข้อมูลเมฆและการจัดเก็บวัตถุคลาวด์ดังที่แสดงด้านล่าง เป็นทางเลือกในการระบุค่าคุณสมบัติเหล่านั้นใน MobileFoundationAdapters/MyWardData/src/main/adapter-resources/adapter.xml ดังที่แสดงไว้ก่อนหน้านี้ในขั้นตอนที่ 7.3 และขั้นตอนที่ 7.4 คุณสามารถปรับใช้อะแดปเตอร์ด้วยค่า defaultValue ที่ว่างเปล่า 
Resources คุณควรเห็น REST APIs ต่างๆที่สัมผัสโดยอะแดปเตอร์ MyWardData ดังที่แสดงด้านล่าง คอลัมน์ Security ควรแสดงขอบเขตการปกป้อง UserLogin กับแต่ละวิธีการพักผ่อน 


ทำตามคำแนะนำในขั้นตอนที่ 7 ของโครงการฐานเพื่อเรียกใช้แอปพลิเคชันบนโทรศัพท์ Android แทนที่จะใช้ UserLogin ธรรมดาให้ทดสอบปุ่ม Google Sign-In หรือปุ่มลงชื่อเข้าใช้ FB หรือปุ่ม LDAPLOGIN ที่ใช้บนปุ่มที่เลือกกลไกการตรวจสอบความถูกต้องของผู้ใช้จะแตกต่างกันไป

ภาพหน้าจอด้านล่างแสดงหน้าต่างๆของแอปพลิเคชัน



โปรดดูคำแนะนำสำหรับการดีบักแอพ Android Hybrid โดยใช้เครื่องมือนักพัฒนา Chrome หรือคู่มือการแก้ไขปัญหาสำหรับการแก้ปัญหาที่เกิดขึ้นทั่วไป
Apache 2.0