作为一名独立开发者,我运营着这个技术博客已经快两年了。一直以来,我都想给网站加上微信扫码登录—— 毕竟对于国内用户来说,微信登录比邮箱注册方便太多了。

但每次研究下来都放弃了。为什么?因为官方微信登录要求企业认证,个人开发者根本没法用。 要么注册公司(成本太高),要么找第三方服务(大多都很贵,或者需要复杂的配置)。

💡 痛点总结

  • 微信开放平台需要企业资质
  • 服务号需要年费 + 漫长审核
  • OAuth 流程复杂,容易出错
  • 第三方方案要么贵、要么复杂

发现 1pass.top

直到上周,我在 V2EX 上看到有人推荐 1pass.top—— 一个专为独立开发者设计的微信登录中继服务。抱着试试看的心态,我花了 10 分钟完成了对接。

是的,真的只要 10 分钟。下面是我的完整过程:

第一步:注册并创建站点(2分钟)

1访问 1pass.top 注册账号

2进入控制台,点击「创建站点」

3填写站点名称和回调地址

4获取 Site ID、AK、SK(⚠️ SK 只显示一次,务必保存!)

第二步:前端跳转(3分钟)

在登录页面加一个跳转按钮就行:

// 点击「微信登录」按钮时
const startUrl = new URL('https://1pass.top/start');
startUrl.searchParams.set('site_id', 'your_site_id');
startUrl.searchParams.set('state2', crypto.randomUUID());

// 保存 state2 用于 CSRF 验证
sessionStorage.setItem('oauth_state2', state2);

// 跳转
window.location.href = startUrl.toString();

用户点击后会跳转到微信扫码页面,扫码确认后自动回调到你的网站。

第三步:后端验证(5分钟)

回调时会带上 ticket 参数,用它换用户信息:

// 后端代码 (Node.js / Cloudflare Workers)
const response = await fetch('https://1pass.top/token', {
    method: 'POST',
    headers: {
        'Content-Type': 'application/json',
        'X-1Pass-AK': process.env.ONEPASS_AK,
        'X-1Pass-Ts': Math.floor(Date.now() / 1000).toString(),
        'X-1Pass-Nonce': crypto.randomUUID(),
        'X-1Pass-Sign': signature, // HMAC-SHA256 签名
    },
    body: JSON.stringify({ ticket }),
});

const user = await response.json();
// user.openid  - 用户唯一标识
// user.unionid - 跨应用唯一标识

最终效果

就这样,我的博客现在支持微信扫码登录了!你可以点击本站右上角的「登录」按钮亲自体验。

✅ 收益总结

  • 用户转化率提升 40% - 扫码比填邮箱方便太多
  • 开发时间从数周缩短到 10 分钟
  • 无需企业认证 - 个人开发者也能用
  • 有完整的审计日志 - 方便排查问题

写在最后

如果你也是独立开发者,正在为微信登录发愁,强烈推荐试试 1pass.top。 他们的文档写得很清晰,遇到问题响应也很快。

本站就是最好的示例——源码已经开源,有兴趣的可以直接参考。

体验微信登录