เป้าหมายการแชร์เว็บช่วยให้ PWA รับเนื้อหาที่แชร์จากแอปพลิเคชันอื่นที่ติดตั้งบน อุปกรณ์ ตัวอย่างเช่น ฟีเจอร์นี้สามารถใช้โดยแอปพลิเคชันต่างๆ อย่างโปรแกรมแก้ไขรูปภาพ ได้รับรูปภาพจากแอปกล้องถ่ายรูปหรือโซเชียลเน็ตเวิร์ก เพื่อรับรูปภาพหรือวิดีโอสำหรับการแชร์
ตั้งแต่ Chrome 86 เป็นต้นไป Web Share Target จะพร้อมให้บริการสำหรับแอปพลิเคชันที่ใช้ กิจกรรมบนเว็บและที่เชื่อถือได้ แม้ว่า PWA จะทำงานได้ในทันที แต่ก็ต้องทำการเปลี่ยนแปลงบางอย่าง แอปพลิเคชัน Android
บทความนี้จะถือว่านักพัฒนาแอปมีความคุ้นเคยกับกิจกรรมบนเว็บที่เชื่อถือได้ ผู้อ่านที่เพิ่งเริ่มใช้ เทคโนโลยีนั้นสามารถเริ่มต้นใช้งานได้ด้วยคู่มือการผสานรวม
ในทำนองเดียวกัน คำอธิบายแบบเต็มของการใช้ Web Share Target ใน PWA ก็อยู่ภายนอก และนักพัฒนาซอฟต์แวร์จะดูข้อมูลเพิ่มเติมได้จากบทความนี้
แอปพลิเคชันเดโมที่ https://scrapbook-pwa.web.app/ จะใช้เป็น PWA สำหรับกรณีนี้ และมีซอร์สโค้ดใน GitHub และแอปพลิเคชัน Android นั้นอิงตาม การสาธิตกิจกรรมบนเว็บที่เชื่อถือได้เบื้องต้น
เพิ่มเป้าหมายการแชร์เว็บลงในแอป Android
แก้ไขแอปพลิเคชันที่มีอยู่ซึ่งอิงจากกิจกรรมในเว็บที่เชื่อถือได้เพื่อใช้การแชร์บนเว็บ เป้าหมาย โดยต้องมีการแก้ไขในไฟล์ที่แตกต่างกัน 3 ไฟล์ ดังนี้
Build.gradle
ไลบรารี android-browser-helper ได้รับการอัปเดตให้รองรับ Web Share Target เพื่อ ขั้นแรก ให้อัปเดตแอปพลิเคชันให้ใช้เวอร์ชันที่สูงกว่าหรือเท่ากับ 2.0.1
dependencies {
...
implementation 'com.google.androidbrowserhelper:androidbrowserhelper:2.2.0'
}
res/strings.xml
แอปพลิเคชันต้องแจ้งให้กิจกรรมบนเว็บที่เชื่อถือได้ทราบถึงรายละเอียดของการแชร์ที่รองรับ เช่น URL ที่จะเปิด เมธอดที่ใช้ และประเภท MIME ที่รองรับ
ซึ่งทำผ่าน JSON ซึ่งพร้อมใช้งานในกิจกรรมบนเว็บที่เชื่อถือได้ที่มีทรัพยากรสตริง
จะเหมือนกับช่อง share_target
ที่มีอยู่ในไฟล์ Manifest ของเว็บและสามารถเพิ่มลงใน
สตริงภายใน strings.xml
เกือบเท่ากับที่มีหมายเหตุสำคัญ 2 ประการ ได้แก่
- ค่าของแอตทริบิวต์การดำเนินการต้องเป็น URL แบบเต็ม รวมถึงต้นทาง
- เครื่องหมายอัญประกาศคู่ต้องเป็นอักขระหลีก ดังนั้น
"
แต่ละรายการจึงกลายเป็น\"
นี่คือหน้าตาส่วน share_target
ของ https://scrapbook-pwa.web.app/manifest.json
อย่างเช่น:
{
...
"share_target": {
"action": "/_share-target",
"enctype": "multipart/form-data",
"method": "POST",
"params": {
"files": [{
"name": "media",
"accept": [
"audio/*",
"image/*",
"video/*"
]
}]
}
},
...
}
และองค์ประกอบสตริงใหม่จะมีลักษณะดังนี้
<string name="share_target">
{
\"action\": \"https://twa-web-scrapbook.web.app/_share-target\",
\"method\": \"POST\",
\"enctype\": \"multipart/form-data\",
\"params\": {
\"files\": [{
\"name\": \"media\",
\"accept\": [\"image/*\", \"audio/*\", \"video/*\"]
}]
}
}
</string>
AndroidManifest.xml
ต้องมีการเปลี่ยนแปลง 2 รายการในไฟล์ Android Manifest ก่อนอื่น เราต้องตรวจสอบให้แน่ใจว่า
ประกาศ ส่งออก และเปิดใช้ DelegationService
แล้ว
นักพัฒนาแอปที่สร้างแอปพลิเคชันโดยใช้การสาธิตพื้นฐานจะมีบริการ รวม และมาร์กอัปควรอยู่ภายในแท็กแอปพลิเคชันและมีลักษณะดังนี้
<service
android:name="com.google.androidbrowserhelper.trusted.DelegationService"
android:enabled="true"
android:exported="true">
<intent-filter>
<action android:name="android.support.customtabs.trusted.TRUSTED_WEB_ACTIVITY_SERVICE"/>
<category android:name="android.intent.category.DEFAULT"/>
</intent-filter>
</service>
สุดท้าย ต้องเพิ่ม 2 รายการใหม่ลงในแท็กกิจกรรม LauncherActivity ดังนี้
- แท็ก meta-data
ที่อ้างอิง JSON ที่กำหนดไว้ในสตริง .xml
- intent-filter
ที่ประกาศว่าแอปพลิเคชันประเภท MIME สามารถจัดการกับประเภท MIME อื่นได้
แอปในอุปกรณ์
<meta-data
android:name="android.support.customtabs.trusted.METADATA_SHARE_TARGET"
android:resource="@string/share_target"/>
<intent-filter>
<action android:name="android.intent.action.SEND" />
<action android:name="android.intent.action.SEND_MULTIPLE" />
<category android:name="android.intent.category.DEFAULT" />
<data android:mimeType="audio/*" />
<data android:mimeType="image/*" />
<data android:mimeType="video/*" />
</intent-filter>
ดังที่เห็นในมาร์กอัปด้านบน ควรเพิ่มเอลิเมนต์ data
สำหรับ mime-type
แต่ละรายการที่ประกาศ
ใน JSON ของ share_target
บทสรุป
การผสานรวม Web Share Target จะทำให้ PWA ภายในกิจกรรมบนเว็บที่เชื่อถือได้ทำงานได้อย่างลึกซึ้งยิ่งขึ้น ผสานรวมกับแอปพลิเคชันอื่นๆ ที่ติดตั้งในอุปกรณ์ Android
ตามที่อธิบายไว้ในขั้นตอนข้างต้น มาร์กอัปเพิ่มเติมที่ต้องใช้เพื่อเพิ่มการสนับสนุนสำหรับ API ใน แอป Android ที่มีอยู่ซึ่งใช้กิจกรรมบนเว็บที่เชื่อถือได้จะช่วยให้โปรแกรมช่วยเหลือในเบราว์เซอร์ของ Android ใช้งานได้ง่ายขึ้น
อ่านบทความ Web Share Target เพื่อดูข้อมูลเพิ่มเติมในการใช้ API ใน PWA และ Web Share API เพื่อดูวิธีแชร์เนื้อหาจาก Progressive Web App
การแก้ปัญหา
แอปพลิเคชันของฉันไม่ปรากฏเป็นตัวเลือกเมื่อฉันพยายามแชร์ไฟล์จากแอปพลิเคชันอื่น
เมื่อแอปพลิเคชันไม่แสดงขึ้นมาเป็นตัวเลือก แสดงว่า intent-filter
ไม่ถูกต้อง ตรวจสอบมาร์กอัป intent-filter
อีกครั้งเพื่อให้แน่ใจว่ามีการดำเนินการที่ถูกต้อง
และ mime-types
ที่จัดการโดยแอปพลิเคชัน
แอปพลิเคชันของฉันแสดงขึ้นเป็นตัวเลือก โดย PWA เริ่มทำงานแล้ว แต่ไม่มีการแชร์ข้อมูล
มีสาเหตุบางประการที่ทำให้เกิดปัญหานี้ คุณต้องตรวจสอบตามรายการตรวจสอบต่อไปนี้
- ตรวจสอบว่าการตรวจสอบลิงก์เนื้อหาดิจิทัล (Digital Asset Links) เสร็จสมบูรณ์
- โปรดตรวจสอบความถูกต้องของ JSON ภายใน string.xml