Skip to main content
adicionou 392 caracteres ao conteúdo
Fonte Link
Syzoth
  • 100,5mil
  • 23
  • 169
  • 361

Se quiser obter a resposta do phpTambém é necessário ou colocar o script no front-end façafinal da página ou então usar:

document.addEventListener("DOMContentLoaded", function () {});

Faça assim:

<!DOCTYPE html>
<html>
<head>
<script>
document.addEventListener("DOMContentLoaded", function () {

    var btn = document.getElementById("btn");
    btn.addEventListener("click", function(){

        var req = new XMLHttpRequest();
        var jsObj = {nome: "Test"};
        var sendData = JSON.stringfy(jsObj);

        req.open('POST', 'https://url.com/pagina.php', true);

        req.onreadystatechange = function () {
            if (req.readyState != 4) return; //Ignora o resto enquanto readyState é diferente de 4 (4 = completo)

            if (req.status == 200) { //Resposta http padrão do PHP, afirma que esta tudo ok
                alert(req.responseText);//Exibe a resposta HTTP
            } else {
                alert("Erro HTTP ou conexão: " + req.status);//Exibe o código de erro HTTP ou um código de erro como "0" ou um outro numer (geralmente em IE) sobre problemas de conexão
            }
        };

        req.send(sendData);
    });
});
</script>
</head>
<body>

<button id="btn">Send an HTTP POST request to a page and get the result back</button>

</body>
</html>

Se quiser obter a resposta do php no front-end faça assim:

var btn = document.getElementById("btn");
btn.addEventListener("click", function(){

    var req = new XMLHttpRequest();
    var jsObj = {nome: "Test"};
    var sendData = JSON.stringfy(jsObj);

    req.open('POST', 'https://url.com/pagina.php', true);

    req.onreadystatechange = function () {
        if (req.readyState != 4) return; //Ignora o resto enquanto readyState é diferente de 4 (4 = completo)

        if (req.status == 200) { //Resposta http padrão do PHP, afirma que esta tudo ok
            alert(req.responseText);//Exibe a resposta HTTP
        } else {
            alert("Erro HTTP ou conexão: " + req.status);//Exibe o código de erro HTTP ou um código de erro como "0" ou um outro numer (geralmente em IE) sobre problemas de conexão
        }
    };

    req.send(sendData);
});

Também é necessário ou colocar o script no final da página ou então usar:

document.addEventListener("DOMContentLoaded", function () {});

Faça assim:

<!DOCTYPE html>
<html>
<head>
<script>
document.addEventListener("DOMContentLoaded", function () {

    var btn = document.getElementById("btn");
    btn.addEventListener("click", function(){

        var req = new XMLHttpRequest();
        var jsObj = {nome: "Test"};
        var sendData = JSON.stringfy(jsObj);

        req.open('POST', 'https://url.com/pagina.php', true);

        req.onreadystatechange = function () {
            if (req.readyState != 4) return; //Ignora o resto enquanto readyState é diferente de 4 (4 = completo)

            if (req.status == 200) { //Resposta http padrão do PHP, afirma que esta tudo ok
                alert(req.responseText);//Exibe a resposta HTTP
            } else {
                alert("Erro HTTP ou conexão: " + req.status);//Exibe o código de erro HTTP ou um código de erro como "0" ou um outro numer (geralmente em IE) sobre problemas de conexão
            }
        };

        req.send(sendData);
    });
});
</script>
</head>
<body>

<button id="btn">Send an HTTP POST request to a page and get the result back</button>

</body>
</html>
adicionou 949 caracteres ao conteúdo
Fonte Link
Syzoth
  • 100,5mil
  • 23
  • 169
  • 361

Se quiser obter a resposta do php no front-end faça assim:

var btn = document.getElementById("btn");
btn.addEventListener("click", function(){

    var req = new XMLHttpRequest();
    var jsObj = {nome: "Test"};
    var sendData = JSON.stringfy(jsObj);

    req.open('POST', 'https://url.com/pagina.php', true);

    req.onreadystatechange = function () {
        if (req.readyState != 4) return; //Ignora o resto enquanto readyState é diferente de 4 (4 = completo)

        if (req.status == 200) { //Resposta http padrão do PHP, afirma que esta tudo ok
            alert(req.responseText);//Exibe a resposta HTTP
        } else {
            alert("Erro HTTP ou conexão: " + req.status);//Exibe o código de erro HTTP ou um código de erro como "0" ou um outro numer (geralmente em IE) sobre problemas de conexão
        }
    };

    req.send(sendData);
});

Se quiser obter a resposta do php no front-end faça assim:

var btn = document.getElementById("btn");
btn.addEventListener("click", function(){

    var req = new XMLHttpRequest();
    var jsObj = {nome: "Test"};
    var sendData = JSON.stringfy(jsObj);

    req.open('POST', 'https://url.com/pagina.php', true);

    req.onreadystatechange = function () {
        if (req.readyState != 4) return; //Ignora o resto enquanto readyState é diferente de 4 (4 = completo)

        if (req.status == 200) { //Resposta http padrão do PHP, afirma que esta tudo ok
            alert(req.responseText);//Exibe a resposta HTTP
        } else {
            alert("Erro HTTP ou conexão: " + req.status);//Exibe o código de erro HTTP ou um código de erro como "0" ou um outro numer (geralmente em IE) sobre problemas de conexão
        }
    };

    req.send(sendData);
});
Fonte Link
Syzoth
  • 100,5mil
  • 23
  • 169
  • 361

Tem muitos erros, até mesmo o w3schools que é uma fonte que nunca recomendo tem exemplos prontos para você saber como fazer que já dariam uma boa noção, sinceramente espero que não entenda como uma critica, mas como dicas, teu script esta bem errado

Primeiro que XMLHttpRequest de forma síncrona é uma maneira de ruim de usar, um porque congela o navegador dependendo do tempo da resposta e outra que é algo que provavelmente em breve não vai funcionar no processo principal, somente com Web Worker (não tem data prevista, mas é possivel), o ideial é usar callbacks, aliais javascript vive de callbacks, não há mal algum em aprender o que é quase um requisito obrigatório para esta linguagem, ainda mais em front-end (sim existe JavaScript para back-end, mas ai é outra história e não quero fugir do tópico principal)

Para resumir isto é sincrono, não use:

req.open('POST', 'https://url.com');

Isto é assincrono (é preferivel):

req.open('POST', 'https://url.com', true);

Segundo problema, JavaScript é case-sensitive, então isto esta errado:

req.Send(sendData);

Deveria ser:

req.send(sendData);

Agora sobre como pegar JSON no lado do servidor, creio que você usa PHP (pelo que vi em suas outras perguntas) então use o php://input para isto, exemplo:

<?php
$dados = file_get_contents('php://input');

if ($dados) {
    $json = json_decode($dados, true);

    if ($json) {
       $nome = $json['nome'];
       echo 'nome:', $nome;
    }
}