技术详解:如何开发一个iOS小程序并且通过NFC标签触发
2021-07-09
来源:意法半导体
现今,商家与客户互动有了一种新的方式 -- App Clip(苹果小程序)和NFC标签。这个功能让用户可以在手机操作系统上运行小程序,无需到应用商店下载安装软件。小程序只是在屏幕上弹出信息,此功能为开发新的客户关系创造了机会。例如,咖啡店可以提供更实用的积分卡,零售商可以让虚拟钱包更好用。商家可以通过多种方式触发小程序,其中一种是指向某一个URL地址的NFC标签。当用户iPhone靠近标签时,手机会自动发现URL并启动小程序。原理简单的同时成本也低廉。下面我们探讨一下商家使用小程序都需要些什么。
App Clip是什么?
App Clip 被称为“ 轻量版的手机应用软件”。这种小软件压缩前二进制代码量小于10 MB,并且主要提供应用程序的一小部分功能。例如,一家咖啡公司的完整应用可以提供咖啡店的名录、近期促销活动、销量排序以及积分卡,但App Clip小程序只会显示积分卡。这些功能确保用户获得即时体验,即使手机移动网速很低,用户也能获得实时体验。用户还能获得简便快捷的使用体验。通过手机靠近NFC标签启动小程序,可以减少很多使用障碍,为不太熟悉手机应用的新客户打开了数字互动的大门。下面来看一下ST的iOS应用开发者Vincent Latorre的小程序开发经验。
App Clip:客户端或NFC配置
1. 准备ST25-TAG-BAG-U套件
ST25-TAG-BAG-U 标签套件包含: 1. ST25TV02K, 2. ST25TA02KB, 3. ST25TV02K HC, 4. ST25TV512, 5. ST25TA64K
在整个配置过程中,最容易的环节是创建一个NFC标签,在标签内写入指向小程序的URL。这个过程非常简单,简单到创建一个正常工作的演示软件,连一行代码都不用写。出于演示目的,我们将使用两个ST25TV02K NFC标签,其中一个用于存放小程序的URL地址,另一个将用作概念验证,讲解可以在操作系统中存储的或缓存的功能容器。
如果想开发一个以App Clip小程序为主的演示,第二个标签是不需要的,开发者可以只用第一个标签。但是,我们想借此机会讲解演示如何写存储区块,并提供具体证据证明ST的小程序确实在工作,而不是给大家看一个展示的屏幕。这两个标签都是ST25-TAG-BAG-U 套件中的小圆标签。用户必须到应用商店下载我们的NFC Tap应用,才能读写标签。
写URL
我们拿出第一个ST25TV02K标签。以下演示假设标签是空白标签。第一步是在主屏上选择Read Tag,然后将手机靠近标签,屏幕上将出现ST25TV02K的信息。下一步,点击屏幕右下方的…图标 ,然后选择Areas Content Editor选项,最后,用手机扫描标签。如果是空白标签,则会出现一个对话框,显示存储器大小(例如256字节),并提示No NDEF message。
在写入一条NDEF消息前,用户需要点击提示No NDEF message的对话框,随后在屏幕上将出现一个白色方框和蓝色箭头。向左滑动白色方框,将会弹出一个菜单,其中包含Add、 Edit、Insert 和 Exec选项。在选择 Add后,
1.选择NdefUriRecord
2.输入<https://www.myst25.com/clip>。务必选择https,否则小程序将不会立即显示。
3.按Validate按钮,然后写标签
了解功能容器
第二个ST25TV02K是我们的测试标签,我们还可以通过它了解Type-5标签中NDEF支持功能。这个演示证明ST的小程序正在读取标签,而不是在展示一个手机屏幕。为了增加演示的趣味性,我们效仿我们关于NDEF管理的应用笔记中的方法。事实上,那篇文章讲解的是如何将ST25TV标签配置成支持NDEF消息的NFC Type-5标签,简而言之,就是在第一个存储块中写入一个有效的功能容器(CC)。那篇文章给用户详解了整个设置过程,我们可以在ST25TV02K的第一个存储块内直接写入四字节CC:E1 40 20 01h。
写测试标签
在执行写标签操作前,打开NFC Tap iOS应用,然后
1.选择Read Tag,然后扫描第二个ST25TV02K标签
2.检查CC File部分,确保标签是空白的。如果Magic Number是0x00,则表示标签内不含任何信息。
现在,我们激活NDEF消息传输支持功能,然后写入一小条消息。
1.选择屏幕底部的More ,然后选择Areas Content Editor。这时软件将会让你扫描标签,然后,发现一个256字节的可写区,里面没有内容。
2.点击Area 1
3.在屏幕上出现No NDEF Record的提示信息。向左滑动对话框,然后出现一个菜单,选择 Add。
4.点击NdefTextRecord,清除现有文本,然后输入Hello World!
5.按Validate按钮,然后将手机靠近标签,写入NDEF消息。
测试App Clip
只有当手机上没有安装完整的应用软件时,小程序才会弹出。因此,在扫描第一个有小程序URL地址的ST25TV02K标签前,如果安装了NFC Tap软件,必须删除软件。当手机检测到第一个标签时,就会在触屏上显示小程序卡片,询问用户是否要打开小程序或从应用商店下载应用。打开小程序后会显示一个精简版的NFC Tap应用软件,其中Read NDEF 是灰色不可用,但Read Tag 可用。选择读取标签选项,然后扫描第二个ST25TV02K标签,证明小程序读取我们的标签数据。向下滚动屏幕,我们看到Magic Number是 0xE1,证明小程序正在扫描我们刚才配置的标签。
后台或应用开发和Web服务器配置
Xcode项目
对于希望了解更多信息的开发人员,第一步是下载我们的iOS应用程序的源代码(STSW-ST25IOS001) 。工程师只需在Apple IDE开发环境中打开下载的文件,即可开始研究我们的实现方法。首先要注意的是,在应用程序中充当小程序的代码段是一个特定目标。为辅助开发者开发小程序,苹果提供了专用的App Clip模板,小程序可以与Apple Pay配合使用,并可以用苹果账号登录软件。这个新系统还得益于一个特殊的通知和地理位置定位系统。此外,一个iOS软件可以有多个App Clip。在Xcode中,开发人员应注意Signing & Capabilities 选项卡,并记住团队名称和捆绑标识。
下一步是使用App Store Connect Web界面创建App Clip小程序。在此处,开发人员将上传图片,该图片将显示在iOS卡片上,吸引用户启动小程序。点击Advanced App Clip Experience 将打开一个新菜单,设置指向小程序的URL地址。此外,开发人员还可以请求操作系统检查移动设备的地理位置,商家可以选择使用此功能将小程序与商铺或特定地点关联。
服务器端
Web服务器配置非常简单。 在Xcode和App Store Connect内定义的URL中,例如http://www.myst25.com/clip,必须有一个index.html 文件,而且其元标记必须包含应用程序ID和小程序捆绑ID。如下所示,文件正文可以是空白的,最重要的地方是元标记本身。
<html>
<head>
<meta name=“apple-itunes-app” content=“app-id=THEAPPID, app-clip-bundle-id=THEAPPBUNDLEID”>
</head>
<body>
</body>
</html>
文件名为 apple-app-site-association的文件是在网络服务器的根文件夹(例如/ www)中必须存在的第二个重要文件。该文件仅列出下面的数组:
“appclips” : {
“apps”: [“TEAM_NAME.BUNDLE_ID (e.g., UL3MK8FNMR.com.st.st25ncf.clip)”],
“paths”: [“DESTINATION (e.g., path/*)”]
}