開發一個 App Clip 並不難！咱們立立刻開發教程

做者｜何世友、彭權華

在 2020 年 6 月 23 日的 WWDC 大會中，蘋果發佈了 App Clips 。

App Clip（官方翻譯：輕 App；民間翻譯：「蘋果」小程序），是主 app 輕量級的版本，旨在在特定場景爲用戶提供快速便捷的體驗。

若是你在上班路上通過一家咖啡店想購買一杯咖啡，但發現排隊下單付款的人不少，此刻你只須要使用 iPhone 自帶的掃碼工具掃描咖啡商店的 App Clip 二維碼或 NFC 標籤，就能夠購買一杯咖啡，無需下載安裝咖啡商店的 app。

圖片來源：蘋果官網 

這應用場景聽起來是否是跟微信小程序很像？

是的，因而咱們在 App Clips 發佈後就馬上進行了 App Clips 和微信小程序的對比和實操（點此閱讀詳細內容）。

咱們發現，App Clips 和微信小程序的存在都是爲了解決同一個問題。但就開發而言，App Clips 和微信小程序亦存在着方向上的差別。

微信小程序是 0 到 0.1 再到 1.0。開發者爲提供一個服務，從頭開始開發小程序，用戶用完即走，體驗很棒。App Clips 則是從 1.0 到 0.1，是對現有 app 的一種改良，所以在開發上遇到的麻煩反而會少一些。

下面，咱們就針對 App Clip 幾個重要特性進行詳細說明，並以 App Clip demo 爲例，講一講開發的那些事。不管你是基於實際業務須要，或者學習、探索新事物的需求，只要具有必定的開發基礎，經過本教程，也能輕鬆搞定一個 App Clip。

App Clip 的技術限制

App Clip 僅限應用於特定場景，即儘量快地完成一個任務，即用即走。你能夠把它看做主 app 的核心功能應用，對於複雜的任務應該在其對應的主 app 完成，所以某些功能被禁止在 App Clip 中使用。

安裝包大小 10M 之內

當彈出 App Clip Card 時會當即下載 App Clip，安裝包大小的限制保證了用戶體驗——當用戶打開 App Clip 時大機率已經下載好。

不能使用指定 Framework

Assets Library, CallKit, CareKit, CloudKit, Contacts, Contacts UI, Core Motion, File Provider, File Provider UI, HealthKit, HomeKit, Media, Player, Messages, Message UI, PhotoKit, ResearchKit, SensorKit, Speech

以上 Framework 不能在 AppClip 使用，若使用了在編譯時不會報錯，而是在運行時報錯或者返回錯誤的結果。

與用戶隱私相關操做

1. 不能跟蹤用戶信息，也不能經過 identifierForVendor 來獲取用戶惟一標識。
2. 不能持續地獲取用戶位置，每次使用位置須要請求用戶受權，第二天凌晨 4:00，會自動關閉受權。再次使用位置時，須要用戶從新受權。
3. 只容許 App Clip 和其對應的主 app 通訊，不容許和其餘 app 進行通訊，這就致使微信登陸分享支付等功能在 App Clip 裏使用不了。
4. 不能訪問蘋果音樂、多媒體，通信錄，文件，運動健康，相冊等數據。

其餘複雜任務

1. 後臺活動：網絡請求、位置更新等
2. 藍牙鏈接
3. App extensions
4. URL schemes
5. 內購（In-app purchases）（區別蘋果支付 Apple Pay，在 App Clip 是可以使用蘋果支付的）

App Clips 的消息推送

微信小程序不能經過 Push 的方式觸達用戶曾讓開發者憂心忡忡。而手機廠商推出的系統級應用在這方即可以給開發者更多的底氣，不論是蘋果的 App Clips 仍是國產手機生態的快應用，服務的消息推送能力都是吸引開發者的重要能力。

消息推送在 App Clip 的應用分兩種場景：短期內推送和長時間內的推送。（查看官方文檔）

短期內推送

用戶在啓動 App Clip 後，8 小時內能夠收到消息推送。好比用戶在 App Clip 購買了一杯咖啡後就退出了 App Clip，當咖啡準備好了，用戶就會收到一個「咖啡已準備好」的推送。這方式只須要在 Info.plist 屬性文件中添加 NSAppClip Key，並將 NSAppClipRequestEphemeralUserNotification 設置爲 true，就能默認獲取消息推送的權限。

長時間內推送

用戶在 App Clip 完成一個任務後，可能過了幾天纔會收到推送。好比用戶在 App Clip 租了輛車，租期爲 3 天，到期後會用戶收到「該還車了」的推送。這種方式和普通 app 的消息推送同樣，都須要獲取用戶的推送受權。

使用 MinCloud 建立一個 App Clip

接下來將演示如何使用 知曉雲 MinCloud 快速建立一個動態數據服務的 App Clip。該 Clip 主要展現了一個產品列表，點擊產品便可跳轉到產品詳情頁。經過集成 MinCloud 從知曉雲獲取產品信息，最後爲該 Clip 生成一個二維碼，用戶只需使用 iOS 14 的掃碼工具掃描二維碼，便可跳轉到 Clip。

建立 App Clip Target

在已存在的 SugarDemo 工程建立一個 App Clip Target，並命名爲 SugarClip。

這時在工程目錄中多了個 SugarClip 目錄，接下來咱們就能夠在這裏實現 App Clip 了。

導入 MinCloud

