首页 > 其他分享 >如何用ajax发送post请求

如何用ajax发送post请求

时间:2024-10-14 15:46:10浏览次数:13  
标签:status POST server 发送 xhr ajax result post response

和get类似,稍作改动:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>AJAX POST 请求</title>
    <style>
        #result {
            width: 200px;
            height: 100px;
            border: solid 1px #903;
        }
    </style>
</head>

<body>
    <div id="result"></div>
    <script>
        const result = document.getElementById("result");
        result.addEventListener("mouseover", function () {
            const xhr = new XMLHttpRequest();
            xhr.open('POST', 'http://127.0.0.1:8000/server');
            xhr.send();
            xhr.onreadystatechange = function () {
                if (xhr.readyState === 4) {
                    if (xhr.status >= 200 && xhr.status < 300) {
                        result.innerHTML = xhr.response;
                    }
                }
            }
        })
    </script>
</body>

</html>

server文件里加上

app.post('/server', (request, response) => {
    //设置响应头
    response.setHeader('Access-Control-Allow-Origin', '*');
    //设置响应体
    response.send('HELLO AJAX POST');
});

如图:即可到网页端查看效果

标签:status,POST,server,发送,xhr,ajax,result,post,response
From: https://blog.csdn.net/m0_74461206/article/details/142920947

相关文章

  • 5.XSS-反射型(post)利用:获取cookie
    原理:文件路径:\pikachu\pkxss\xcookie\post.html将post.html文件,复制到皮卡丘的根路径下或者根下随意路径即可,并编辑文件需要修改以下两个地址,第一个地址是将原界面的样子链接过来,让用户认为是原界面,第二个是将cookie从数据库中提取出来的程序(注意和自己的目录相对应)基于域名配......
  • 前端知识整理(全屏播放器 CSS JavaScript 轮转播放 jquery库 AJAX 画布 网页测试)
    currenttime在前端开发中,“currenttime”通常指的是获取用户设备的当前时间。这可以通过JavaScript来实现,下面是一个简单的示例代码,展示如何获取并显示当前时间:<!DOCTYPEhtml><html><head><title>显示当前时间</title></head><body><h1>当前时间:</h1><pid="d......
  • STM32与ESP32串口数据发送以及网页端数据实时显示和远程遥控
    目标:实现网页端速度实时显示以及可以通过点击页面按键达到对小车的位移方位控制。一、ESP32代码首先,需要让ESP32连接到WiFi,这样才能为后续的操作做准备。ssid="xxxxxx"password="xxxxxx"#WIFI连接defwifi_connect():wlan=network.WLAN(network.STA_IF)#STA模式......
  • 第四十一章 发送方码率预估揭秘
    WebRTC使用的是GoogleCongestionControl(简称GCC)拥塞控制,目前有两种实现:旧的实现是接收方根据收到的音视频RTP报文,预估码率,并使用REMBRTCP报文反馈回发送方。*新的实现是在发送方根据接收方反馈的TransportFeedbackRTCP报文,预估码率。基于延迟的拥塞控制原理先来......