NextJS调用HaveIBeenPwned API出现401错误，付费密钥有效仍报错

云上老周

2026-8-9

问题描述

我使用了已付费的有效API密钥，但在NextJS中调用HaveIBeenPwned的breachedaccount接口时持续返回401错误。我的实现代码如下：

const checkCompromised = async (email: string) => {
    const secret = process.env.NEXT_PUBLIC_HAVEIBEENPWNED_API_KEY;
    const url = `https://haveibeenpwned.com/api/v3/breachedaccount/${email}`;
    const response = await fetch(url, {
      method: "GET",
      mode: "no-cors",
      headers: {
        "hibp-api-key": `${secret}`,
        "User-Agent": "test",
      },
    });
    const data = await response.text();
    setCompromisedList(data);
  };

我认为已严格遵循官方文档的要求，请问有使用过该API的开发者能提供排查思路吗？

排查思路

移除mode: "no-cors"配置：当设置为no-cors时，浏览器会强制限制自定义请求头的发送，你的hibp-api-key根本不会被传递到HIBP服务器，这是导致401的核心原因。HIBP API原生支持CORS，完全不需要这个配置。
验证API密钥有效性：
- 确认密钥无拼写错误，HIBP的API密钥区分大小写
- 检查密钥是否为付费版有效密钥，免费密钥无法调用breachedaccount接口
- 登录HIBP后台查看密钥状态，确认未被禁用、未超出调用限额
修复环境变量配置：
- 先临时通过console.log(secret)验证NEXT_PUBLIC_HAVEIBEENPWNED_API_KEY是否正确加载（测试后务必删除，避免密钥泄露）
- 注意：NEXT_PUBLIC_前缀的变量会暴露给客户端，HIBP API密钥绝对不能放在客户端环境变量里！建议把请求逻辑移到NextJS的API路由（pages/api或app/api目录）中，用不带NEXT_PUBLIC_前缀的环境变量存储密钥，通过客户端调用自己的API路由间接请求HIBP
规范User-Agent头：官方要求必须提供User-Agent，但"test"过于模糊，建议使用更具体的标识，比如你的应用名称或联系邮箱，避免被服务器判定为恶意请求
直接测试API请求：
- 用Postman或curl直接调用接口，带上正确的请求头，确认请求本身是否正常
- 示例curl命令：
```
curl -H "hibp-api-key: YOUR_API_KEY" -H "User-Agent: YourAppName" https://haveibeenpwned.com/api/v3/breachedaccount/test@example.com
```
检查URL编码：如果邮箱包含+、@等特殊字符，需要先对邮箱进行URL编码再拼接到请求地址中，避免路径解析错误

内容的提问来源于stack exchange，提问作者geraldOfRiviera