Laravel 8中Google reCAPTCHA v3内联脚本正常写入Laravel Mix的app.js失效

Laravel Mix 默认会对编译的JS代码做作用域隔离，所有写在resources/js/app.js里的代码都会被包裹在独立的立即执行函数（IIFE）中，你声明的onSubmit函数属于局部作用域变量，不会暴露到全局window对象下。而Google reCAPTCHA v3的data-callback属性只能读取全局作用域下的回调函数，找不到对应函数时就会静默失效，不会抛出错误。

最简便的修改方式是手动把回调函数挂载到全局window对象上，修改resources/js/app.js中的代码如下：

require('./bootstrap');
// ... 其他原有代码

// 将onSubmit挂载到window成为全局函数
window.onSubmit = function(token) {
    document.getElementById("recaptcha-form").submit();
}

修改完成后重新执行npm run dev编译代码，硬刷新页面清除缓存即可恢复正常功能。

如果不想暴露全局函数，也可以改用grecaptcha.execute手动触发reCAPTCHA校验的方式，不用data-callback属性绑定回调，对于当前场景，挂载全局函数是适配成本最低的方案。

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