在WWDC17上,苹果发布了iOS11,其中带来了App密码填充的这一新的API。这一功能的实现能够让用户更方便的管理密码,更容易在我们的应用上登录。

WWDC17相关视频地址:Introducing Password AutoFill for Apps

注意:要实现此功能,我们的网站需支持Https协议。

效果图

GitHub:Autofill-Demo

IMG_D238F4B07DA7-1.jpeg

当需要用户填充用户名和密码时,在键盘的QuickType Bar(快速输入条)会给出候选的用户名与密码。

App的设置

  1. 设置 TextField 的 ContentType

在iOS11中,TextContentType新增加了UsernamePassword类型,我们只需要将相应的TextField设置为对应的ContentType即可。

屏幕快照 2017-06-29 15.10.14.png

屏幕快照 2017-06-29 15.07.59.png

这时候,用户已经可以在输入用户名与密码时,通过点击QuickType bar右侧的钥匙串按钮,在所有的保存的密码中选择要输入的用户名和密码了。

IMG_D238F4B07DA7-2.jpeg

但是,这样还不是很方便,如果用户保存的密码很多,需要在列表中查找也并不很方便。我们需要在QuickType的候选区列出用户曾经在我们的网站保存过的密码,就像效果图那样。

  1. 设置Associated Domains

屏幕快照 2017-06-29 15.29.38.png

webcredentials后填写我们网站的Domain,即我们要关联的域名。

登录Apple开发者网站,

屏幕快照 2017-06-29 15.34.20.png

屏幕快照 2017-06-29 15.35.04.png

屏幕快照 2017-06-29 15.35.30.png

确认Associated Domains已经启用。同时,我们要记录一下当前应用的Prefix,后面会用到。

网站的设置

新建文件,内容如下:

{
    "webcredentials":{
        "apps":["${Prefix}.com.zlucy.Autofill-Demo"] //${Prefix}处填写我们上面记录下来的Prefix,后加上需关联的应用的 Bundle ID
    }
}

保存文件,命名为apple-app-site-association

我们需要在我们要关联的网站上添加这个文件,路径如下:

https://www.zlucy.com/.well-known/apple-app-site-association
https://www.zlucy.com/apple-app-site-association

网站设置完成。

再次运行我们的App,App会在启动时访问如上的地址进行验证,验证通过后,就可以看到如效果图一样的功能了。

验证时可能会出现错误:

Request for 'https://www.zlucy.com/apple-app-site-association' denied: 404/0x194 Not Found

我们可以通过浏览器访问上面的地址,检查此文件是否可以正常访问。

标签: WWDC, autofill, APP, Password, iOS 11, API, 密码填充

仅有一条评论

  1. 路人乙 路人乙

    ٩(ˊᗜˋ*)و

添加新评论