package.json { "name": "tokl", "version": "1.0.0", "description": "", "main": "app.js", "dependencies": { "body-parser": "^1.19.0", "client-sessions": "^0.8.0", "cookie-parser": "^1.4.5", "express": "^4.17.1", "hbs": "^4.1.2", "webpack": "^5.60.0", "webpack-cli": "^4.9.1", "webpack-dev-server": "^4.4.0" }, "devDependencies": {}, "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "start": "node app.js" }, "repository": { "type": "git", "url": "tokl.git" }, "keywords": [ "1" ], "author": "1", "license": "ISC", "bugs": { "url": "1" }, "homepage": "1readme" } ----------------------------------------------------- var express = require('express'); var exphbs = require('express-handlebars'); var app = express(); //app.engine('.hbs', exphbs({extname: '.hbs'})); //app.set('view engine', '.hbs'); app.engine('hbs', exphbs({defaultLayout: false, extname:'.hbs',})); const bodyParser = require("body-parser"); const fs = require("fs"); var createError = require("http-errors"); const passport = require("passport"); var path = require("path"); const session = require("express-session"); var cookieParser = require("cookie-parser"); var logger = require("morgan"); var express = require('express'); var exphbs = require('express-handlebars'); app.set("views", path.join(__dirname, "views")); app.set("view engine", "hbs"); app.use(logger("dev")); app.use(express.json()); app.use(express.urlencoded({ extended: false })); app.use(cookieParser()); app.use(express.static(path.join(__dirname, "public"))); app.use(express.static("./public")); app.use(bodyParser.urlencoded({ extended: false })); app.use(bodyParser.json()); var userLogin = {}; app.post("/api/login", (req, res) => { fs.readFile("./data.json", (err, data) => { var arr = []; if (err) { console.log(err); } else { if (data.toString()) { arr = JSON.parse(data.toString()); } var s = arr.find((item) => { if (item.name == req.body.name) { return item; } }); if (s) { if (s.password == req.body.password) { userLogin = req.body; res.json({ status: "y", meg: "login success", data: s.name, }); } else { res.json({ status: "err", meg: "wrong password ", }); } } else { res.json({ status: "n", meg: "no such user ", }); } } }); }); app.get("/index", (req, res) => { if (userLogin.name) res.render("index", { username: userLogin.name }); else res.render("login"); }); app.get("/", (req, res) => { res.render("login"); }); app.set("views", path.join(__dirname, "views")); app.use(express.static(path.join(__dirname, "public"))); var PORT = 3000; app.listen(3000, function () { console.log(`Listening on port ${PORT}`); }); --------------- Login Login User Name:> login
this node js app .i want to submit it to heroku ,but not working .
i have tryed some fix to it ,but it cant work on my pc .
i cant understand why
npm ERR! missing script: start
npm ERR! A complete log of this run can be found in:
npm ERR!
$ node app.js
internal/modules/cjs/loader.js:905
throw err;
^
Error: Cannot find module 'express-handlebars'
Require stack:
-------------
package.json
{
"name": "tokl",
"version": "1.0.0",
"description": "",
"main": "app.js",
"dependencies": {
"body-parser": "^1.19.0",
"client-sessions": "^0.8.0",
"cookie-parser": "^1.4.5",
"express": "^4.17.1",
"hbs": "^4.1.2",
"webpack": "^5.60.0",
"webpack-cli": "^4.9.1",
"webpack-dev-server": "^4.4.0"
},
"devDependencies": {},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node app.js"
},
"repository": {
"type": "git",
"url": "tokl.git"
},
"keywords": [
"1"
],
"author": "1",
"license": "ISC",
"bugs": {
"url": "1"
},
"homepage": "1readme"
}
-----------------------------------------------------
var express = require('express');
var exphbs = require('express-handlebars');
var app = express();
//app.engine('.hbs', exphbs({extname: '.hbs'}));
//app.set('view engine', '.hbs');
app.engine('hbs', exphbs({defaultLayout: false, extname:'.hbs',}));
const bodyParser = require("body-parser");
const fs = require("fs");
var createError = require("http-errors");
const passport = require("passport");
var path = require("path");
const session = require("express-session");
var cookieParser = require("cookie-parser");
var logger = require("morgan");
var express = require('express');
var exphbs = require('express-handlebars');
app.set("views", path.join(__dirname, "views"));
app.set("view engine", "hbs");
app.use(logger("dev"));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, "public")));
app.use(express.static("./public"));
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());
var userLogin = {};
app.post("/api/login", (req, res) => {
fs.readFile("./data.json", (err, data) => {
var arr = [];
if (err) {
console.log(err);
} else {
if (data.toString()) {
arr = JSON.parse(data.toString());
}
var s = arr.find((item) => {
if (item.name == req.body.name) {
return item;
}
});
if (s) {
if (s.password == req.body.password) {
userLogin = req.body;
res.json({
status: "y",
meg: "login success",
data: s.name,
});
} else {
res.json({
status: "err",
meg: "wrong password ",
});
}
} else {
res.json({
status: "n",
meg: "no such user ",
});
}
}
});
});
app.get("/index", (req, res) => {
if (userLogin.name) res.render("index", { username: userLogin.name });
else res.render("login");
});
app.get("/", (req, res) => {
res.render("login");
});
app.set("views", path.join(__dirname, "views"));
app.use(express.static(path.join(__dirname, "public")));
var PORT = 3000;
app.listen(3000, function () {
console.log(`Listening on port ${PORT}`);
});
---------------
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Login</title>
<style>
form{
display: flex;
flex-direction: column;
width: 300px;
justify-content: space-evenly;
margin: auto;
}
h2{
text-align: center;
}
</style>
<script type="application/javascript">
function validate() {
{{!-- var data = new FormData(); --}}
const data = new URLSearchParams();
data.append('name', document.getElementById("name").value);
data.append("password", document.getElementById("password").value);
var params = { name: document.getElementById("name").value, password: document.getElementById("password").value };
var request = new XMLHttpRequest();
request.open("POST", "/api/login");
request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
request.onload = function () {
var result = JSON.parse(request.response);
if (result.status === "y") {
window.location.href = "/index";
} else {
alert(result.meg);
}
};
{{!-- request.send(JSON.stringify(params)); --}}
request.send(data.toString());
}
</script>
<h2>Login</h2>
<form action="index.hbs" method="POST">
<label for="">User Name:</label>>
<li class="list-group-item"><input class="form-control" type="text" name="name" id="name" placeholder="enter account" /></li>
<li class="list-group-item"><input class="form-control" type="text" name="password" id="password" placeholder="enter password" /></li>
<li class="list-group-item"><button type="button" class="btn btn-block btn-danger" onclick="validate()" id="btnLogin">login</button></li>
</ul>
</div>
</div>
</body>
</html>
Step by step
Solved in 3 steps
