首页 > 解决方案 > Heroku Nodejs Webhosting

问题描述

Im trying to host a election website.

My Current Method explained: There is server.js file with serves the public file. If its a POST request(sent by frontend.js to send data to server) edits the poll.json file based on the data sent. I have a public file having index.html, frontend.js, poll.json where poll.json stores all the data.

My current code work all well in my localhost. But when running it in Heroku I get a error in the POST request line saying 'POST http://localhost:53390/ net::ERR_CONNECTION_REFUSED1 *********.herokuapp.com/:1 Uncaught (in promise) TypeError: Failed to fetch'

My server.js code:

const createServer = require('http').createServer;
const express = require('express');
const app = express();
let pollData = require(__dirname+'/public/poll.json');
const fs = require('fs');
var all_usn_no=[];
const listening_port=process.env.PORT || 4000;

function get_roll_and_usn(pollData){
  for(var i=0;i<=pollData.students.length-1;i++){
      //all_roll_no.push(pollData.students[i][0]);
      all_usn_no.push(pollData.students[i][1]);
  }
}
function roll_to_row(in_usn){
  get_roll_and_usn(pollData)
  return all_usn_no.indexOf(in_usn);
}
function write_vote(votes){
  var checking_row=roll_to_row(votes[1]);
  pollData.students[checking_row]=votes;
  fs.writeFile(__dirname+'/public/poll.json', JSON.stringify(pollData), (err) => {
      if (err) throw err;
      console.log('Data written to file');
  });
}

write_vote([listening_port,0]);

app.use(express.static(__dirname+'/public'));
app.get('/', (req, res) => {
    res.sendFile(__dirname);// + '/index.html');
});
app.post('/', (req, res) => {
    let body = '';
    req.on('data', data => body += data)
    req.on('end', () => {
      res.writeHead(200, {
        'Content-Type': 'application/json',
        'Access-Control-Allow-Origin': '*',
        'Access-Control-Allow-Methods': 'POST, GET',
      });
      body=body.split(",");
      console.log(body.toString());
      write_vote(body);
      res.end(`{ "response": "${body ? body : 'No body sent' }" }`);
    })
});
app.listen(listening_port, () => {
  console.log('Example app listening at http://localhost:'+listening_port)
});

