用 SwiftUI 實現一個開源的 App Store
App Store 在 iOS 11 之前,App 排行榜一直是衡量開發者 App 活躍度的指標,但在 iOS 11 后蘋果弱化了榜單功能,改為了二級入口,導致查詢榜單困難,編者通過深入調研最終實現了一個查看 App 榜單、搜索、信息、發布生效等強大功能的開源 App。
一、前言
App Store 一直以來都是 iPhone 生態的最重要一環,在初代 iPhone 商店,因為 App 比較少,當時就有 Top 25 榜單:
然后在后續的 App Store 迭代中,排行榜(Top Charts)一直是一個主要的入口,新用戶基本都會從榜單下載 App,所以,榜單的重要性不容忽視。
直到 2017 年,雖然占了不到 30% 的手機份額,但 iPhone 的體量已經非常大,App Store 應用數量已經達到 220 萬。App Store 的展示和推薦,顯然滿足不了每天巨大的新 App,有越來越多的 App 希望得到關注;而另一方面,排行榜刷榜問題一直存在;還有就是 App Store 的設計已經滿足不了需求!比如更新(Updates) 標簽功能單一,就是負責顯示需要更新的 App 列表。
所以,從 iOS 11 開始,蘋果將 AppStore 重新設計,增加了 Today 和 Games 游戲標簽入口,而排行榜列表放到了 Apps 標簽的二級入口中。蘋果加強了自己的編輯團隊推薦的App,在游戲和應用標簽分類的前面也加入了大區域的編輯推薦 App,如今已經看不到榜單了。
而現在 iOS 15 中的 App Store 增加了更多的功能,比如產品頁優化、自定產品頁、App 內活動(In-App Events)等,目的很明顯就是讓開發者增加活躍內容,提升 App 日活和收入。
而排行榜功能,其實已經不單單是一個榜單的作用,經常這些年的沉淀,榜單基本已經穩定。比如大家看到的 App,常年不變,而沖到榜單的 App,會獲得更多的下載量。對于開發者來說,榜單可以用來預測應用收入、使用量和下載量的一個重要指標。對于用戶來說,發現一些有趣或者熱門的 App,依然是部分老用戶的習慣。
所以,編者希望通過實現一個 App Store 排行榜,方便日常查看,同時查看信息,搜索或應用發布狀態訂閱等功能,解決了非常多的痛點問題。
二、效果展示
首先,我們先來介紹一下,目前 iAppStore 實現了那些功能。
iAppStroe[1] 是一款使用 SwiftUI 打造的蘋果商店工具類 App。
提供蘋果實時榜單查詢,包含 iOS 和 iPad 的熱門免費榜、熱門付費榜、暢銷榜,還有新上架榜、新上架免費榜、新上架付費榜等。
提供查詢 app 詳細頁面內容、搜索 app、訂閱 app 狀態等功能。
支持蘋果所有國家和地區的商店,無需切換 Apple Id,即可查看!
2.1 排行榜
首先,App Store 的榜單有很多,包含 iOS 和 iPad 的熱門免費榜、熱門付費榜、暢銷榜,還有新上架榜、新上架免費榜、新上架付費榜等,我們都實現了這些榜單。另外,我們將 App Store 榜單的 UI 還原,同時,也增加了更多的信息展示,比如 App 所屬分類等。
最重要的是,我們把所有國家和地區的商店,都集成在一個面板中,通過下拉列表選擇,實現快速切換榜單。
2.2 App 詳細頁
App 詳細頁面,把開發者最關心的參數顯示在最前面。另外,復制包含或者 App ID 是一個高頻的需求,App 描述和更新方案也高仿了 App Store 的效果。預覽區包含 iPhone 和 iPad 圖片。點擊可以顯示大圖,并且可以下載和分享大圖。
2.3 搜索
搜索區,可以輸入關鍵字模糊搜索,或者 App ID 精準搜索。另外,在右上角切換國家和地區,顯示不同地區的 App 搜索。
2.4 應用狀態訂閱
這個狀態訂閱是什么意思?就是可以監聽 App 在商店的狀態,舉例來說,App 發布了新版本,那么大概要多久才能在商店上顯示呢?所以,我們可以通過蘋果的接口,來定時的查詢 App 的狀態,從而知道 App 什么時候生效。還有新 App 剛剛發布時、或者 App 需要下架了,什么時候才從商店消失等。
2.5 其它
為了方便開發者使用,App 列表長按時,會彈出操作列表,可以已經復制 App 的信息或者快速打開 App Store 產品頁,盡可能的快捷獲取內容!另外,還支持暗黑模式,依然精美絕倫!切換圖標可以選擇自己顯示的圖標等。
大家想要什么功能,可以在評論區留言啊~
三、調研工作
接下來,我們說一下要實現以上功能,需要的 API 怎么調研出來的!通過大量的網頁檢索,最終測試后整理成有價值的列表:
3.1 榜單接口
查詢排行榜的 API 示例
以上內容在蘋果公開的文檔,都沒有查詢到 API 文檔。但為蘋果網站到在一個頁面: Apple Services Performance Partners[6],其中一項服務叫:Enterprise Partner Feed Relational[7](企業信息流合作伙伴?),目前這個合作好像很難申請到。所以,相關的文檔鏈接都無法訪問到,比如 affiliate.itunes.apple.com[8]。
那么以上鏈接中幾個參數類型,因為沒有文檔,所以調研梳理如下:
榜單類型
應用分類
更多分類,參考蘋果網站的 HTML 標簽:App Store[9]
國家或地區標識
更多分類標識,參考蘋果網站的 HTML 標簽:RSS Builder[10]
接口說明
原本接口提供 200 條數據查詢,但 20221 年 9 月 2 日,蘋果接口調整后,大幅削減 App Store 應用排行數據分享,從 1500 名降至 200 名。目前 AppStore 總榜、應用、游戲榜、分類榜只能查看前 200 個 App 的數據。
3.2 搜索接口
App 搜索接口比如簡單,并且有官方文檔:
- iTunes Store API[11]
- iTunes Search API: Constructing Searches[12]
接口示例:
https://itunes.apple.com/search?term=斗羅大陸&country=cn&limit=200&entity=software
term 字段就是關鍵詞,country 字段是國家或地區的標簽,跟上面的榜單接口是同一個。entity=software 固定為搜索軟件就好。詳細的使用,可以參考官方文檔,這里就不展開了。
3.3 App 詳細信息
查詢某個 App 可以使用 lookup 接口,具體可以查看官網文檔:Lookup Examples[13]。
接口示例:
https://itunes.apple.com/cn/lookup?id=1558453472
3.4 App 評論內容
查詢某個 App 的用戶評論內容,沒有在蘋果的文檔中找到,但是根據以上的調研,接口使用問題不大。
接口示例:
https://itunes.apple.com/cn/rss/customerreviews/id=989673964/sortBy=mostRecent/json
地區、App Id、sortBy 字段,就可以搜索。如果需要分頁或者獲取更多,可以參考文末的鏈接。
四、開發思路
有了以上的 API 接口,就能實現我們的 App,這樣使用 SwiftUI 來構建,現已開源:
- iAppStore - GitHub[14]
詳細的實踐過程就不在這樣講解了,因為 App 是工具類應用,交互的內容不多,所以并不是很復雜。當然,使用 SwiftUI 構建 UI 過程異常的快速,但是如果要調整 UI 細節,確定需要花很多心思。比如,SwiftUI 還不支持 WebView,所以用 SFSafariViewController 橋接的 View 在 SwiftUI 組件中顯示會異常。
- How do I use SFSafariViewController with SwiftUI? - Stack Overflow[15]
另外,就是蘋果 API 的坑,接口返回的字段 im:id、im:bundleId,包含冒號,讓人懷疑人生!最后,通過自定義鍵值名,解決了解析映射的問題。詳細,可以參考源代碼中 AppRank.swift[16] 類。
- struct IDAttributes: Codable {
- let imBundleID, imID: String
- // 自定義鍵值名
- enum CodingKeys: String, CodingKey {
- case imID = "im:id"
- case imBundleID = "im:bundleId"
- }
- }
綜上,如果是個人開發的 App,可以開始使用 SwiftUI 來開發,畢竟原生的體驗和原生的組件,用戶起來也很快樂。另外,不考慮支持低版本系統,使用 SF Symbols[17] 提供的圖標,也非常的友好!
五、總結
iAppStore 從構思到實現,花了半個月的時間,期間調研接口和調試接口花了很多時間,網上依然看到很多人問這些接口,相信很多開發者都不知道有這些接口,所以本文也算是一個答案總結,希望這個問題從此消失哈~ 最后,iAppStore 只是從編者需求來實現的一個產品,所以一定存在很多的問題,但同時它是一個開源項目,所以,如果大家有興趣,一起來參與,增加更多有趣或者黑科技的體驗吧!歡迎大家有任何想法或者建議,可以在評論區給我們反饋。也可以到 iAppStore - GitHub[18] 給我們 Star 鼓勵!感謝大家~
參考資料
[1] iAppStroe:
https://github.com/37iOS/iAppStore-SwiftUI
[2] RSS Builder: https://rss.applemarketingtools.com
[3] RSS Information:
https://www.apple.com/rss/
[4] Stack Overflow:
https://stackoverflow.com/questions/29997991/how-to-get-top-400-lists-from-itunes
[5] 鏈接:
https://www.kalman03.com/2015/05/04/tech/appstore_affiliates_resource/
[6] Apple Services Performance Partners:
https://affiliate.itunes.apple.com/resources/
[7] Enterprise Partner Feed Relational:
https://affiliate.itunes.apple.com/resources/documentation/itunes-enterprise-partner-feed/
[8] affiliate.itunes.apple.com:
https://affiliate.itunes.apple.com/resources/documentation/itunes-store-web-service-search-api.html
[9] App Store:
https://apps.apple.com/cn/genre/ios/id36
[10] RSS Builder:
https://rss.applemarketingtools.com/
[11] iTunes Store API:
https://affiliate.itunes.apple.com/resources/documentation/itunes-store-web-service-search-api/
[12] iTunes Search API:
Constructing Searches: https://developer.apple.com/library/archive/documentation/AudioVideo/Conceptual/iTuneSearchAPI/Searching.html#//apple_ref/doc/uid/TP40017632-CH5-SW1
[13] Lookup Examples:
https://developer.apple.com/library/archive/documentation/AudioVideo/Conceptual/iTuneSearchAPI/LookupExamples.html#//apple_ref/doc/uid/TP40017632-CH7-SW1
[14] iAppStore - GitHub:
https://github.com/37iOS/iAppStore-SwiftUI
[15] How do I use SFSafariViewController with SwiftUI? - Stack Overflow:
https://stackoverflow.com/questions/56518029/how-do-i-use-sfsafariviewcontroller-with-swiftui
[16] AppRank.swift:
https://github.com/37iOS/iAppStore-SwiftUI/blob/main/iAppStore/Models/AppRank.swift
[17] SF Symbols:
https://developer.apple.com/sf-symbols/
[18] iAppStore - GitHub:
https://github.com/37iOS/iAppStore-SwiftUI