无需登录 数据私有 本地保存

Contact Picker API 属性选择器 - 获取联系人信息

10
0
0
0

Contact Picker API 联系人选择器

安全地从设备联系人中选择并获取姓名、电话、邮箱、地址等信息

正在检测 Contact Picker API 支持情况...
选择要获取的属性

点击标签选择需要获取的联系人信息字段(至少选一项)

姓名
邮箱
电话
地址
头像
允许多选

一次选择多个联系人

联系人信息

配置属性后点击"选择联系人"按钮

选择结果将在此展示

关于 Contact Picker API
隐私安全

用户必须明确选择联系人,网站无法静默读取通讯录。每次选择都需要用户手动确认,确保隐私不被侵犯。

支持平台

目前主要在Chrome for Android上可用(v80+),需要HTTPS安全上下文。桌面端和iOS暂不支持。

用户手势

API调用必须由用户手势触发(如点击按钮),防止自动弹出选择器干扰用户体验。

属性按需获取

开发者只能获取明确请求的属性字段(name, email, tel, address, icon),最小化数据访问原则。

常见问题 (FAQ)
什么是 Contact Picker API?

Contact Picker API 是一个现代的Web API,允许Web应用请求用户从设备通讯录中选择联系人,并获取用户明确授权的联系人信息(如姓名、电话号码、邮箱、地址等)。与传统的全量通讯录访问不同,该API采用"用户选择即授权"的模式,每次都需要用户主动选择具体联系人,极大地保护了用户隐私。

Contact Picker API 可以获取哪些信息?

Contact Picker API 支持获取以下五种属性:name(姓名,含名、姓、显示名等)、email(邮箱地址列表)、tel(电话号码列表)、address(邮寄地址,含国家、城市、街道等详细字段)、icon(联系人头像图片的Blob对象)。开发者需要在调用时明确指定需要哪些属性。

哪些浏览器支持 Contact Picker API?

目前Contact Picker API主要在Chrome for Android 80+版本上得到支持。桌面端Chrome、Firefox、Safari和Edge等浏览器尚未实现该API。此外,该API要求页面在HTTPS安全上下文中运行。您可以使用本工具顶部的状态检测来确认当前浏览器是否支持。

Contact Picker API 安全吗?隐私如何保护?

非常安全。Contact Picker API的设计核心就是隐私优先:1) 每次调用必须由用户手势触发(如点击按钮);2) 用户明确选择要共享的联系人,网站无法静默读取通讯录;3) 只能获取开发者预先声明的属性字段;4) 不需要任何预先权限授予,选择即授权;5) 仅在HTTPS安全上下文中可用,防止中间人攻击。

如何在我的Web应用中使用 Contact Picker API?

使用方式很简单:
const contacts = await navigator.contacts.select(['name', 'email', 'tel'], { multiple: true });
第一个参数是需要的属性数组,第二个参数可设置是否多选。返回的contacts是一个ContactInfo对象数组,每个对象包含所请求的属性。注意必须在HTTPS环境下,且由用户手势触发调用。

为什么我的浏览器无法使用 Contact Picker API?

可能的原因包括:1) 浏览器不支持该API(目前仅Chrome for Android 80+支持);2) 页面未使用HTTPS(非安全上下文);3) 用户拒绝了联系人选择;4) 设备上没有联系人数据。您可以在Chrome for Android上访问此页面来体验完整功能。