从应用程序链接到Safari“添加到主屏幕”？
我的应用程序有一个自定义的URLscheme，可以使用深层链接直接从URL跳转到某些内容。 我很想在最近的Facebook Groups应用程序中复制这个行为，允许用户点击应用程序中的“添加到主屏幕”button，然后将它们带到Safari中定制devise的localhost主页上，点击Safari的“共享”和“添加到主屏幕”button，然后在主屏幕上添加一个图标，当点击该button时，会将其带入群组应用程序以及相应的特定群组。
我的问题是，如果我发送我的自定义url计划深层链接到Safari，用户可以点击添加到主屏幕之前，它会遵循该链接，并刚刚结束在我的应用程序。 我需要向Safari发送一些不会真正跟随深层链接的东西，但是如果用户将它添加到主屏幕，它仍然会链接到它，我不知道该怎么做。
Facebook群组在Safari地址栏中生成的链接看起来像这样，他们是否可能直接将JavaScriptembedded到URL中？
data:text/html;charset=UTF-8;base64, <tens of thousands of characters in an alpha-numeric string>
任何想法是什么，我怎么可能做类似的事情？
如果您将这些字符粘贴到任何在线base64解码器，您将得到以下内容：
<!DOCTYPE HTML> <html> <head id="htmlHead"> <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no;" /> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta name="apple-mobile-web-app-capable" content="no" /> <title>Promote Groups or Pages</title> <link rel="apple-touch-icon-precomposed" href="data:image/png;base64, </head> <body> <a id="redirect" href="fb-groups://group?id=1503507809911018&s=s"></a> </body> </html> <script type="text/javascript"> function jump() { var e = document.getElementById('redirect'); var ev = document.createEvent('MouseEvents'); ev.initEvent('click', true, true, document.defaultView, 1, 0, 0, 0, 0, false, false, false, false, 0, null); e.dispatchEvent(ev); window.close(); } if (("standalone" in window.navigator) && window.navigator.standalone) { document.body.style.backgroundColor = '#000000'; jump(); } else { var time = 1422371365; var timeout = new Date().getTime() / 1000; if (timeout > time + 4) { document.write('</head><body bgcolor="#fff"><div align="center"></div>'); jump(); } else { document.write( #### )} } </script>
而不是####有以下几点：
<style> html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; font-family: HelveticaNeue-Light, sans-serif; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none } a { color: inherit; text-decoration: none } #headerBox { width: 100%; height: 48px; border-bottom: .5px solid #979797; background-color: #F6F6F6; text-align: center } #popoverBox { position: absolute; bottom: 15px; width: 290px; height: 132px; -webkit-border-radius: 11px; border-radius: 11px; background-color: #2891F7; border: none; margin-left: -145px; left: 50% } #popoverBox:after { top: 100%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(40, 145, 247, 0); border-top-color: #2891F7; border-width: 13px; margin-left: -13px } .icon { margin-bottom: 5px } #groupIconContainer { margin-left: 40px; width: 60px; float: left; height: 100% } #groupIcon { height: 60px; width: 60px; -webkit-border-radius: 14px; border-radius: 14px; background-color: #FFF; margin-top: 25px } #addToHomeIconContainer { margin-right: 40px; width: 60px; float: right; height: 100% } #addToHomeIcon { margin-top: 25px } #arrow { margin: 0 auto; display: block; margin-top: 49px } #infoText { color: #141823; font-size: 18px; line-height: 28px; text-align: center; width: 280px; height: 160px; margin: auto; position: absolute; top: 0; left: 0; bottom: 0; right: 0 } .iconLabelContainer { font-size: 12px; color: #FFF; line-height: 14px; width: 100px; height: 30px; margin-left: -20px; text-align: center } #groupCoverImage { box-sizing: border-box; -webkit-box-sizing: border-box; background-size: cover; background-position: center; background-image: url("data:image/png;base64, width: 52px; height: 52px; border-radius: 50%; position: relative; top: 4px; left: 4px; border: 0.5px solid rgba(0, 0, 0, 0.10); } </style> <body> <div id="headerBox"><span style="font-size:17px;color:#2891F7;line-height:20px;position:relative;top:13.5px"><a href="fb-groups://">Отмена</a></span> </div> <div id="infoText">Коснитесь кнопки <svg style="vertical-align:text-bottom" width="22px" height="30px" viewbox="0 0 44 60" version="1.1"> <defs></defs> <g id="Final" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="Add-Group-to-Home-Screen" transform="translate(-299.000000, -459.000000)"> <g id="Tap-+-below-+-Share-Icon" transform="translate(231.000000, 458.000000)"> <g id="share-icon" transform="translate(60.000000, 0.000000)"> <path d="M20.4,12 L30,2.4 L39.6,12" id="Shape" stroke="#3F75FF" stroke-width="2"></path> <path d="M30,39.0000013 L30,2.7996" id="Shape" stroke="#3F75FF" stroke-width="2"></path> <rect id="Rectangle-path" x="0" y="0" width="60" height="60"></rect> <path d="M20.2682927,20 L9,20 L9,60 L51,60 L51,20 L39.7317073,20" id="Shape" stroke="#3F75FF" stroke-width="2"></path> </g> </g> </g> </g> </svg> ниже, <br>Затем коснитесь “Добавить на основной экран”</div> <div id="popoverBox"> <div id="groupIconContainer"> <div id="groupIcon" class="icon"> <div id="groupCoverImage"></div> </div> <div class="iconLabelContainer">Promote Groups or Pages</div> <!-- Replace with dynamic name --> </div> <div id="addToHomeIconContainer"> <svg id="addToHomeIcon" width="60px" height="60px" viewbox="0 0 120 120" version="1.1"> <defs></defs> <g id="Add-Group-to-Home-Screen-Spec" transform="translate(-410.000000, -802.000000)"> <g id="Add-to-Home-Screen" transform="translate(367.000000, 802.000000)"> <g id="Add-to-Home-Screen-Icon" transform="translate(43.000000, 0.000000)"> <rect id="Rectangle-6" fill="#FFFFFF" x="0" y="0" width="120" height="120" rx="28"></rect> <rect id="Rectangle-6" fill="#686870" x="25" y="25" width="70" height="70" rx="15"></rect> <path d="M58,58 L58,46.991617 C58,45.8978404 58.8954305,45 60,45 C61.1122704,45 62,45.8916773 62,46.991617 L62,58 L73.008383,58 C74.1021596,58 75,58.8954305 75,60 C75,61.1122704 74.1083227,62 73.008383,62 L62,62 L62,73.008383 C62,74.1021596 61.1045695,75 60,75 C58.8877296,75 58,74.1083227 58,73.008383 L58,62 L46.991617,62 C45.8978404,62 45,61.1045695 45,60 C45,58.8877296 45.8916773,58 46.991617,58 L58,58 Z" id="Rectangle-8" fill="#FFFFFF"></path> </g> </g> </g> </svg> <div class="iconLabelContainer">Добавить на <br>основной экран</div> </div> <svg id="arrow" width="12px" height="20px" viewbox="0 0 24 40" version="1.1"> <defs></defs> <g id="Explorations" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="Add-Group-to-Home-Screen" transform="translate(-307.000000, -847.000000)" stroke-linecap="round" stroke="#FFFFFF" stroke-width="5"> <g id="Group" sketch:type="MSLayerGroup" transform="translate(30.000000, 752.000000)"> <path d="M297,132 L280,115 L297,98" id="Path-35" transform="translate(288.500000, 115.000000) rotate(-180.000000) translate(-288.500000, -115.000000) "></path> </g> </g> </g> </svg> </div> <div id="popoverNub"></div>');
所以我相信他们的实现如下：
1）应用程序中embedded了Web服务器（如RoutingHTTPServer ）。 它运行在像5555这样的端口上，并被configuration为返回一个页面，其内容如下：
<HTML><script>window.location.href=[data:text/html;charset=UTF-8;base64, tens of thousands of characters in an alpha-numeric string]</script></HTML>
语法是错误的，但想法是用该base64编码数据replace当前URL（ http：// localhost：5555 ）。
2）当你点击add to home page应用程序的add to home page ，它打开Safari中的链接http://localhost:5555 ，应用程序内的Web服务器响应网页，包含一个脚本，用base64编码replaceURL数据（此数据包含当前时间，脚本生成时）
3）从base64编码的数据的内容，你可以看到有两个检查：
a）如果应用程序不在Safari中运行，而是独立运行
b）如果脚本生成了一段时间
如果这些陈述中的任何一个是真实的，您将使用深层链接redirect到应用程序。 如果他们都是假的，页面提示用户添加链接到主屏幕显示（这就是我所代替的#### ）。
当链接添加到主屏幕时，所有这些脚本和网页将作为base64编码数据embedded到该链接中。