เพิ่มส่วนหัวของคำขอ HTTP เพิ่มเติม

คำขอ HTTP มีส่วนหัว เช่น User-Agent หรือ Content-Type นอกเหนือจากส่วนหัวที่เบราว์เซอร์แนบแล้ว แอป Android อาจเพิ่มส่วนหัวเพิ่มเติม เช่น คุกกี้หรือผู้อ้างอิง ผ่าน Intent ของ EXTRA_HEADERS เพิ่มเติม เพื่อความปลอดภัย Chrome จะกรองส่วนหัวเพิ่มเติมบางรายการ โดยขึ้นอยู่กับวิธีการและสถานที่เปิดใช้ Intent

คำขอแบบข้ามต้นทางต้องใช้การรักษาความปลอดภัยอีกชั้นหนึ่งเนื่องจากไคลเอ็นต์และเซิร์ฟเวอร์ไม่ได้เป็นของฝ่ายเดียวกัน คู่มือนี้จะกล่าวถึงการเปิดตัวคำขอดังกล่าวผ่านแท็บที่กำหนดเองของ Chrome กล่าวคือ Intent ที่เปิดจากแอปที่เปิด URL ในแท็บเบราว์เซอร์ นักพัฒนาซอฟต์แวร์เพิ่มส่วนหัวเมื่อเปิดตัวแท็บที่กำหนดเองได้จนถึง Chrome 83 ตั้งแต่เวอร์ชัน 83 เป็นต้นไป Chrome เริ่มกรองทุกส่วนหัวแบบข้ามต้นทางที่อยู่ในรายการที่อนุมัติ เนื่องจากส่วนหัวที่ไม่ได้รับอนุญาตก่อให้เกิดความเสี่ยงด้านความปลอดภัย ตั้งแต่ Chrome 86 เป็นต้นไป คุณจะแนบส่วนหัวที่ไม่ได้รับอนุมัติกับคำขอแบบข้ามต้นทางได้ เมื่อเซิร์ฟเวอร์และไคลเอ็นต์เกี่ยวข้องกันโดยใช้ลิงก์เนื้อหาดิจิทัล ลักษณะการทำงานนี้จะสรุปได้ในตารางต่อไปนี้

เวอร์ชัน Chrome	อนุญาตให้ใช้ส่วนหัว CORS
ก่อน Chrome 83	อยู่ในรายการอนุมัติ, ไม่ได้รับการอนุมัติ
Chrome 83 ถึง Chrome 85	อยู่ในรายการที่อนุมัติ
ตั้งแต่ Chrome 86 เป็นต้นไป	อยู่ในรายการที่อนุมัติ, ไม่ได้รับการอนุมัติเมื่อมีการตั้งค่าลิงก์เนื้อหาดิจิทัล

ตารางที่ 1: การกรองส่วนหัว CORS ที่ไม่ได้รับอนุมัติ

บทความนี้แสดงวิธีตั้งค่าการเชื่อมต่อที่ได้รับการยืนยันระหว่างเซิร์ฟเวอร์กับไคลเอ็นต์ และวิธีที่ใช้ส่งส่วนหัว HTTP ในรายการที่อนุมัติและที่ไม่ได้รับอนุมัติ ให้ข้ามไปที่การเพิ่มส่วนหัวเพิ่มเติมใน Intent แท็บที่กำหนดเองสำหรับโค้ด

ที่มา

ส่วนหัวของคำขอ CORS ที่อนุมัติกับที่ไม่ได้รับอนุมัติ

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

ส่วนหัว	คำอธิบาย
ภาษาที่ยอมรับ	โฆษณาภาษาที่เป็นธรรมชาติที่ลูกค้าเข้าใจ
ภาษาของเนื้อหา	อธิบายภาษาที่ใช้สำหรับผู้ชมในปัจจุบัน
ประเภทเนื้อหา	ระบุประเภทสื่อของทรัพยากร

ตารางที่ 2: ตัวอย่างส่วนหัว CORS ที่อนุญาต

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

ตัวอย่างของส่วนหัวที่ไม่ได้รับอนุมัติจะแสดงในตารางต่อไปนี้

ส่วนหัว	คำอธิบาย
Bearer-Token	ตรวจสอบสิทธิ์ไคลเอ็นต์ในเซิร์ฟเวอร์
origin	ระบุที่มาของคำขอ
คุกกี้	มีคุกกี้ที่กำหนดโดยเซิร์ฟเวอร์

ตารางที่ 3: ตัวอย่างส่วนหัว CORS ที่ไม่ได้รับอนุมัติ

มาตรฐาน HTML ไม่แนะนำให้แนบส่วนหัวที่ไม่ได้รับอนุมัติเข้ากับคำขอ CORS และเซิร์ฟเวอร์จะถือว่าคำขอข้ามต้นทางมีเพียงส่วนหัวที่ได้รับอนุมัติเท่านั้น การส่งส่วนหัวที่ไม่ได้รับอนุมัติจากโดเมนข้ามต้นทางจะทำให้แอปของบุคคลที่สามที่เป็นอันตรายสร้างส่วนหัวซึ่งใช้คุกกี้ของผู้ใช้ที่ Chrome (หรือเบราว์เซอร์อื่น) จัดเก็บและแนบไปกับคำขอได้ คุกกี้สามารถตรวจสอบสิทธิ์การทำธุรกรรมในเซิร์ฟเวอร์ที่เป็นอันตรายซึ่งจะไม่สามารถทำได้ในกรณีอื่น

กำลังแนบส่วนหัวที่อยู่ในรายการที่อนุมัติของ CORS ในคำขอแท็บที่กำหนดเอง

