QQ邮箱头像获取演示

1. 输入捕获

用户输入邮箱地址后，系统通过事件监听器捕获输入内容。

const email = document.getElementById('emailInput').value.trim();

2. 邮箱验证与切割

使用正则表达式验证邮箱格式，并提取域名和用户名部分。

const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
if (emailRegex.test(email)) {
  const [username, domain] = email.split('@');
}

3. QQ邮箱识别

检测是否为QQ邮箱（@qq.com或@foxmail.com），并验证QQ号格式。

if (domain === 'qq.com' || domain === 'foxmail.com') {
  // 放宽QQ号验证，允许包含字母的QQ邮箱
  if (username.length >= 5 && username.length <= 11) {
    return { type: 'qq', email, qq: username };
  }
}

4. 头像链接拼接

根据检测结果生成对应的头像链接：

• QQ头像：使用QQ官方接口 https://q1.qlogo.cn/g?b=qq&nk=QQ号&s=尺寸
• 默认头像：使用UI Avatars服务生成 https://ui-avatars.com/api/?name=用户名&size=640

// QQ头像链接生成
function generateQQAvatarLinks(qqNumber) {
  return `https://q1.qlogo.cn/g?b=qq&nk=${qqNumber}&s=640`;
}

// 默认头像链接生成
function generateDefaultAvatar(email) {
  const username = email.split('@')[0];
  return `https://ui-avatars.com/api/?name=${username}&size=640`;
}

5. 结果展示

将生成的链接以文本形式显示，并提供预览功能。

// 设置链接文本
document.getElementById('link640').textContent = avatarUrl;
// 设置预览按钮
document.getElementById('previewBtn').href = avatarUrl;