WebClip完成IOS的Wap封装

追影

当我们使用PC频繁访问某一个网站的时候，大部分人的做法是创建一个书签或者直接创建一个快捷方式。但是我们在使用移动设备的时候，好像并没有创建桌面快捷方式这么一个功能，是不是只能使用书签来访问呢？

又或者我们想要把我们的wap站点封装成IOS应用，直接使用IOS原生封装开发成本上升，使用第三方应用封装，基本上通过不了AppStore的审核，只能使用企业签名才能让用户使用APP，这无疑使成本又增加，而且第三方提供的企业签名经常不稳定，导致软件无法使用造成用户流失。

IOS为我们提供了WebClip的一个描述文件，它可以把我们的网站创建成桌面快捷方式，并且可以自定义图标，帮我们省去打开浏览器的步骤，当然值得注意的是它只能调用Safari打开网页。

Tip: 现在签名市场上说的永不掉签封装，用的就是这个方法。

步骤
（1） 我们将为您生成WebClip文件

（2）把文件放到您网站上，使他能够访问下载，值得注意的是，我们只能通过Safari浏览器来访问它，否则安装不了。

（3）您的webapp网页代码 head里中加入下面代码 目的解决WebClip自动跳转Safari问题
如果发现当网站跳转的时候，会自动打开Safari跳转网站，并且会丢失之前的动作，比如说登录状态，用户体验极差。
现在我们就来解决这个问题：

将下面代码复制到您webapp每个网页的＜head ＞标签中，请务必确保所有网页均写有此代码。

1. <script>if(("standalone" in window.navigator) && window.navigator.standalone){
   
2.         var noddy, remotes = false;
   
3.         document.addEventListener('click', function(event) {
   
4.                 noddy = event.target;
   
5.                 while(noddy.nodeName !== "A" && noddy.nodeName !== "HTML") {
   
6.                         noddy = noddy.parentNode;
   
7.                 }
   
8.                 if('href' in noddy && noddy.href.indexOf('http') !== -1 && (noddy.href.indexOf(document.location.host) !== -1 || remotes)){
   
9.                         event.preventDefault();
   
10.                         document.location.href = noddy.href;
    
11.                 }
    
12.         },false);
    
13. }</script>

复制代码