如何开发以NFC标籤启动的App Clip
App Clip(轻巧App)和NFC标籤是商家与客户互动的一种新方式,让使用者在手机的作业系统上执行小应用程式,无需到App Store下载安装软体。...
现今商家与客户互动有了一种新的方式 — App Clip(轻巧App)和NFC标籤。这个功能让使用者可以在手机的作业系统上执行小应用程式(small app),而无需到App Store下载安装软体。
小程式只在萤幕上弹出资讯,此功能为开发新客户关系创造了机会。例如,咖啡厅可以提供更实用的积分卡,零售商可以让虚拟钱包更好用。商家可以透过多种方式触发启动小程式,其中一种是指向某一个URL位址的NFC标籤。当使用者的iPhone靠近标籤时,手机将会自动发现URL并启动小程式。原理很简单,同时成本也低廉。文中将分享商店使用小程式都需要具备什么条件。
App Clip是什么?
App Clip被称为「轻量版的手机应用软体」。这种小软体压缩到低于10 MB的大小,主要提供应用程式的一小部分功能。例如一家咖啡公司的完整App可以提供咖啡店的名录、近期促销活动、销量排行以及积分卡,但App Clip小程式只会显示积分卡。这些功能确保使用者能获得即时体验,即使手机行动网速很低的状况下,使用者也能得到即时体验。只要透过手机靠近NFC标籤启动小程式,就可以减少很多使用障碍,为不太熟悉手机应用的新客户打开了数位互动的大门。
以下来看ST的iOS应用开发者Vincent Latorre的小程式研发歷程:
App Clip:用户端或NFC配置
准备ST25-TAG-BAG-U套件
![]()
|
在整个配置过程中,最容易的步骤即是建立一个NFC标籤,在标籤内写入进入小程式的URL。这个过程非常简单,简单到建立一个正常执行的demo软体,连一行程式码都不需编写。出于示范目的,将使用两个ST25TV02K NFC标籤,其中一个用于存放小程式的URL位址,另一个将用作概念验证,来为在作业系统中存储的或缓存的功能容器做说明。
如果想开发一个以App Clip小程式为主的范例,不需要第二个标籤,开发者可以只使用第一个标籤。但是,想藉此机会让大家了解如何读写储存区块,并提供具体证据证明ST的小程式确实可以执行,而不只是一个单纯的展示页面。这两个标籤都是ST25-TAG-BAG-U套件中的小圆标籤。使用者必须到应用商店下载ST 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. 输入www.myst25.com/clip。请务必选择「https」,否则小程式将不会立即显示。
3. 按点击「Validate」,然后编写标籤
瞭解功能容器
第二个ST25TV02K是测试标籤,透过它可以瞭解Type-5标籤中NDEF支援功能。这证明ST的小程式正在读取标籤,而不是在展示一个手机萤幕。为了增加示范的趣味性,我们在第一个储存区块中编写一个有效的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配合使用,并可以用Apple帐号登入软体。这个新系统还受益于一个特殊的通知和地理位置定位系统。此外,一个iOS软体可以有多个App Clip。在Xcode中,开发人员应注意Signing & Capabilities 选项卡,并记住团队名称和绑定的标识。
下一步是使用App Store Connect Web介面建立App Clip小程式。在此处,开发人员将上传图片,该图片将显示在iOS文字框上,吸引使用者启动小程式。点击「Advanced App Clip Experience 」后将开启一个新功能表,设置指向小程式的URL位址。此外,开发人员还可以要求作业系统检查行动装置的地理位置,商家可以选择使用此功能将小程式与商店或特定地点关联。
伺服器端
Web伺服器配置非常简单。 在Xcode和App Store Connect内定义的URL中,例如www.myst25.com/clip,必须有一个index.html 档,而且其原标记必须包含应用程式ID和小程式绑定的ID。如下图二所示,档案正文可以是空白的,最重要的地方是原标记本身。
|
档案名为 apple-app-site-association的档案是在网路服务器的根资料夹(例如/ www)中必须存在的第二个重要文件。该档案仅列出下列的阵列(图三):
|
欲瞭解更多关于App Clip,请造访:https://developer.apple.com/documentation/app_clips
关于小型NFC标籤,请浏览:https://www.st.com/en/evaluation-tools/st25-tag-bag-u.html