如何把app放到手機桌面快捷方式（如何在手機桌面新增app快捷方式）
iOS中給App新增快捷方式的幾種方案：
- 3DTouch，長按App喚起3DTouch選單，這個同時也可以當做小元件新增到首屏左邊的快捷方式頁面中。
- 通過Siri喚醒對應的App。
- 直接在桌面新增對應的快捷方式，點選快捷方式直接跳到某個App的某個功能。
方案1，3DTouch的入口不太容易發現，方案2，是跟Siri做的語音互動，下面重點說下方案三。
方案三是利用了Safari的PWA功能，將編碼好的網頁內容和圖示儲存到桌面。點選桌面快捷方式開啟網頁執行JS，跳轉到App對應的功能。
下面是實現步驟
1. 配置App跳轉的URL
在Xcode的Target->Info->URL Types的URL Schemes新增addshortcuts，作為跳轉url的協議頭。
我們給app中需要新增快捷方式的功能頁設定好跳轉
url:addshortcuts://profile。並在AppDelegate中新增如下程式碼
func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey : Any] = [:]) -> Bool {
let storyboard = UIStoryboard.init(name: "Main", bundle: Bundle.main)
let featureVc = storyboard.instantiateViewController(withIdentifier: "FeatureViewController")
if let navController = window?.rootViewController as? UINavigationController, let topController = navController.topViewController{
if topController.isKind(of: FeatureViewController.self) {
return true
}
if url.absoluteString == "addshortcuts://profile" {
navController.pushViewController(featureVc, animated: false)
}
}
return true
}到這裡我們可以在瀏覽器中輸入addshortcuts://profile，如果可以跳轉到App對應的功能頁面表示一切正常。
2. 設定新增快捷方式到桌面的引導H5頁面和跳轉到App的H5頁面
1. 引導新增桌面快捷方式的H5頁面
2. 跳轉到App的H5頁面
這個頁面是個空白頁，當我們點選快捷方式的時候，通過這個空白頁跳轉到App。
開啟空白頁，執行下面這段JS，模擬點選上面的a標籤
var element = document.getElementById('redirect');
var event = document.createEvent('MouseEvents');
event.initEvent('click', true, true, document.defaultView, 1, 0, 0, 0, 0, false, false, false, false, 0, null);
document.body.style.backgroundColor = '#FFFFFF';
setTimeout(function() { element.dispatchEvent(event); }, 25);
其實引導頁和跳轉頁可以放到一起，通過
window.navigator.standalone檢測Safari開啟的Web應用程式是否全屏顯示。如果是全屏顯示錶示是從桌面快捷方式進入的，那麼就顯示空白頁，自動執行上面那段JS。如果不是全屏顯示錶示是從app跳轉過去的引導頁。
3. 搭建可以開啟編碼後H5頁面的本地server
1. h5編碼
Safari可以直接開啟一串包含頁面內容編碼的URL，這個URL包含了這個頁面需要的所有資訊。
data:text/html;base64,PGEgaHJlZj0iaHR0cHM6Ly9naXRodWIuY29tL0RhcmllbENoZW4vaU9TVGlwcyI aU9TVGlwczwvYT4=
在Safari中輸入上面那串URL,會顯示一個iOSTips的標籤。跟正常的標籤一樣，這是因為上面的URL是我們經過base64編碼後處理的。同樣我們可以把h5頁面轉化成這種URL編碼格式。
2. 搭建本地server
iOS中不能用UIApplication.shared.open(url)的方式開啟包含Base64編碼的URL，如果我們用SFSafariViewController,它也是不能夠識別這個格式的URL。這個問題好像是出在蘋果那邊。
那支付寶是怎麼做的呢？它是直接把這個頁面部署到了服務端，我們可以參考這種方法，用Swifter搭建一個本地的server。
guard let deeplink = URL(string: "addshortcuts://profile") else {
return
}
guard let shortcutUrl = URL(string: "http://localhost:8244/s") else {
return
}
guard let iconData = UIImage(named: "feature_icon")?.jpegData(compressionQuality: 0.5) else {
return
}
let html = htmlFor(title: "功能快捷方式", urlToRedirect: deeplink.absoluteString, icon:
iconData.base64EncodedString())
guard let base64 = html.data(using: .utf8)?.base64EncodedString() else {
return
}
server["/s"] = { request in
return .movedPermanently("data:text/html;base64,/(base64)")
}
try? server.start(8244)