Uniapp Android/IOS 获取手机通讯录

介绍

最近忙着开发支付宝小程序和app，下面给大家介绍一下 app 获取通讯录的全部过程吧，也是这也是我app开发中的一项需求吧。

效果图如下

勾选配置文件

使用uniapp开发的童鞋都知道有一个配置文件 manifest.json 简单的说一下，就是安卓/ios/小程序中一些基础的配置文件，你可以配置应用的图标及权限等等。

记住这个是一定要勾选的，不然你点击获取通讯录时，是会报错误的提示的，博主已踩过坑了

填写配置文件

说到配置文件，我们获取用户的通讯录就得使用到权限配置

Android部分

<uses-permission android:name="android.permission.GET_ACCOUNTS"/>
<uses-permission android:name="android.permission.WRITE_CONTACTS"/>
<uses-permission android:name="android.permission.READ_CONTACTS"/>

IOS部分

翻到下面会有通讯录相关的配置，这里你们自己看着写

源码视图配置

这里就不多讲了，直接上配置文件

"app-plus": {
	 /* 应用发布信息 */
        "distribute" : {
            /* android打包配置 */
            "android" : {
                "permissions" : [
                	 // 联系人
                    "<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
                    "<uses-permission android:name=\"android.permission.WRITE_CONTACTS\"/>",
                    "<uses-permission android:name=\"android.permission.READ_CONTACTS\"/>"
                ],
            },
			 /* ios打包配置 */
            "ios" : {
            "privacyDescription" : {
                    "NSContactsUsageDescription" : "我们需要访问您的通讯录以便为您提供联系人相关的服务。",
                }
			}
}

好了，以上基础的已经配置好了

获取通讯录部分

话不多讲，直接上代码

界面结构部分

<template>
	<view class="contacts_box">
		<view @click="getContacts" class="contacts_title">
			获取联系人信息
		</view>
		<view v-for="(item,index) in contact_list" :key='index' class="contacts_list_item">
			<view style="font-weight: 700;">
				联系人:{{item.displayName}}
			</view>
			<view>
				联系人电话:{{item.phoneNumbers[0].value}}
			</view>
		</view>
	</view>	
</template>

逻辑处理部分

<script>
	export default {
		data() {
			return {
				contact_list: [],
			}
		},
		methods: {
			getContacts() {
				const platform = uni.getSystemInfoSync().platform;
				if (platform === 'android') {
					plus.android.requestPermissions(
						['android.permission.READ_CONTACTS'],
						(resultObj) => {
							const result = resultObj.granted;
							if (result.indexOf('android.permission.READ_CONTACTS') !== -1) {
								this.getContactsHandle();
							} else {
								uni.showToast({
									title: '您拒绝了通讯录权限，请在设置中开启',
									icon: 'none'
								});
								uni.hideLoading();
							}
						},
						(error) => {
							console.log('请求权限失败: ' + JSON.stringify(error));
							uni.showModal({
								title: '权限请求失败',
								content: '应用需要读取通讯录权限才能为您提供更好的服务，请在设置中授予该权限。',
								showCancel: false
							});
							uni.hideLoading();
						}
					);
				} else if (platform === 'ios') {
					// 检查iOS权限状态
					this.getContactsHandle(); // iOS 直接调用
				}
			},

		getContactsHandle() {
				// 获取系统通讯录
				plus.contacts.getAddressBook(plus.contacts.ADDRESSBOOK_PHONE, (addressbook) => {
					// 查找联系人
					addressbook.find(["displayName", "phoneNumbers"], (contacts) => {
						// 增加错误处理和数据验证
						let newArrary = contacts
							.filter(item => {
								return item.phoneNumbers && item.phoneNumbers.length > 0;
							})
							.map(item => {
								try {
									return {
										id: item.id || 'unknown',
										relation: '其他',
										name: item.displayName || '未知名称',
										mobile: item.phoneNumbers[0].value
									};
								} catch (error) {
									console.error('处理联系人数据时出错:', error);
									return null;
								}
							})
							.filter(item => item !== null); // 过滤掉处理失败的项
						this.contactFlag = true
						this.contact_list = newArrary;
						uni.hideLoading()
					}, (e) => {
						console.log('查找联系人失败: ' + e.message);
						uni.hideLoading()
						this.handleContactError(e)
					});
				}, (e) => {
					console.log('获取通讯录失败: ' + e.message);
					uni.hideLoading()
					this.handleContactError(e)
				});
			},

			// 统一处理错误
			handleContactError(e) {
				if (e.code === 20) {
					uni.showToast({
						title: '您拒绝了通讯录权限，请在设置中开启',
						icon: 'none'
					});
				} else {
					uni.showToast({
						title: '获取通讯录失败: ' + e.message,
						icon: 'none'
					});
				}
			},
		}
	}
</script>

注意事项

特别提醒！！！

特别提醒！！！

特别提醒！！！

如果你要使用通讯录功能的话，一定记得完善信息，不然不会让你打包的 下面就是我实名的情况。
实名地址 ： https://dev.dcloud.net.cn/pages/user/info

完结！！！

撒花 🎉🎉🎉

撒花 🎉🎉🎉

撒花 🎉🎉🎉