简体   繁体   English

对服务器的发布请求在 express net::ERR_CONNECTION_REFUSED 中给了我错误

[英]Post request to server is giving me error in express net::ERR_CONNECTION_REFUSED

I want to collect the data from a simple HTML form and send it to the server.我想从一个简单的 HTML 表单中收集数据并将其发送到服务器。 Unfortunately, I am making some mistakes and the server is not receiving the data.不幸的是,我犯了一些错误,服务器没有收到数据。 The error in the console控制台中的错误

POST http://localhost:3000/ net::ERR_CONNECTION_REFUSED POST http://localhost:3000/net::ERR_CONNECTION_REFUSED

Here is my code.这是我的代码。

server.js服务器.js

var express = require("express");
var app = express();
let PORT = process.env.PORT || 3000;

// Middleware
app.use(express.static("public"));
app.use(express.json());

app.get("/", function(req, res) {
  res.sendFile(__dirname + "./public/index.html");
});

app.post("/", function(req, res) {
    console.log('kkk', req.body);
});

var server = app.listen(PORT, function() {
  console.log("Express server listening on port " + PORT);
});

I am using XMLHttpRequest() to collect the data and here is the code.我正在使用XMLHttpRequest()来收集数据,这是代码。

const contactForm = document.querySelector('#contactForm');
let fullName = document.getElementById('fullName');
let email = document.getElementById('emailAddress');
let phone = document.getElementById('phoneNumber');
let message = document.getElementById('message');

contactForm.addEventListener('submit', (e) => {
    e.preventDefault();
    let formData = {
        name: fullName.value,
        email: email.value,
        phone: phone.value,
        message: message.value
    }
    
    let xhttp = new XMLHttpRequest();

    xhttp.open('POST', '/');
    xhttp.setRequestHeader('content-type', 'application/json');
    xhttp.onload = function() {
        console.log(xhttp.responseText);
        if(xhttp.responseText == 'success') {
            console.log('Email sent successfully');
            fullName.value = '';
            emai.value = '';
            phone.value = '';
            message.value = '';
        }else {
            console.log('Something went wrong');
        }
    }
    xhttp.send(JSON.stringify(formData));
});

If you want to check it live.如果你想现场检查。

https://contact2021.herokuapp.com/ https://contact2021.herokuapp.com/

On Server, I can see the response在服务器上,我可以看到响应

在此处输入图像描述

Testing your live site, I see that it hangs when posting to https://contact2021.herokuapp.com/ .测试您的实时站点,我发现它在发布到https://contact2021.herokuapp.com/时挂起。 Presuming that this route is defined by the following:假设这条路线由以下定义:

app.post("/", function(req, res) {
    console.log('kkk', req.body);
});

an issue is that you will need to initiate some kind of response, using one of the methods on Response (eg res.end() , res.send() ).一个问题是您需要使用Response上的一种方法(例如res.end()res.send() )启动某种响应。

This is likely not the same issue as the connection to localhost:3000 , but if you are trying to access the site from any machine other that the one hosting it in development, then that connection wouldn't work, as it would be trying to connect to itself at that port.这可能与连接到localhost:3000的问题不同,但是如果您尝试从除在开发中托管它的机器以外的任何机器访问该站点,那么该连接将无法正常工作,因为它会尝试在该端口连接到自身。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM