如何使用xmlHttpRequest从php发送和接收数据

问题描述

我正在尝试将一些数据发送到 PHP 脚本，然后返回一些其他数据。我不知道如何访问我发送到 PHP 脚本的数据。 stackoverflow 上的这篇文章没有帮助：Reading JSON POST using PHP Is the sent data in $_POST?它是在 $data 还是 $params 中？我如何访问它并打印出来。

这是我所拥有的：

index.html：

    .custom-input-container {
        display: flex;
        flex-direction: column;
        min-width: 300px;
        background: orange;
    }
    .custom-input-container .input-group {
        display: flex;
        flex-direction: row;
    }
    .custom-input-container .input-group input {
        width: 50%;
        height: 56px;
    }
    .custom-input-container input {
        height: 56px;
    }

xhr.js

<!DOCTYPE html>
<html lang="en">
<head>
  <Meta charset="UTF-8">
  <Meta name="viewport" content="width=device-width,initial-scale=1.0">
  <Meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Http Requests & JavaScript</title>
  <link rel="stylesheet" href="app.css">
  <script src="xhr.js" defer></script>
</head>
<body>
  <section id="control-center">
    <button id="get-btn">GET Data</button>
    <button id="post-btn">POST Data</button>
  </section>
</body>
</html>

data.PHP

const getBtn = document.getElementById('get-btn');
const postBtn = document.getElementById('post-btn');




const sendHttpRequest = (method,url,data) => {
    const promise = new Promise((resolve,reject) => {
        const xhr = new XMLHttpRequest();
        xhr.open(method,url);
        xhr.responseType = 'json';
        if (data){
            xhr.setRequestHeader('Content-Type','application/json');
        }

        xhr.onload = () => {
            resolve(xhr.response);
        }
        xhr.send(JSON.stringify(data));
    });
    console.log(promise);
    return promise;
};


const getData = () => {
    sendHttpRequest('GET','http://localhost/async/data.json').then(responseData => {
        console.log(response);

    });
};

const sendData = () => {
    sendHttpRequest('POST','http://localhost/async/data.PHP',{
        email: 'drcrocket@gmail.com',password: 'bowie'
    }).then(responseData => {
        console.log(responseData);
    });
};

getBtn.addEventListener('click',getData);
postBtn.addEventListener('click',sendData);

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

post post xmlhttprequest xmlhttprequest