web-dev-qa-db-fra.com

Je dois poster des données par AJAX en wordpress sur un autre site web

Je dois poster des données par AJAX in wordpress sur un autre site Web ( http://123abc.com/register ) .Mais je toujours obtenir une erreur. C’est mon code jquery AJAX:

<script>
$(document).ready(function() {

    // process the form
    $('form').submit(function(event) {

        // get the form data
        // there are many ways to get this data using jQuery (you can use the class or id also)
        var formData = {
            'fname'              : $('input[name=fname]').val(),
            'lname'              : $('input[name=lname]').val(),
            'email'              : $('input[name=email]').val(),
            'password'           : $('input[name=password]').val(),
            'gender'             : $('input[name=gender]').val(),
            'accent'             : $('input[name=accent]').val(),
            'type'               : $('input[name=type]').val(),
        };

        // process the form
        $.ajax({
            type        : 'POST', // define the type of HTTP verb we want to use (POST for our form)
            url         : 'http://123abc.com/register', // the url where we want to POST
            data        : formData, // our data object
            dataType    : 'json', 
            encode          : true,
            success: function(data){                
                if(data.error){
                    //show error message here
                    $('#name-group').append('<div class="help-block">' + data.errors + '</div>');
                }else{
                    //handle success part       
                    $('#name-group').append('<div class="help-block">' + data.message + '</div>');              
                }               
              },
              error: function(jqXHR, textStatus, errorThrown){
                //request error 
                $('#name-group').html('<p>status code: '+jqXHR.status+'</p><p>errorThrown: ' + errorThrown + '</p><p>jqXHR.responseText:</p><div>'+jqXHR.responseText + '</div>');
                console.log('jqXHR:');
                console.log(jqXHR);
                console.log('textStatus:');
                console.log(textStatus);
                console.log('errorThrown:');
                console.log(errorThrown);   
              }             
        });

        // stop the form from submitting the normal way and refreshing the page
        event.preventDefault();
    });

});
</script>

S'il vous plaît aider. Merci à l'avance

ajaxapi
1
Mainak Ray

Cela ne fonctionnera pas en raison de la "règle de même origine" à moins que le serveur que vous essayez de contacter permette spécifiquement ce type de demande avec quelque chose comme Access-Control-Allow-Origin: *. Vous pouvez lire la documentation sur MDN afin d’obtenir plus d’informations sur ce sujet.

D'après mes tests, le serveur aura également besoin d'un autre en-tête configuré, à savoir le Access-Control-Allow-Headers. Par conséquent, si nous combinons ces deux options, une configuration valide pourrait ressembler à ceci:

Access-Control-Allow-Origin: *
Access-Control-Allow-Headers: Content-Type, Accept, Authorization, X-Requested-With
2
webtoure