my frontend.js program:

        var roll='';
    var client_ip='';
    var usn='';
    var date='';
    const all_roll_no=[]
    const all_usn_no=[]
    var port='';

    function check(roll,usn){
        var data='';
        const url='poll.json';
        const Http = new XMLHttpRequest();
        Http.open("GET", url);
        Http.send();
        Http.onload = () =>{
            data=JSON.parse(Http.response);
            get_roll_and_usn(data);
            check_validity(roll,usn,data);
        }
    }
    function get_roll_and_usn(pollData){
        for(var i=0;i<=pollData.students.length-1;i++){
            //all_roll_no.push(pollData.students[i][0]);
            all_usn_no.push(pollData.students[i][1]);
        }
    }
    function usn_to_row(in_usn){
        return all_usn_no.indexOf(in_usn);
    }
    function check_validity(checking_roll,checking_usn,data){
        var checking_row=usn_to_row(checking_usn);
        port=data.students[0][0];
        //if(all_roll_no.indexOf(checking_roll)>=0 && checking_usn==all_usn_no[all_roll_no.indexOf(checking_roll)] && data.students[checking_row][2]==0){
        if(all_usn_no.indexOf(checking_usn)>=0 && data.students[checking_row][2]==0){
            //console.log("valid");
            document.getElementById("page_2").style.display = "none";
            document.getElementById("page_3").style.display = "block";
            fetch('https://api.ipify.org/?format=json').then(results=> results.json()).then(data => client_ip=data.ip);
        }
        else{
            alert("You cannot vote/ You have already voted")
            //console.log('invalid');
        }
    }


    document.getElementById("startbutton").onclick = function(){ 
        roll = document.getElementById("roll_no").value;
        usn = document.getElementById("usn_no").value;
        date = Date();
        check(roll,usn);
    } 
    document.getElementById("next").onclick = function() {    
        document.getElementById("page_1").style.display = "none";
        document.getElementById("page_2").style.display = "block";
    }
    document.getElementById("finish").onclick = function() {
        var splb=[document.getElementById("splb1").checked,document.getElementById("splb2").checked,document.getElementById("splb3").checked,document.getElementById("splb4").checked,document.getElementById("splb5").checked,document.getElementById("splb6").checked,document.getElementById("splb7").checked];
        var splg=[document.getElementById("splg1").checked,document.getElementById("splg2").checked,document.getElementById("splg3").checked,document.getElementById("splg4").checked,document.getElementById("splg5").checked,document.getElementById("splg6").checked,document.getElementById("splg7").checked];
        var asplb=[document.getElementById("asplb1").checked,document.getElementById("asplb2").checked,document.getElementById("asplb3").checked,document.getElementById("asplb4").checked,document.getElementById("asplb5").checked,document.getElementById("asplb6").checked,document.getElementById("asplb7").checked];
        var asplg=[document.getElementById("asplg1").checked,document.getElementById("asplg2").checked,document.getElementById("asplg3").checked,document.getElementById("asplg4").checked,document.getElementById("asplg5").checked,document.getElementById("asplg6").checked,document.getElementById("asplg7").checked];
        var csb=[document.getElementById("csb1").checked,document.getElementById("csb2").checked,document.getElementById("csb3").checked,document.getElementById("csb4").checked,document.getElementById("csb5").checked,document.getElementById("csb6").checked,document.getElementById("csb7").checked];
        var csg=[document.getElementById("csg1").checked,document.getElementById("csg2").checked,document.getElementById("csg3").checked,document.getElementById("csg4").checked,document.getElementById("csg5").checked,document.getElementById("csg6").checked,document.getElementById("csg7").checked];
        var acsb=[document.getElementById("acsb1").checked,document.getElementById("acsb2").checked,document.getElementById("acsb3").checked,document.getElementById("acsb4").checked,document.getElementById("acsb5").checked,document.getElementById("acsb6").checked,document.getElementById("acsb7").checked];
        var acsg=[document.getElementById("acsg1").checked,document.getElementById("acsg2").checked,document.getElementById("acsg3").checked,document.getElementById("acsg4").checked,document.getElementById("acsg5").checked,document.getElementById("acsg6").checked,document.getElementById("acsg7").checked];
        var scb=[document.getElementById("scb1").checked,document.getElementById("scb2").checked,document.getElementById("scb3").checked,document.getElementById("scb4").checked,document.getElementById("scb5").checked,document.getElementById("scb6").checked,document.getElementById("scb7").checked];
        var scg=[document.getElementById("scg1").checked,document.getElementById("scg2").checked,document.getElementById("scg3").checked,document.getElementById("scg4").checked,document.getElementById("scg5").checked,document.getElementById("scg6").checked,document.getElementById("scg7").checked];
        var ascb=[document.getElementById("ascb1").checked,document.getElementById("ascb2").checked,document.getElementById("ascb3").checked,document.getElementById("ascb4").checked,document.getElementById("ascb5").checked,document.getElementById("ascb6").checked,document.getElementById("ascb7").checked];
        var ascg=[document.getElementById("ascg1").checked,document.getElementById("ascg2").checked,document.getElementById("ascg3").checked,document.getElementById("ascg4").checked,document.getElementById("ascg5").checked,document.getElementById("ascg6").checked,document.getElementById("ascg7").checked];
        var vote=[String(splb.indexOf(true)),String(splg.indexOf(true)),String(asplb.indexOf(true)),String(asplg.indexOf(true)),String(csb.indexOf(true)),String(csg.indexOf(true)),String(acsb.indexOf(true)),String(acsg.indexOf(true)),String(scb.indexOf(true)),String(scg.indexOf(true)),String(ascb.indexOf(true)),String(ascg.indexOf(true))]
        var update=[String(roll),String(usn),"1",String(client_ip),String(date)].concat(vote);

        if (update.indexOf("-1")<0){
            alert("Pls vote for all posts")
        }
        else{
            document.getElementById("page_1").style.display = "none";
            document.getElementById("page_2").style.display = "none";
            document.getElementById("page_3").style.display = "none";
            fetch('http://localhost:'+port,{method:'POST',body:update}).then(results=> results.json()).then(console.log);
            //console.log(update);

            alert("Your vote has been registered")
        }    
    } 

You can just ignore the function as they are just to process the data and do necessary funtions.

Main problem: PORT request from frontend.js to server.js sending data to edit the poll.json file return error.

Thanks in advance.

标签: node.jsheroku

解决方案


尝试使用const PORT = process.env.PORT || 3333;

app.listen(PORT, () => {
    console.log(`Server is starting on ${PORT}`);
})

推荐阅读