Support » Plugin: Contact Form 7 » How to use the Contact Form 7 REST API?

  • I have a contact form 7 loaded asynchronously into a page using wpapi. It does not work, probably because when loading the contact form, the required JS code is not loaded.

    There is no error initially, but, when trying to submit the form, a new tab opens in Firefox with the URL:

    http://localhost/wp-json/wp/v2/pages?slug=contact#wpcf7-f51-o1

    And the body:

    {"code":"rest_cannot_create","message":"Regret, nu ai voie s\u0103 creezi articole \u00een numele acestui utilizator.","data":{"status":401}}

    The message, translated, would be: “I am sorry, but you cannot create articles in the name of this user.”.

    I am also not sure if the CSS is loaded for the form, if the plugin has special CSS applied to pages with contact forms.

    What would be the solution? I thought about using the REST API endpoint suggested [here](https://wordpress.org/support/topic/contact-form-7-rest-api-for-native-mobile-app/#post-12130487) but, also because there it is an older version, I am not sure of the way I should use it.

    What would be a sample request? Is there somewhere in the Internet documentation for this? Should I look into the code of the Contact Form 7?

    I use the latest version of WP (5.4) and Contact Form 7 (5.1.7).

    Thank you.

Viewing 2 replies - 1 through 2 (of 2 total)
  • I have this in docker-compose.yml:

      smtp:
        image: namshi/smtp
        container_name: ...smtp_relay_1
        restart: "no"
        ports:
          - "25:25"

    In the docker-compose output I get no error.

    I get this error in the browser using the JavaScript code below:

    There was an error trying to send your message. Please try again later.

    The JavaScript with the custom usage of the Contact Form 7 REST API is this:

    prepareContactForm() {
        $(".wpcf7-submit").on("click", (e) => {
            e.preventDefault();
            $.post("/wp-json/contact-form-7/v1/contact-forms/51/feedback",
                    {
                        "your-name": "Somebody",
                        "your-email": "...my-email-address-here...",
                        "your-subject": "tEsTiNg",
                        "your-message": "a\nb\nc"
                    }).then(
                (data) => {
                    let $el = $(".wpcf7-response-output");
    
                    if (data.status === "validation_failed") {
                        $el.text(data.message);
                        $el.removeClass("wpcf7-display-none");
                        return;
                    }
    
                    if (data.status === "mail_failed") {
                        $el.text(data.message);
                        $el.removeClass("wpcf7-display-none");
                        return;
                    }
    
                    if (typeof data.invalidFields !== "undefined") {
                        let output = "";
                        for (let i = 0; i < data.invalidFields.length; ++i) {
                            let into = data.invalidFields[i].into;
                            let message = data.invalidFields[i].message;
    
                            output += <code>${into} :: ${message}\n</code>;
                        }
    
                        if (output.length > 0) {
                            $el.text(output);
                            $el.removeClass("wpcf7-display-none");
                            return;
                        }
                    }
    
                    console.log('log', data);
    
                    $el.text("The message has been sent.");
                    $el.removeClass("wpcf7-display-none");
                }
            );
            return false;
        });
    }

    The form #51 is configured to send emails to my email address… But I checked the Spam folder too and I get no email from this form. Is there any configuration I need to do for SMTP inside the WordPress admin interface?

    Thank you.

    The data object is this:

    {into: "#", status: "mail_failed", message: "There was an error trying to send your message. Please try again later."}

    Please help me.

    Thank you.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘How to use the Contact Form 7 REST API?’ is closed to new replies.