WordPress联系表单对接Laravel接口报错问题求助

看起来你遇到的是Laravel的CSRF（跨站请求伪造）验证导致的错误，根源在于你手动生成的_token并不是Laravel会话中认可的有效令牌。让我一步步帮你解决这个问题：

问题原因 #

Laravel默认会对所有POST请求进行CSRF验证，它要求请求中的_token值必须和当前用户会话中存储的令牌完全匹配。你在WordPress里用openssl_random_pseudo_bytes生成的随机字符串，和Laravel会话里的令牌没有关联，所以Laravel会判定请求无效，返回"The page has expired due to inactivity"的错误。

解决方案 #

根据你的需求，有两种可行的方案：

方案1：对目标路由豁免CSRF验证（简单快捷）

如果你不需要对这个联系表单路由做CSRF保护（可以通过验证码、表单字段验证等其他方式防止恶意提交），可以直接在Laravel中把该路由排除在CSRF验证之外：

1. 打开Laravel项目中的app/Http/Middleware/VerifyCsrfToken.php文件
2. 在$except数组里添加你的联系表单路由：

   protected $except = [
       '/yocreativ/contact-us',
   ];
   

3. 保存文件后，重新提交表单就不会再出现过期错误了。

方案2：获取Laravel的有效CSRF令牌（更安全）

如果想要保留CSRF保护，需要让WordPress页面获取到Laravel生成的有效令牌，步骤如下：

1. 在Laravel中添加获取令牌的接口
   在Laravel的routes/web.php（或routes/api.php）中添加一个路由，用于返回当前会话的CSRF令牌：

   Route::get('/get-csrf-token', function () {
       return response()->json(['csrf_token' => csrf_token()]);
   });
   

2. 在WordPress表单中动态填充令牌
   修改你WordPress里的表单代码，移除手动生成令牌的PHP代码，然后添加一段JavaScript来请求上面的接口，获取并填充令牌：
   首先把表单里的_token输入框改成空值：

   <input type="hidden" name="_token" value="">
   

   然后在页面底部添加这段JS代码（记得把https://your-laravel-domain.com换成你的Laravel应用域名）：

   document.addEventListener('DOMContentLoaded', function() {
       fetch('https://your-laravel-domain.com/get-csrf-token')
           .then(response => response.json())
           .then(data => {
               document.querySelector('input[name="_token"]').value = data.csrf_token;
           })
           .catch(error => console.error('获取CSRF令牌失败:', error));
   });
   

3. 配置Laravel允许跨域请求
   因为WordPress和Laravel是两个独立应用，需要让Laravel允许WordPress域名的跨域请求。可以安装barryvdh/laravel-cors包，然后在配置文件中添加你的WordPress域名到允许列表中。

总结 #

• 方案1适合快速解决问题，适合信任的环境或已经有其他防护措施的情况
• 方案2更安全，符合Laravel的安全规范，但需要额外的配置工作

你可以根据自己的实际情况选择合适的方案。

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