I am trying to find a way to display my SQL database into a html page. I only want to use node.js and html and no PHP. Does anyone know how to do so.
The three approaches i attempted are the ones commented. In my JavaScript file.
Login.js
var mysql = require('mysql');
var express = require('express');
var session = require('express-session');
var bodyParser = require('body-parser');
var path = require('path');
const http = require('http');
var connection = mysql.createConnection({
host : 'localhost',
user : 'root',
password : '*********',
database : 'nodelogin'
});
var app = express();
app.use(session({
secret: 'secret',
resave: true,
saveUninitialized: true
}));
app.use(bodyParser.urlencoded({extended : true}));
app.use(bodyParser.json());
app.use(express.static('public'))
app.get('/' , function(request , response) {
response.sendFile(path.join(__dirname + '/signin.html'));
});
app.get('/auth', function(request, response) {
response.sendFile(path.join(__dirname + '/login.html'));
});
app.get('/admin', function(request, response) {
response.sendFile(path.join(__dirname + '/administrator.html'));
});
app.post('/auth', function(request, response) {
var username = request.body.username;
var password = request.body.password;
if (username && password) {
connection.query('SELECT * FROM accounts WHERE username = ? AND password = ?', [username, password], function(error, results, fields) {
if (results.length > 0) {
request.session.loggedin = true;
request.session.username = username;
response.redirect('/home');
} else {
response.send('Incorrect Username and/or Password!');
}
response.end();
});
} else {
response.send('Please enter Username and Password!');
response.end();
}
});
app.post('/signinCheck' , function(request,response){
var username = request.body.username;
var password = request.body.password;
var email = request.body.email;
if (username && password && email) {
var sql = `INSERT INTO accounts
(
username, password, email
)
VALUES
(
?, ?, ?
)`;
connection.query(sql, [username, password, email], function(error, results, fields) {
response.send('Please sign in to view this page!')
connection.end();
});
}
});
app.get('/home', function(request, response) {
if (request.session.loggedin) {
response.send('Welcome back, ' + request.session.username + '!');
} else {
response.send('Please login to view this page!');
}
response.end();
});
// // app.get('/adminview',(request, result) => {
// // connection.connect(function(err) {
// // if(err) throw err;
// // else {
// // connection.query("SELECT * FROM accounts",(err, result) => {
// // var table = '';
// // for(var i=0; i<result.length; i++){
// // table += '<tr><td>' + (i+1) + '</td><td>' +
// // }
// // if(err) {
// // console.log(err);
// // res.json({"error":true});
// // }
// // else {
// // console.log(result);
// // res.json(result);
// // }
// // });
// // }
// // });
// // });
// // app.get('/table', function(request, response) {
// // connection.connect(function(error){
// // if(error) throw error;
// // else {
// // connection.query("SELECT * FROM accounts",(error, result) => {
// // var table = '';
// // for(var i=0; i<result.length; i++){
// // table += '<tr><td>' + (i+1) + '</td><td>' + result[i].username + '</td><td>' + result[i].password + '</td><td>' + result[i].email + '</td><td>';
// // }
// // connection.end();
// // });
// // }
// // });
// // });
// // app.get('/rows', function (req, res) {
// // connection.connect();
// // connection.query('SELECT * FROM accounts', function(err, rows, fields)
// // {
// // connection.end();
// // if (err) throw err;
// // res.json(rows);
// // });
// // });
app.listen(3000) ;
administrator.html
<!DOCTYPE html>
<html>
<head>
<title>My db rows</title>
</head>
<body>
<div id="table"></div>
<script type="text/javascript">
var opts = {
url: 'http://localhost:3000/rows/'
};
fetch(opts)
.then((res) => {
if (res.ok) {
return res.json();
}
})
.then((rows) => {
for (let row of rows) {
// row will be a mysql row -- you can loop over these and do what you want with them
}
})
.catch(console.log);
</script>
</body>
</html>
<!-- <html>
<body>
<form action="/table" method="get" style="background-color:#999da3; padding:14px 16px;">
</form>
</body>
</html> -->
https://marplo.net/addons/javascript/nodejs/mysql_select_table.png
The link of the photo is what I would like.
Aucun commentaire:
Enregistrer un commentaire