CODEWITHSUNDEEP
javascriptjqueryajax
Brack
Brack

Reputation: 333

Ajax only working for some users?

I just finished building an AJAX contact form for a client and the client complains that it doesn't work. Whenever I (or anyone else, for that matter) test it it works just fine. The client claims they see "Ajax Error" as the error text. Here is my code:

$.ajax({
    type: 'POST',
    url: "http://example.domain.com/content/contact/php/verify.php",
    dataType: 'html',
    async: true,
    data: {
        captchaResponse: $("#g-recaptcha-response").val(),
        contactType: $('#contactFormType').val(),
        contactName: $('#contactFormName').val(),
        contactEmail: $('#contactFormEmail').val(),
        contactPhone: $('#contactFormPhone').val(),
        contactMessage: $('#contactFormMessage').val()
    },
    success: function (data) {
        // Success...
    },
    error: function (XMLHttpRequest, textStatus, errorThrown) {
        grecaptcha.reset();

/* This is the error the client is seeing, that no one else is */

        $('#contactErrorField').html('AJAX Error: ' + errorThrown);
        $('#contactErrorWrapper').show(0);
        $('#contactBodyOverlay').hide(0);
    }

All the client sees is "AJAX Error:" with no actual error text in the errorThrown variable.

Does anyone have any idea why this code might fail for my client, but appear to work fine for everyone else. I'm nervous it is something on her end, but I am loathe to blame my client before trying everything I can.

Upvotes: 1

Views: 88

Answers (1)

Quentin
Quentin

Reputation: 944112

Given:

  • You have an absolute URI in the url parameter
  • The errorThrown argument is blank

The most likely explanation is that your client is visiting a subtly different URI to the one you use for your own tests (e.g. http:// instead of https://) and is triggering a cross-origin request which your server is not granting permission for using CORS.

You can confirm this by getting the client to open the developer tools in their browser and looking for an error message that talks about Access-Control-Allow-Origin.

This problem can be mitigated by using a relative URI (or by setting up CORS support on the server).

Upvotes: 1

Related Questions