React调用WordPress REST API时Thunder Client请求403问题排查

WordPress REST API返回rest_cookie_invalid_nonce错误，核心是工具请求缺少有效的身份验证信息，以下是Thunder Client的具体配置方案：

方案一：使用WordPress会话nonce + Cookie验证（和后台请求逻辑一致） #

1. 获取有效nonce值 #

• 登录WordPress后台，打开浏览器控制台（F12），执行以下代码并复制返回的字符串：

  wpApiSettings.nonce
  

• 或者直接查看后台页面源码，搜索wpApiSettings，提取其中的nonce字段值。

2. 在Thunder Client中配置请求参数 #

• 请求头配置：添加X-WP-Nonce头，值为刚才复制的nonce字符串。
• Cookie配置：
  1. 在浏览器开发者工具的「应用」->「Cookie」面板，找到WordPress站点的登录相关Cookie（通常包含wordpress_logged_in_xxx、wordpress_sec_xxx前缀）。
  2. 把这些Cookie的键值对全部复制到Thunder Client的「Cookies」选项卡中。

方案二：使用Application Passwords（更适合工具长期调用） #

如果你的WordPress版本≥5.6，推荐用这种无需依赖会话的方式：

1. 创建应用密码 #

• 进入WordPress后台「用户」->「个人资料」，拉到页面底部找到「Application Passwords」。
• 输入应用名称（比如「Thunder Client」），点击「添加新应用密码」，复制生成的密码（仅显示一次，务必保存）。

2. 在Thunder Client中配置认证 #

• 打开请求的「Auth」选项卡，选择「Basic Auth」类型。
• 用户名填你的WordPress登录用户名，密码填刚才生成的应用密码。

注意事项 #

• 确保请求URL是正确的REST API路径，比如https://你的站点域名/wp-json/wp/v2/posts。
• 方案一中的nonce有有效期，过期后需要重新获取新值。
• Thunder Client作为本地工具，不受浏览器CORS限制，你已配置的跨域规则无需调整。

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