Imm*_*ble 3 javascript google-apps-script svelte-3
所以我对 svelte 和 google Recaptcha API 有疑问。
\n\n我的主要 HTML 文件
\n\n<!DOCTYPE html>\n<html lang="en">\n<head>\n <meta charset=\'utf-8\'>\n <meta name=\'viewport\' content=\'width=device-width,initial-scale=1\'>\n\n <title>Svelte app</title>\n\n <link rel=\'icon\' type=\'image/png\' href=\'/favicon.png\'>\n <link rel=\'stylesheet\' href=\'/global.css\'>\n <link rel=\'stylesheet\' href=\'/build/bundle.css\'>\n <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css">\n <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Bitter:400,700">\n <link rel="stylesheet" href="/css/styles.min.css">\n\n <script defer src=\'/build/bundle.js\'></script>\n <script src="https://www.google.com/recaptcha/api.js" async defer></script>\n <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>\n <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.bundle.min.js"></script>\n <script src="https://cdn.jsdelivr.net/npm/sweetalert2@9"></script>\n</head>\n\n<body>\n</body>\n</html>\n我的 main.svelte
\n\n<script>\n import swal from "sweetalert";\n\n function verifyUser() {\n swal({\n title: "Please wait a minute!",\n text: "Do not close or exit this tab, we are currently verifying you...",\n icon: "info",\n backdrop: `rgba(0,0,0,1)`,\n showConfirmButton: false,\n allowOutsideClick: false,\n allowEscapeKey: false\n });\n }\n</script>\n\n<div>\n <div class="header-dark">\n <nav class="navbar navbar-dark navbar-expand-lg navigation-clean-search">\n <div class="container">\n <a class="navbar-brand" href="/">QSP Human Verification Module</a>\n <button class="navbar-toggler" data-toggle="collapse">\n <span class="sr-only">Toggle navigation</span>\n <span class="navbar-toggler-icon" />\n </button>\n </div>\n </nav>\n <div class="container hero">\n <div class="row">\n <div class="col-md-8 offset-md-2">\n <h1 class="text-center">\n Please complete the Captcha challenge to continue to the server.\n </h1>\n\n <form action="" method="post">\n\n <div\n class="g-recaptcha"\n data-sitekey="key"\n data-callback={verifyUser}\n />\n </form>\n\n </div>\n </div>\n </div>\n </div>\n</div>\n问题是该函数只是变成了它自己的字符串，并且无法仅使用"verifyUser" orverifyUser()来执行returnsReCAPTCHA 无法找到用户提供的函数：verifyUser`
使用{verifyUser}成为字符串（更多信息https://prnt.sc/qhyc2w）
像这样执行返回：
\n\nReCAPTCHA couldn\'t find user-provided function: function verifyUser() {\n swal({\n title: "Please wait a minute!",\n text: "Do not close or exit this tab, we are currently verifying you...",\n icon: "info",\n backdrop: `rgba(0,0,0,1)`,\n showConfirmButton: false,\n allowOutsideClick: false,\n allowEscapeKey: false\n });\n }\n汇总配置
\n\n<script>\n import swal from "sweetalert";\n\n function verifyUser() {\n swal({\n title: "Please wait a minute!",\n text: "Do not close or exit this tab, we are currently verifying you...",\n icon: "info",\n backdrop: `rgba(0,0,0,1)`,\n showConfirmButton: false,\n allowOutsideClick: false,\n allowEscapeKey: false\n });\n }\n</script>\n\n<div>\n <div class="header-dark">\n <nav class="navbar navbar-dark navbar-expand-lg navigation-clean-search">\n <div class="container">\n <a class="navbar-brand" href="/">QSP Human Verification Module</a>\n <button class="navbar-toggler" data-toggle="collapse">\n <span class="sr-only">Toggle navigation</span>\n <span class="navbar-toggler-icon" />\n </button>\n </div>\n </nav>\n <div class="container hero">\n <div class="row">\n <div class="col-md-8 offset-md-2">\n <h1 class="text-center">\n Please complete the Captcha challenge to continue to the server.\n </h1>\n\n <form action="" method="post">\n\n <div\n class="g-recaptcha"\n data-sitekey="key"\n data-callback={verifyUser}\n />\n </form>\n\n </div>\n </div>\n </div>\n </div>\n</div>\n如何正确传递该函数？
\n我是 Rour——来自不和谐的人。我想在这里为其他人分享解决方案。
<script>
import { onMount, onDestroy } from 'svelte';
function verifyUser() {/* your fun here */}
onMount(() => {
window.verifyUser = verifyUser;
})
onDestroy(() => {
window.verifyUser = null;
})
</script>
<!-- then pass the name of function 'verifyUser' just as string' -->
<div class="g-recaptcha" data-sitekey="key" data-callback="verifyUser" />
认为data-callback是搜索全局函数的名称，因此我们通过将其分配给变量verifyUser来在浏览器中定义为全局函数window