<p>Not sure if it's a good call or not but you could have an endpoint that just has the <code>{{ craft.app.request.csrfToken }}</code> outputting on it. Poll(GET) that using ajax (axios or whatever you're using in your Vue app) and update your Vue model's csrf value with the response body? </p>

<p>Same for the honeypot value I guess although I'm not that familiar with freeform I take it there'll be a twig variable available for this.</p>

<p>I'm sure there's a nicer way to do this but this seems like it should work?</p>

CC BY-SA 4.0
2019-04-24T15:40:01.960Z
2019-04-24T15:40:01.960Z
billythekid
<p>Anyone using FreeForm and Vue together?
I have a form that is hidden away in a modal (that is then shown using Vue) via a click of a button. Vue is only used to hide the form and show the form. the form code is all in the page/template.</p>

<p>However, I am having issues with the form being marked as spam and the following error on FreeForm:</p>

<blockquote>
  <p>Form honeypot is invalid</p>
</blockquote>

<p>FreeForm support suggested that as it is Vue is used - I need to manually refresh the Craft CRSF token and Freeform JS Honeypot field.</p>

<p>I have no idea how to do this? Or where to start. If anyone has done similar or can help point me in the right direction?</p>

<plugin-freeform><freeform><csrf><vue>
FreeForm and Vue - Hidden Forms in Modal - Manually refresh the Craft CRSF token and Freeform JS Honeypot field
# FreeForm and Vue - Hidden Forms in Modal - Manually refresh the Craft CRSF token and Freeform JS Honeypot field

(Asked by: username_0 on 2019-04-24)

Anyone using FreeForm and Vue together?
I have a form that is hidden away in a modal (that is then shown using Vue) via a click of a button. Vue is only used to hide the form and show the form. the form code is all in the page/template.

However, I am having issues with the form being marked as spam and the following error on FreeForm:

> Form honeypot is invalid

FreeForm support suggested that as it is Vue is used - I need to manually refresh the Craft CRSF token and Freeform JS Honeypot field.

I have no idea how to do this? Or where to start. If anyone has done similar or can help point me in the right direction?

**Tags:** plugin-freeform, freeform, csrf, vue

---

## 1 answers

### Answer by username_1 on 2019-04-24. Score: 1

Not sure if it's a good call or not but you could have an endpoint that just has the `{{ craft.app.request.csrfToken }}` outputting on it. Poll(GET) that using ajax (axios or whatever you're using in your Vue app) and update your Vue model's csrf value with the response body?

Same for the honeypot value I guess although I'm not that familiar with freeform I take it there'll be a twig variable available for this.

I'm sure there's a nicer way to do this but this seems like it should work?


---

