This commit is contained in:
newtbot 2024-01-18 03:15:31 +08:00
parent 1ddce4b743
commit 4e4e8bfee2
7 changed files with 268 additions and 113 deletions

View File

@ -1,21 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Login Page</title>
<script src="login.js" defer></script>
</head>
<body>
<h2>Login</h2>
<form id="loginForm">
<label for="email">Email:</label>
<input type="text" id="email" name="email" required>
<label for="password">Password:</label>
<input type="password" id="password" name="password" required>
<button type="button" onclick="validateForm()">Login</button>
</form>
</body>
</html>

View File

@ -1,24 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Signup Page</title>
<script src="signup.js" defer></script>
</head>
<body>
<h2>Signup</h2>
<form id="signupForm">
<label for="username">Username:</label>
<input type="text" id="username" name="username" required>
<label for="password">Password:</label>
<input type="password" id="password" name="password" required>
<label for="confirmPassword">Confirm Password:</label>
<input type="password" id="confirmPassword" name="confirmPassword" required>
<button type="button" onclick="validateForm()">Sign Up</button>
</form>
</body>
</html>

View File

@ -1,35 +0,0 @@
function validateForm() {
var userid = document.getElementById('user_id').value;
var username = document.getElementById('user_name').value;
var email = document.getElementById('email').value;
var password = document.getElementById('password').value;
var confirmPassword = document.getElementById('confirmPassword').value;
var email = document.getElementById('email').value;
// Perform basic validation
if (password !== confirmPassword) {
alert('Passwords do not match');
return;
}
// If validation passes, send data to the server
sendDataToServer(username, email, password);
}
function sendDataToServer(username, password) {
// Use AJAX or fetch to send data to the server
// Example using fetch:
fetch('/signup', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ username, email, password }),
})
.then(response => response.json())
.then(data => {
// Handle the response from the server
console.log(data);
})
.catch(error => console.error('Error:', error));
}

View File

