recaptcha 与 ionic 应用程序的集成

Question

我已经阅读了许多与将 google recaptcha 与 ionic 混合应用程序集成相关的帖子，但我没有找到任何解决方案。我有以下关于在离子应用程序中使用 g-recaptcha 的问题：

1. 我可以在 ionic 应用程序中使用 google recaptcha 吗？
2. 如果我使用了 recaptcha 那么我在“ https://www.google.com/recaptcha/admin ”中的域名是什么？

我用域名“localhost”尝试过它，它在浏览器中工作，但在移动设备上不工作。移动设备中的错误是“站点所有者错误：站点密钥的域无效”。

然后我尝试为cordova / ionic应用程序注册一个新的reCAPTCHA，并在其中添加了我的应用程序包名称。然后我选择了“reCAPTCHA Android”并在cordova/ionic中使用了一个新的公钥（站点密钥），但在手机中测试时也出现了同样的错误。任何解决方案？

Answer 1

差不多 5 年过去了，但这是可行的解决方案。\n警告：您可能会破坏一些在 Android / iO 上期望主机名是 localhost 的 api。

\n

问题：运行时的移动应用程序主机名是“localhost”。使用 ionic 时，每个平台的主机名可能不同。

\n

解决方案：

\n

使用cordova：（我不知道为什么你会在2023年使用cordova..）检查来自@Fr\xc3\xa9d\xc3\xa9ricCamblor的这个答案

\n

带电容器：

\n

\n
1. 转至https://www.google.com/recaptcha/admin并在您的网站允许的域下注册自定义域。
\n
2. 如果您还没有初始化项目中的电容器（使用 CLI）。
\n
3. 在capactor.config.json中添加以下配置
\n

\n

\n

"server": {\n  "hostname": "yourapp.example.local",\n  "allowNavigation":["https://www.google.com/recaptcha/",\n"http://yourapp.example.local/*"]\n}\n

\n

\n

您可以检查完整的电容器配置架构

\n

\n
4. 作为额外的步骤，我添加了@awesome-cordova-plugins/ionic-webview wrapper尽管 idk if 是必需的，但这就是我使其工作的方式。
\n

\n