แท็บที่กำหนดเองเป็นวิธีพิเศษในการเปิดใช้หน้าเว็บในแท็บเบราว์เซอร์ที่กำหนดเอง คุณสร้าง Intent แท็บที่กำหนดเองได้โดยใช้ CustomTabsIntent.Builder() คุณยังแนบส่วนหัวกับ Intent เหล่านี้ได้โดยใช้ Bundle ที่มีแฟล็ก Browser.EXTRA_HEADERS ดังนี้

CustomTabsIntent intent = new CustomTabsIntent.Builder(session).build();

Bundle headers = new Bundle();
headers.putString("bearer-token", "Some token");
headers.putString("redirect-url", "Some redirect url");   
intent.intent.putExtra(Browser.EXTRA_HEADERS, headers);

intent.launchUrl(Activity.this, Uri.parse("http://www.google.com"));

เราแนบส่วนหัวที่อยู่ในรายการที่อนุมัติไว้กับคำขอ CORS ของแท็บที่กำหนดเองได้เสมอ แต่ Chrome จะกรองส่วนหัว ที่ไม่ได้รับอนุมัติโดยค่าเริ่มต้น แม้ว่าเบราว์เซอร์อื่นจะมีลักษณะการทำงานที่ต่างกัน แต่นักพัฒนาซอฟต์แวร์ควรบล็อกส่วนหัวที่ไม่ได้รับอนุมัติโดยทั่วไป

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

การเพิ่มส่วนหัวไปยัง Intent แท็บที่กำหนดเอง

ตั้งค่าลิงก์เนื้อหาดิจิทัล

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

ทำตามคู่มืออย่างเป็นทางการเพื่อตั้งค่าลิงก์เนื้อหาดิจิทัล สำหรับการใช้ความสัมพันธ์ของลิงก์ "delegate_permission/common.use_as_origin"` ซึ่งระบุว่าแอปทั้งสองเป็นของต้นทางเดียวกันเมื่อลิงก์ได้รับการยืนยันแล้ว

สร้างความตั้งใจสำหรับแท็บที่กำหนดเองพร้อมส่วนหัวเพิ่มเติม

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

MULTI_LINE_CODE_PLACEHOLDER_1

สร้าง Intent และเพิ่มส่วนหัวพิเศษดังนี้

MULTI_LINE_CODE_PLACEHOLDER_2

ตั้งค่าการเชื่อมต่อแท็บที่กำหนดเองเพื่อตรวจสอบลิงก์เนื้อหา

การเชื่อมต่อแท็บที่กำหนดเองใช้ในการตั้งค่า CustomTabsSession ระหว่างแอปกับแท็บ Chrome เราต้องใช้เซสชันนี้เพื่อยืนยันว่าแอปและเว็บแอปเป็นของต้นทางเดียวกัน การยืนยันจะผ่านในกรณีที่ตั้งค่าลิงก์เนื้อหาดิจิทัลอย่างถูกต้องเท่านั้น

ขอแนะนำให้โทรไปที่ CustomTabsClient.warmup() ช่วยให้แอปพลิเคชันเบราว์เซอร์สามารถเริ่มต้นการทำงานล่วงหน้าในเบื้องหลังและเร่งกระบวนการเปิด URL

MULTI_LINE_CODE_PLACEHOLDER_3

ตั้งค่าโค้ดเรียกกลับที่เปิดใช้ Intent หลังจากตรวจสอบความถูกต้อง

CustomTabsCallback ได้ถูกส่งผ่านเข้าสู่เซสชัน เราตั้งค่า onRelationshipValidationResult() ให้เปิดตัว CustomTabsIntent ที่สร้างขึ้นก่อนหน้านี้เมื่อการยืนยันต้นทางสำเร็จ

MULTI_LINE_CODE_PLACEHOLDER_4

เชื่อมโยงการเชื่อมต่อบริการของแท็บที่กำหนดเอง

การเชื่อมโยงบริการจะเป็นการเรียกใช้บริการและจะมีการเรียกใช้ onCustomTabsServiceConnected() ของการเชื่อมต่อในที่สุด อย่าลืมยกเลิกการเชื่อมโยงบริการอย่างเหมาะสม การเชื่อมโยงและยกเลิกการเชื่อมโยงมักจะทำในวิธีวงจรกิจกรรม onStart() และ onStop()

// Bind the custom tabs service connection.
// Call this in onStart()
CustomTabsClient.bindCustomTabsService(this,
    CustomTabsClient.getPackageName(MainActivity.this, null), connection);

// …
// Unbind the custom tabs service.
// Call this in onStop().
unbindService(connection);

รหัสแอปพลิเคชันการสาธิต

คุณดูรายละเอียดเพิ่มเติมเกี่ยวกับบริการแท็บที่กำหนดเองได้ที่นี่ ดูที่เก็บใน GitHub ของ android-browser-helper สำหรับแอปตัวอย่างที่ใช้งานได้

สรุป

คู่มือนี้ได้สาธิตวิธีเพิ่มส่วนหัวที่กำหนดเองไปยังคำขอ CORS ที่กำหนดเอง ส่วนหัวที่ได้รับอนุมัติสามารถแนบไปกับคำขอ CORS ทุกแท็บที่กำหนดเองได้ โดยทั่วไปส่วนหัวที่ไม่ได้รับอนุมัติจะถือว่าไม่ปลอดภัยในคำขอ CORS และ Chrome จะกรองส่วนหัวเหล่านั้นโดยค่าเริ่มต้น การแนบไฟล์จะอนุญาตเฉพาะไคลเอ็นต์และเซิร์ฟเวอร์ที่มีต้นทางเดียวกัน ซึ่งได้รับการยืนยันด้วยลิงก์เนื้อหาดิจิทัล