@ -1,19 +1,24 @@
const express = require("express");
const helmet = require("helmet");
const path = require("path");
const app = express();
app.use(helmet());
const port = 80;
const bodyParser = require('body-parser'); // Middleware
app.use(bodyParser.urlencoded({ extended: false }));
app.use(helmet());
//disable x-powered-by header for security reasons
app.disable("x-powered-by");
app.use(express.json());
app.set("json spaces", 2);
//public folder with path to static files
app.use(express.static(path.join(__dirname, "../public")));
//middleware logic ( called by next() )
//app.use('/api/v0', APIlogger, require('../routes/api_route.js'));
//add token middeware upon login to validate routes that require token
//route logic
app.use("/api/v0", require("../routes/api_routes")); //consumerWebsite\routes\api_routes.js
@ -33,16 +38,16 @@ app.use(function(err, req, res, next) {
if (![404].includes(err.status || res.status)) {
console.error(err.message);
console.error(err.stack);
console.error('=========================================');
console.error("=========================================");
}
console.log(err.name + " validation error");
// Parse key error for Sequilzw
let keyErrors = {}
if(['SequelizeValidationError'].includes(err.name) && err.errors){
let keyErrors = {};
if (["SequelizeValidationError"].includes(err.name) && err.errors) {
for (let item of err.errors) {
if (item.path) {
keyErrors[item.path] = item.message
keyErrors[item.path] = item.message;
}
}
}

179
consumerWebsite/public/js/jquery.js vendored Normal file
View File

@ -0,0 +1,179 @@
var app = {};
/*
app.api = (function(app){
var baseURL = '/api/v0/'
function post(url, data, callback){
$.ajax({
type: 'POST',
url: baseURL+url,
headers:{
'auth-token': app.auth.getToken()
},
data: JSON.stringify(data),
contentType: "application/json; charset=utf-8",
dataType: "json",
complete: function(res, text){
callback(
text !== 'success' ? res.statusText : null,
JSON.parse(res.responseText),
res.status
)
}
});
}
function put(url, data, callback){
$.ajax({
type: 'PUT',
url: baseURL+url,
headers:{
'auth-token': app.auth.getToken()
},
data: JSON.stringify(data),
contentType: "application/json; charset=utf-8",
dataType: "json",
complete: function(res, text){
callback(
text !== 'success' ? res.statusText : null,
JSON.parse(res.responseText),
res.status
)
}
});
}
function remove(url, callback, callback2){
if(!$.isFunction(callback)) callback = callback2;
$.ajax({
type: 'delete',
url: baseURL+url,
headers:{
'auth-token': app.auth.getToken()
},
contentType: "application/json; charset=utf-8",
dataType: "json",
complete: function(res, text){
callback(
text !== 'success' ? res.statusText : null,
JSON.parse(res.responseText),
res.status
)
}
});
}
function get(url, callback){
$.ajax({
type: 'GET',
url: baseURL+url,
headers:{
'auth-token': app.auth.getToken()
},
contentType: "application/json; charset=utf-8",
dataType: "json",
complete: function(res, text){
callback(
text !== 'success' ? res.statusText : null,
JSON.parse(res.responseText),
res.status
)
}
});
}
return {post: post, get: get, put: put, delete: remove}
})(app)
*/
app.auth = (function(app) {
var user = {}
function setToken(token){
localStorage.setItem('APIToken', token);
}
function getToken(){
return localStorage.getItem('APIToken');
}
function isLoggedIn(callback){
if(getToken()){
return app.api.get('user/me', function(error, data){
if(!error) app.auth.user = data;
return callback(error, data);
});
}else{
callback(null, false);
}
}
function logIn(args, callback){
app.api.post('auth/login', args, function(error, data){
if(data.login){
setToken(data.token);
}
callback(error, !!data.token);
});
}
function logOut(callback){
localStorage.removeItem('APIToken');
callback();
}
function forceLogin(){
$.holdReady( true );
app.auth.isLoggedIn(function(error, isLoggedIn){
if(error || !isLoggedIn){
app.auth.logOut(function(){})
location.replace(`/login${location.href.replace(location.origin, '')}`);
}else{
$.holdReady( false );
}
});
}
function logInRedirect(){
window.location.href = location.href.replace(location.origin+'/login', '') || '/'
}
return {
getToken: getToken,
setToken: setToken,
isLoggedIn: isLoggedIn,
logIn: logIn,
logOut: logOut,
forceLogin,
logInRedirect,
}
})(app);
//ajax form submit
function formAJAX( btn, del ) {
event.preventDefault(); // avoid to execute the actual submit of the form.
var $form = $(btn).closest( '[action]' ); // gets the 'form' parent
var formData = $form.find( '[name]' ).serializeObject(); // builds query formDataing
var method = $form.attr('method') || 'post';
// if( !$form.validate()) {
// app.util.actionMessage('Please fix the form errors.', $form, 'danger')
// return false;
// }
app.util.actionMessage(
'<div class="spinner-border" role="status"><span class="sr-only">Loading...</span></div>',
$form,
'info'
);
app.api[method]($form.attr('action'), formData, function(error, data){
app.util.actionMessage(data.message, $form, error ? 'danger' : 'success'); //re-populate table
if(!error){
$form.trigger("reset");
eval($form.attr('evalAJAX')); //gets JS to run after completion
}
});
}

View File

@ -0,0 +1,58 @@
<!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 & Signup Form</title>
<link rel="stylesheet" href="css/sp.css" />
</head>
<body>
<section class="wrapper">
<div class="form signup">
<header>Signup</header>
<form action="/api/v0/user/register" method="POST">
<input type="text" id="username" placeholder="Username" required />
<input type="text" id="email" placeholder="Email" required />
<input type="text" id="address" placeholder="Address" required />
<input type="text" id="phone" placeholder="Phone Number" required />
<input type="password" id="password" placeholder="Password" required />
<input type="password" id="confirmPassword" placeholder="Confirm Password" required />
<div class="checkbox">
<input type="checkbox" id="signupCheck" />
<label for="signupCheck">I accept all terms & conditions</label>
</div>
<input type="submit" value="Signup" />
</form>
</div>
<div class="form login">
<header>Login</header>
<form action="#">
<input type="text" id="email" placeholder="Email address" required />
<input type="password" id="password" placeholder="Password" required />
<a href="forgotpassword.html">Forgot password?</a>
<input type="submit" onclick="validateFormLogin()" value="Login" />
</form>
</div>
<script>
const wrapper = document.querySelector(".wrapper"),
signupHeader = document.querySelector(".signup header"),
loginHeader = document.querySelector(".login header");
loginHeader.addEventListener("click", () => {
wrapper.classList.add("active");
});
signupHeader.addEventListener("click", () => {
wrapper.classList.remove("active");
});
</script>
</section>
<script src="js/signup.js"></script>
<script src="js/login.js"></script>
</body>
</html>

View File

@ -14,19 +14,12 @@ router.get("/", async (req, res, next) => {
}
});
/*
1) req.body is taken from html form or wtv
2) bcrpyt and hash the password on the server side
3) pass to db
*/
router.post("/new", async (req, res, next) => {
// /user/register
router.post("/register", async (req, res, next) => {
try {
//pass pass to hashPassword
let hash = await hashPassword(req.body.password);
//add hash back to req.body
req.body.password = hash;
await addUser(req.body);
res.sendStatus(200);
console.log(req.body);
//await addUser(req.body);
//res.sendStatus(200);
} catch (error) {
console.error(error);
next(error);