title: WebClip完成IOS的Wap封装
tags: WebClip,IOS
author: Clown95

背景

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

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

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

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

步骤

生成WebClip

前提条件是你有一个Mac或者你有一个Mac系统，然后通过Appstore下载Apple Configurator 2，这个是苹果官方提供的描述文件创建工具。

首先我们创建一个新的描述文件

我们先选择通用选项，来设置描述文件的一些基本信息

名称为：描述文件设置名字，这个名字并不是快捷方式显示的名字
标识符：我们直接使用默认就行，这个相当于软件的身份证
组织：描述文件创建者，或者网址拥有者
描述：安装描述文件时候显示的介绍信息

我们鼠标滚到最下面，找到WebClip选项，这边才是我们的重头戏

标签：这个才是桌面显示的名称
URL：这个填写我们需要创建快捷方式网站的地址
可移除：选中它，我们就可以像删除应用一样在桌面删除它
图标：在桌面上显示的图标
全屏幕：网站是否全屏显示，如果不勾选将会出现状态栏，我们最好还是勾选下

设置完成我们保存描述文件，把它放到网站上，使他能够访问下载，值得注意的是，我们只能通过Safari浏览器来访问它，否则安装不了。

解决WebClip自动跳转Safari问题

如果你开始使用刚刚制作的描述文件，你是不是发现了一个很严重的问题？当网站跳转的时候，会自动打开Safari跳转网站，并且会丢失之前的动作，比如说登录状态，用户体验极差。

现在我们就来解决这个问题：

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

<script>if(("standalone" in window.navigator) && window.navigator.standalone){var noddy, remotes = false;document.addEventListener('click', function(event) {noddy = event.target;while(noddy.nodeName !== "A" && noddy.nodeName !== "HTML") {noddy = noddy.parentNode;}if('href' in noddy && noddy.href.indexOf('http') !== -1 && (noddy.href.indexOf(document.location.host) !== -1 || remotes)){event.preventDefault();document.location.href = noddy.href;}},false);
}</script>

Tip :使用此代码签请自行测试网站功能的完好性。

Q：代码有什么作用？

A ：此段代码主要是阻止网页唤起Iphone手机Safari浏览器

Q：添加代码后描述文件需要重新生成吗？

A ：不需要生成

Q ：代码会对网站安全产生影响吗？

A ：不影响，代码只是单纯的阻止唤起浏览器。

WebClip完成IOS的Wap封装相关推荐

一劳永逸，iOS 自定义 ActionSheet 封装流程
原文链接:http://www.jianshu.com/p/cfb87a7db7b1 本文为 iOS 自定义视图封装<一劳永逸>系列的第四期,旨在提供封装思路,结果固然重要,但理解过程才最 ...
iOS蓝牙原生封装，助力智能硬件开发
代码地址如下: http://www.demodashi.com/demo/12010.html 人工智能自1956年提出以来,一直默默无闻,近年来人工智能的发展得到重视逐渐发展起步,智能硬件.智能手 ...
iOS中正则表达式封装好的第三方文件
iOS中正则表达式封装好的第三方文件我已经上传了资源哦~ 需要的话可以去下载哦 #import <Foundation/Foundation.h> #import "NSSt ...
原生APP、WAP 封装的APP、面向API的APP区别与联系
现在是移动互联网时代了,用户使用最多的就是手机app了,移动端的流量太大了. 但是,app的开发制作成本却是很多中小站点无法承受的,于是便衍生出了很多做网站打包的公司. 找外包公司开发APP或者自己开 ...
wap ios android,wap 唤起App 的两种方式Schema Universal Link
1.schema 现在线上大多数 App 使用的就是 schema 跳转,都对应一套路由法则,基本都能做到跳转到 App 内任一界面. location.href?=?'schema://xxxx' ...
iOS 跑马灯封装（带点击事件）
1.WAdvertScrollView.h #import <UIKit/UIKit.h> @class WAdvertScrollView; typedef enum : NSUInte ...
Unity3D 与 objective-c 之间数据交互。iOS SDK接口封装Unity3D接口
原地址:http://www.cnblogs.com/qingjoin/p/3638915.html Unity 3D 简单工程的创建.与Xcode 导出到iOS 平台请看这 Unity3D 学习创 ...
ios 请求失败封装_vue_axios请求封装、异常拦截统一处理
1.前端网络请求封装.异常统一处理 vue中采用axios处理网络请求,避免请求接口重复代码,以及各种网络情况造成的异常情况的判断,采用axios请求封装和异常拦截操作: axios 请求封装 // ...
iOS 用runtime封装字典转模型
封装字典转模型: 只需传入model名和json数组,用runtime动态的为每个属性赋值,导入头文件objc/runtime,首先,记录model类中的成员变量数,然后class_copyprope ...

WebClip完成IOS的Wap封装

背景

步骤

生成WebClip

解决WebClip自动跳转Safari问题

WebClip完成IOS的Wap封装相关推荐

最新文章

热门文章