經過 CocoaPods 集成 MinCloud，打開 Podfile 文件，添加如下內容：

platform :ios, '11.0'
 
target 'SugarClip' do
 use_frameworks!
 
 pod 'MinCloud', :git => 'https://github.com/ifanrx/hydrogen-ios-sdk.git'
 pod 'Moya', '~> 13.0'
 pod 'SnapKit'
 pod 'Kingfisher'
 
end
 
target 'SugarDemo' do
 use_frameworks!
 
 pod 'MinCloud',:git => 'https://github.com/ifanrx/hydrogen-ios-sdk.git'
 pod 'SnapKit'
 pod 'Kingfisher'
 
end

添加完後，執行 pod install 安裝。

安裝好 MinCloud 後在工程中導入 MinCloud，打開 Sugar Clip 的 AppDelegate.swift 文件，在文件頂部添加 import MinCloud，並在 application(_: didFinishLaunchingWithOptions:) 方法內添加：

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
 // Override point for customization after application launch.
 
 BaaS.register(clientID: "fdc4feb5403a985fe681") // 註冊 clientid
 BaaS.isDebug = true // 是否打印日誌
 return true
}

獲取產品數據

Product 結構

首先建立一個 Product 結構，用於表示產品信息。

struct Product: Decodable {
 public var id: String                  // 產品 id
 public var name: String?               // 產品名稱
 public var participantCount: Int?      // 參與討論人數
 public var coverImage: String?         // 封面圖
 public var rating: Double?             // 產品評分
 public var brief: String?              // 產品簡介
 public var description: String?        // 產品描述
}

獲取產品列表

func loadProductList() {
 let table = Table(tableId: "105766")
 table.find { [weak self] (recordList, error) in
 if let list: List<Product> = recordList?.listInfo.decoded() {
 self?.products = list.objects
 self?.tableView.reloadData() // 刷新產品列表
 }
 }
}

Table 對應 MinCloud 的表結構，經過表 id 就能夠操做對應表數據。使用 find 操做來獲取產品表全部產品記錄，獲取產品記錄後，將其解碼爲 List 對象。

獲取產品詳情

func loadProduct() {
 let table = Table(tableId: "105766")
 table.get(productId) { [weak self] (record, error) in
 if let product: Product = record?.recordInfo.decoded() {
 self?.product = product
 self?.displaySubviews() // 展現產品詳細信息
 }
 }
}

使用 get 操做指定產品的 id 獲取產品的全部信息，獲取產品記錄後，將其解碼爲 Product 對象。

產品頁面

在項目中建立了 ProductCell、RatingLabel、BriefView 等視圖控件，分別顯示產品列表項、產品評分、產品簡介等信息。而這些控件能夠在主 App 和 App Clip 複用。所以在 SugarDemo 目錄中建立了須要複用的組件，並將對應的文件的 Target Membership 中勾選 SugarDemo 和 SugarClip 便可複用。

喚醒 App Clip

開發完 App Clip 後，咱們能夠點擊 Smart app Banner，掃碼二維碼或 NFC 標籤，點擊 Siri 獲取基於位置的建議，短信等方式來喚醒（invacation）App Clip。

在 AppClip 能夠被喚醒以前須要配置 Launch Experience，即給 App Clip 配置一個 URL 和 App Clip Card 信息。在開發階段能夠直接配置 Local Experience 或者在 testflight 上進行配置。App Clip 準備發佈時，須要在 app store connect 上進行配置。

本文主要介紹 Local Experience 方式，其餘方式可參考蘋果開發文檔。

1. 首先將 SugarClip 經過 Xcode 在手機運行起來。
2. 打開手機【設置】-【開發者】-【Local Experience】-【Register Local Experience】

• 填入 URL PREFIX，打開任何以 URL PREFIX 爲前綴的 URL，都會被當作打開 App Clip 來處理。
• 填入 Clip Bundle Id。
• 填入 Title、Subtitle，選擇一張圖片，這些信息將會顯示在 App Clip Card 上。

1. 步驟 2 的 URL PREFIX 編碼成一個二維碼(https://www.qr-code-generator...

1. 使用控制面板的二維碼掃描器掃描，將會彈出 App Clip Card。

1. 點擊查看，進入 App Clip。

至此，咱們已經完成了一個 App Clip 的開發。

總結

開發難度：

App Clip 從技術選型上是面向 iOS 開發者的，對 iOS 開發者來講，開發 App Clip 能夠簡單到修改點配置便可發佈。而若是是小程序開發者想要入坑，有兩條路能夠走：

1. 學習 iOS 原生開發；
2. 等待跨端的框架適配 App Clip。

挑戰：

App Clip 現階段只容許使用 Sign in with Apple 蘋果登陸、Apple Pay 蘋果支付，沒法集成微信登陸、微信支付等線下服務場景主流的第三方能力。這對想要使用 App Clip 優化線下服務體驗來講是個挑戰，畢竟國內開通了 Apple Pay 的不是多數。但願 App Clip 團隊早日推出更好的解法。

紅利：

App Clip 體驗輕巧優秀，開發者可經過 App Clip 爲主體 app 作一個試玩試用版本，讓用戶快速體驗，以下降用戶安裝門檻，提升總體轉化率。

經過這篇文章，但願你也能高效的開發一個 App Clip。

相關閱讀

• App Clips 和微信小程序區別在哪？咱們作了一次上手實操
• iOS 14 更新後，咱們立馬體驗了蘋果「小程序」！