Title: Contact Form 7 + WordPress REST API
Last modified: April 16, 2020

---

# Contact Form 7 + WordPress REST API

 *  Resolved [kamsou](https://wordpress.org/support/users/kamsou/)
 * (@kamsou)
 * [6 years, 2 months ago](https://wordpress.org/support/topic/contact-form-7-wordpress-rest-api/)
 * Good morning, sir,
    I have a problem with contact 7 form that I want related 
   to my Vuejs front. I use the rest api of wordpress. I’m getting my inputs back.
   I use axios. My post works with Insomnia. But not with my dev site.
 *     ```
        data: function () {
               return {
                 form: {
                 nameTest: '',
                 mail: '',
                 message: '',
                 },
                 errors: [],
                 url: 'https://mywebsite.com/wp-json/contact-form-7/v1/contact-forms/143/feedback'
               }
             },
   
           methods: {
             submitForm() {
               axios.post(this.url, this.form)
               .then((response) => {
                 console.log(response); 
                 this.errors = [];
               })
               .catch((error) => {
                 this.errors = error.response.data.message
               });
             }
           },
       ```
   
 * And the response on submit :
 *     ```
       into: "#"
       status: "validation_failed"
       message: "Un ou plusieurs champs contiennent une erreur. Veuillez vérifier et essayer à nouveau."
       invalidFields: (2) [{…}, {…}]
       ```
   
 * Any idea ?
    -  This topic was modified 6 years, 2 months ago by [kamsou](https://wordpress.org/support/users/kamsou/).

Viewing 1 replies (of 1 total)

 *  [laubarnes](https://wordpress.org/support/users/laubarnes/)
 * (@laubarnes)
 * [6 years, 1 month ago](https://wordpress.org/support/topic/contact-form-7-wordpress-rest-api/#post-12876272)
 * I noticed that this post has been marked as resolved. But thought I would post
   my own experience on solving this issue for anyone else who has trouble formatting
   their body to post to the end point.
 * I have been developing a Nuxt / Vue application using wordpress rest api and 
   Contact Form 7 to submit a form.
 * The two main things to do here
 * 1. ensure your object keys are named the same as your CF7 keys within wordpress.
   By default, the field name are `your-name` and `your-email`. In your example 
   above, you are just using `nameTest` and `email`.
 * 2. You need to prepare your object to represent HTML form data. You can do this
   using the `formData` object. You can read more about it here: [https://developer.mozilla.org/en-US/docs/Web/API/FormData/FormData](https://developer.mozilla.org/en-US/docs/Web/API/FormData/FormData)
 *     ```
       // 1. Format your body response
       const emailBody = {
           "your-name": this.form.nameTest,
           "your-email": this.form.email,
           "your-message": this.form.message,
       };
   
       // 2. Create a FormData object, and append each field to the object
       const form = new FormData();
       for (const field in emailBody) {
           form.append(field, emailBody[field]);
       }
       ```
   
 * I gave a more detail answer on stackoverflow for a similar post: [https://stackoverflow.com/questions/56731006/what-parameter-contact-form-7-using-json-to-sent-using-api/61956314#61956314](https://stackoverflow.com/questions/56731006/what-parameter-contact-form-7-using-json-to-sent-using-api/61956314#61956314)
 * Hopefully this can help others who are having the same issues

Viewing 1 replies (of 1 total)

The topic ‘Contact Form 7 + WordPress REST API’ is closed to new replies.

 * ![](https://ps.w.org/contact-form-7/assets/icon.svg?rev=2339255)
 * [Contact Form 7](https://wordpress.org/plugins/contact-form-7/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/contact-form-7/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/contact-form-7/)
 * [Active Topics](https://wordpress.org/support/plugin/contact-form-7/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/contact-form-7/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/contact-form-7/reviews/)

## Tags

 * [WordPress REST API](https://wordpress.org/support/topic-tag/wordpress-rest-api/)

 * 1 reply
 * 2 participants
 * Last reply from: [laubarnes](https://wordpress.org/support/users/laubarnes/)
 * Last activity: [6 years, 1 month ago](https://wordpress.org/support/topic/contact-form-7-wordpress-rest-api/#post-12876272)
 * Status: resolved