Sie sind auf Seite 1von 13

const express = require('express');

const expressLayouts = require('express-ejs-layouts');

const mongoose = require('mongoose');

const passport = require('passport');

const flash = require('connect-flash');

const session = require('express-session');

const app = express();

// Passport Config

require('./config/passport')(passport);

// DB Config

const db = require('./config/keys').mongoURI;

// Connect to MongoDB

mongoose

.connect(

db,

{ useNewUrlParser: true }

.then(() => console.log('MongoDB Connected'))

.catch(err => console.log(err));

// EJS

app.use(expressLayouts);

app.set('view engine', 'ejs');

// Express body parser


app.use(express.urlencoded({ extended: true }));

// Express session

app.use(

session({

secret: 'secret',

resave: true,

saveUninitialized: true

})

);

// Passport middleware

app.use(passport.initialize());

app.use(passport.session());

// Connect flash

app.use(flash());

// Global variables

app.use(function(req, res, next) {

res.locals.success_msg = req.flash('success_msg');

res.locals.error_msg = req.flash('error_msg');

res.locals.error = req.flash('error');

next();

});

// Routes

app.use('/', require('./routes/index.js'));

app.use('/users', require('./routes/users.js'));
const PORT = process.env.PORT || 5000;

app.listen(PORT, console.log(`Server started on port ${PORT}`));

Pagina de inregristrare:

<div class="row mt-5">

<div class="col-md-8 m-auto">

<div class="card card-body">

<h1 class="text-center mb-3">

<i class="fas fa-user-plus"></i> Register

</h1>

<% include ./partials/messages %>

<div class="form-group">

<video id="video" style="display: inherit;" width="640" height="480" autoplay></video>

<canvas id="canvas" style="display: none;" width="640" height="480"></canvas>

<p id="opResult"></p>

<button id="snap" style="display: inherit;" class="btn btn-primary btn-block">

Snap

</button>

<button id="reset" style="display: none;" class="btn btn-primary btn-block">

Reset

</button>

</div>

<form action="/users/register" method="POST">

<div class="form-group">

<label for="name">Name</label>

<input

type="name"

id="name"
name="name"

class="form-control"

placeholder="Enter Name"

value="<%= typeof name != 'undefined' ? name : '' %>"

/>

</div>

<div class="form-group">

<label for="email">Email</label>

<input

type="email"

id="email"

name="email"

class="form-control"

placeholder="Enter Email"

value="<%= typeof email != 'undefined' ? email : '' %>"

/>

</div>

<div class="form-group">

<label for="gender">Gender</label>

<input

type="gender"

id="gender"

name="gender"

class="form-control"

placeholder="Enter gender"

value="<%= typeof gender != 'undefined' ? gender : '' %>"

/>

</div>

<div class="form-group">

<label for="age">Age</label>
<input

type="age"

id="age"

name="age"

class="form-control"

placeholder="Enter age"

value="<%= typeof age != 'undefined' ? age : '' %>"

/>

</div>

<div class="form-group">

<label for="glasses">Glasses</label>

<input

type="glasses"

id="glasses"

name="glasses"

class="form-control"

placeholder="Enter glasses"

value="<%= typeof glasses != 'undefined' ? glasses : '' %>"

/>

</div>

<div class="form-group">

<label for="beard">Beard</label>

<input

type="beard"

id="beard"

name="beard"

class="form-control"

placeholder="Enter beard"
value="<%= typeof beard != 'undefined' ? beard : '' %>"

/>

</div>

<button type="submit" class="btn btn-primary btn-block">

Register

</button>

</form>

<p class="lead mt-4">Have An Account? <a href="/users/login">Login</a></p>

</div>

</div>

</div>

<script>

var canvas = document.getElementById('canvas');

var context = canvas.getContext('2d');

// Get access to the camera!

if(navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {

navigator.mediaDevices.getUserMedia({ video: true }).then(function(stream) {

video.srcObject = stream;

video.play();

});

document.getElementById("reset").addEventListener("click", function() {

document.getElementById("video").style.display = "inherit";

document.getElementById("snap").style.display = "inherit";

document.getElementById("canvas").style.display = "none";
document.getElementById("reset").style.display = "none";

});

// Trigger photo take

document.getElementById("snap").addEventListener("click", function() {

context.drawImage(video, 0, 0);

document.getElementById("video").style.display = "none";

document.getElementById("snap").style.display = "none";

document.getElementById("canvas").style.display = "inherit";

document.getElementById("reset").style.display = "inherit";

AnonLog();

image = atob(canvas.toDataURL("image/jpeg").split("data:image/jpeg;base64,")[1]);

var length = image.length;

imageBytes = new ArrayBuffer(length);

var ua = new Uint8Array(imageBytes);

for (var i = 0; i < length; i++) {

ua[i] = image.charCodeAt(i);

DetectFaces(imageBytes);

});

//Calls DetectFaces API and shows estimated ages of detected faces

function DetectFaces(imageData) {

AWS.region = "us-east-1";

var rekognition = new AWS.Rekognition();

var params = {

Image: {

Bytes: imageData

},
Attributes: [

'ALL',

};

rekognition.detectFaces(params, function (err, data) {

if (err) console.log(err, err.stack); // an error occurred

else {

console.log(JSON.stringify(data));

console.log(canvas.toDataURL("image/jpeg").split("data:image/jpeg;base64,")[1]);

document.getElementById("gender").value = data.FaceDetails[0].Gender.Value;

document.getElementById("age").value = data.FaceDetails[0].AgeRange.Low;

document.getElementById("glasses").value = data.FaceDetails[0].Eyeglasses.Value;

document.getElementById("beard").value = data.FaceDetails[0].Beard.Value;

});

//Provides anonymous log on to AWS services

function AnonLog() {

// Configure the credentials provider to use your identity pool

AWS.config.region = 'us-east-1'; // Region

AWS.config.credentials = new AWS.CognitoIdentityCredentials({

IdentityPoolId: 'us-east-1:d079002e-ad6b-452c-959c-6b9feaef3342',

});

// Make the call to obtain credentials

AWS.config.credentials.get(function () {

// Credentials will be available when this function is called.

var accessKeyId = AWS.config.credentials.accessKeyId;

var secretAccessKey = AWS.config.credentials.secretAccessKey;


var sessionToken = AWS.config.credentials.sessionToken;

});

</script>

Pagina de Log In

<div class="row mt-5">

<div class="col-md-8 m-auto">

<div class="card card-body">

<h1 class="text-center mb-3"><i class="fas fa-sign-in-alt"></i> Login</h1>

<% include ./partials/messages %>

<div class="form-group">

<video id="video" style="display: inherit;" width="640" height="480" autoplay></video>

<canvas id="canvas" style="display: none;" width="640" height="480"></canvas>

<p></p>

<button id="snap" style="display: inherit;" class="btn btn-primary btn-block">

Snap

</button>

<button id="reset" style="display: none;" class="btn btn-primary btn-block">

Reset

</button>

</div>

<form action="/users/login" method="POST">

<div class="form-group">

<label for="email">Email</label>

<input

type="email"

id="email"

name="email"
class="form-control"

placeholder="Enter Email"

/>

</div>

<button type="submit" class="btn btn-primary btn-block">Login</button>

</form>

<p class="lead mt-4">

No Account? <a href="/users/register">Register</a>

</p>

</div>

</div>

</div>

<script>

var canvas = document.getElementById('canvas');

var context = canvas.getContext('2d');

// Get access to the camera!

if(navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {

navigator.mediaDevices.getUserMedia({ video: true }).then(function(stream) {

video.srcObject = stream;

video.play();

});

document.getElementById("reset").addEventListener("click", function() {

document.getElementById("video").style.display = "inherit";

document.getElementById("snap").style.display = "inherit";

document.getElementById("canvas").style.display = "none";
document.getElementById("reset").style.display = "none";

});

// Trigger photo take

document.getElementById("snap").addEventListener("click", function() {

context.drawImage(video, 0, 0);

document.getElementById("video").style.display = "none";

document.getElementById("snap").style.display = "none";

document.getElementById("canvas").style.display = "inherit";

document.getElementById("reset").style.display = "inherit";

AnonLog();

image = atob(canvas.toDataURL("image/jpeg").split("data:image/jpeg;base64,")[1]);

var length = image.length;

imageBytes = new ArrayBuffer(length);

var ua = new Uint8Array(imageBytes);

for (var i = 0; i < length; i++) {

ua[i] = image.charCodeAt(i);

DetectFaces(imageBytes);

});

//Calls DetectFaces API and shows estimated ages of detected faces

function DetectFaces(imageData) {

AWS.region = "us-east-1";

var rekognition = new AWS.Rekognition();

var params = {

Image: {

Bytes: imageData

},
Attributes: [

'ALL',

};

rekognition.detectFaces(params, function (err, data) {

if (err) console.log(err, err.stack); // an error occurred

else {

document.getElementById("opResult").innerHTML = JSON.stringify(data);

});

//Provides anonymous log on to AWS services

function AnonLog() {

// Configure the credentials provider to use your identity pool

AWS.config.region = 'us-east-1'; // Region

AWS.config.credentials = new AWS.CognitoIdentityCredentials({

IdentityPoolId: 'us-east-1:d079002e-ad6b-452c-959c-6b9feaef3342',

});

// Make the call to obtain credentials

AWS.config.credentials.get(function () {

// Credentials will be available when this function is called.

var accessKeyId = AWS.config.credentials.accessKeyId;

var secretAccessKey = AWS.config.credentials.secretAccessKey;

var sessionToken = AWS.config.credentials.sessionToken;

});

</script>

Das könnte Ihnen auch gefallen