可以在elm

Question

我想在elm（版本0.18）中为我的网站添加联系表单。 为了防止机器人滥用垃圾邮件我正在考虑在其中集成验证码验证插件，特别是谷歌隐形reCaptcha，或稍微older版本，你必须点击＆＃34;我不是机器人＆＃34 ;

根据我对documentation的理解，为了使用这些，我要么在表单提交按钮中添加一些属性，要么从javascript方法调用它。

问题是因为我使用elm Http模块来处理应用程序中的表单  我没有type="submit"属性的按钮，我也不知道如何从我的榆树代码中调用google插件API。

这可能吗？或者这是其他任何方法elm更友好吗？

Answer 1

在Elm中添加属性实际上很容易。看看Html.Attributes.attribute。要获得基本的提交按钮，请执行以下操作：

button [ attribute "type" "submit" ] [ text "Submit!" ]

特别关注谷歌reCaptcha ......我现在没有能力真正玩谷歌的api，但我相信你应该能够制作一个port来充当{ {1}}字段的值。接下来基本上是空闲的推测，因为我是在移动，所以把它带上一粒盐......

声明一个合适的端口（非常确定回调只是传递了一个字符串，但也许你需要改变它）：

data-callback

添加一个带有谷歌必需属性的按钮，包括新创建的端口的发送功能：

port captcha_port : ( String -> Msg ) -> Sub Msg

在button [ attribute "class" "g-recaptcha" , attribute "data-sitekey" "your_site_key" , attribute "data-callback" "app.ports.captcha_port.send" ] [ text "Sumbit All The Things!" ] 函数的某处订阅适当Msg类型的端口：

subscriptions

Answer 2

看起来您可能需要对reCAPTCHA使用显式渲染（请参阅https://developers.google.com/recaptcha/docs/display#explicit_render）

我在https://ellie-app.com/SyRXChQbYqa1/1

处设置了一个基本示例