Send form without reloading page being from different domains

Asked

Viewed 311 times

0

I need to do a method that does not reload the page and send the data to a server on another domain. However I am having problems with the XMLHttpRequest. Does anyone know any method to do this and be able to send the data to the script PHP that is on the other server outside the domain?

That’s the method I was trying to do:

$(function() {

    $('#form1').submit(function(event){
        event.preventDefault();
        var nome = $("#Nome").val();
        var email = $("#Email").val();

        if (nome!='' & email!='') {
            $.ajax({
                type: "POST",
                url: "Insert_blog_tricae2.php",
                contentType: "application/json;         charset=utf-8",
                crossDomain  : "true",
                dataType: "jsonp",
                asynch: true,
                data: {"Nome": nome, "Email":email},
                success: function(retorno){
                    $('#resultado').html(nome+"<br>"+email).fadeIn();
                    $('#Nome').val('');
                    $('#Email').val('');
                    $('#resultado').fadeOut(10000);
                }
            });
        } else {
            $('#resultado').html('<center>Existem campos incompletos no formul&aacute;rio.<br> Favor preencher todos.</center>').show();
        }
        return false;
    })
})
  • the code is this:

  • $(Function(){ $('#Form1'). Submit(Function(Event){ Event.preventDefault(); var name = $("#Name"). val(); var email = $("#Email"). val(); if (name!= '' & email!= ') { $. ajax({ type: "POST", url: "Insert.php", contenttype: "application/json; charset=utf-8", crossDomain : "true", dataType: "jsonp", asynch: true, date: {"Name": name, "Email":email}, Success: Function(return){ $('#result'). html(name+"<br>"+email). fadein(); $('#Name'). val('); $('#Email'). val('');

  • What is the url for where you want to do ajax?

  • You want the address of the server I’m sending the request?

  • Thanks for the help!

1 answer

1


The problem must be on the server that is receiving the post.

You must use Access-Control-Allow-Origin on the server that will receive the data.

header('Access-Control-Allow-Origin: '.$_SERVER['HTTP_ORIGIN']);
header('Access-Control-Allow-Methods: GET, POST');
header('Access-Control-Max-Age: 1000');
header('Access-Control-Allow-Headers: Content-Type, Authorization, X-Requested-With');

In place of $_SERVER['HTTP_ORIGIN'] you can fix the server, to prevent other domains from communicating with your server that is receiving your request.

You can get more information about Access Control CORS (in English) on the MDN website and on html5rocks (also in English)

  • Ok, but this code I put in the php script that receives the POST? There is no ajax function that can "circumvent" this?

  • I almost forgot, thanks for the reply.

  • Blz, it worked correctly the codes that you Leandro Amorim gave me! Thanks

  • @Rafaeldossantos if this answer solved your problem, consider accepting it. See more at: http://meta.pt.stackoverflow.com/a/1079/3117

Browser other questions tagged

You are not signed in. Login or sign up in order to post.