I am trying to login as admin using mobile device and after successful login, I am setting cookie in response header. Mean while, when I try to access routes from other device(laptop), I get all admin access from other device.
How do I maintain session for multiple users ?
Also the problem is I am trying to maintain the view state in global object(login/logout button based on if user in logged-in or not) which get lost with server-side rendering.
I mean all the JavaScript variable data(DataMixin object in my case) is lost.
How to develop isomorphic riotjs app? See similar issue fixed in reactJs: https://github.com/reactjs/react-chartjs/issues/57
State:
document.addEventListener('DOMContentLoaded', function (e) {
DataMixin = { //Global object
setAuthentication: function(){
if(arguments[0] != null){
localStorage.setItem('role', arguments[0][0]);
localStorage.setItem('loginStatus', arguments[0][1]);
}
},
getRole: function(){
return localStorage.getItem('role');
},
}
}
View:
ADMIN LOGIN
<li if="{DataMixin.getRole() == 'ROLE_ADMIN'}">
<a onclick="{logout}">LOGOUT</a>
</li>
Loading pages from server-side using node+express:
function urlDataApiResponse(url, params, req, res) {
swig = require('swig');
var header_tag = require('./public_html/tags/header_tag.tag');
var blog_post_details_tag = require('./public_html/tags/blog_post_details.tag');
var footer_tag = require('./public_html/tags/footer_tag.tag');
var blog_sidebar_tag = require('./public_html/tags/blog_sidebar.tag');
var slide_menu_tag = require('./public_html/tags/slide_menu.tag');
app.engine('html', swig.renderFile);
app.set('view engine', 'html');
app.set('views',__dirname + '/public_html/tags/');
var postDetails = {};
console.log('url inside getApiResponse ', url);
var options = {
method: 'GET',
uri: url,
qs: params,
headers: {
'User-Agent': 'Request-Promise'
},
json: true // Automatically parses the JSON string in the response
};
rp(options)
.then(function (response) {
createJWT(req,res);
var postDetails, categories, blog_sidebar_tag_rendered, slide_menu_tag_rendered,
header_tag_rendered, blog_tag_rendered, footer_tag_rendered;
postDetails = (response[0].attributes);
console.log('.............................................................');
console.log('.............SERVER-SIDE-RENDERING:START.....................');
console.log('.............................................................');
header_tag_rendered = riot.render(header_tag, {role: storage.getItemSync('role'), loginStatus: storage.getItemSync('loginStatus') });
slide_menu_tag_rendered = riot.render(slide_menu_tag, {role: storage.getItemSync('role'), loginStatus: storage.getItemSync('loginStatus') });
blog_tag_rendered = riot.render(blog_post_details_tag, {details: postDetails, role: storage.getItemSync('role')});
blog_sidebar_tag_rendered = riot.render(blog_sidebar_tag);
footer_tag_rendered = riot.render(footer_tag);
var meta_details = {
postImageUrl: postDetails.userImage,
title: postDetails.title + " - Rootscopeit.in",
description: postDetails.details.substring(0,200)+"...",
details: postDetails.details,
url: postDetails.url
};
res.render('blog_post_details', {
open_graph: meta_details,
header_details: header_tag_rendered,
slide_details: slide_menu_tag_rendered,
article_details: blog_tag_rendered,
sidebar_details: blog_sidebar_tag_rendered,
footer_details: footer_tag_rendered});
console.log('............................................................');
console.log('............SERVER-SIDE-RENDERING:END.......................');
console.log('............................................................');
})
.catch(function (err) {
console.log('=================================');
console.error('POST error ', err.stack);
console.log('=================================');
return res.status(res.statusCode).send(err);
});
}
Setting cookie in passport js:
//==============
//TOKEN CREATION
//==============
function createJWT(req, res){
var claims = {
sub: 'Social Authentication',
iss: 'https://rootscopeit.in',
};
var jwt = nJwt.create(claims, secretKey);
jwt.setExpiration(new Date().getTime() + (60 * 60 * 1000 * 1)); // One hour from now
var token = jwt.compact();
var cookies = new Cookies(req, res).set('access_token', token, {
//httpOnly: true,
//secure: true // for your production environment
});
}
//=======================================
//===Google Authentication
//=======================================
var passport = require('passport');
var GoogleStrategy = require('passport-google-oauth20').Strategy;
app.use(passport.initialize());
app.use(passport.session());
passport.serializeUser(function (user, done) {
done(null, user);
});
passport.deserializeUser(function (obj, done) {
var user = USERS[id];
done(null, user);
});
app.get('/auth/google', passport.authenticate('google',
{scope: ['profile', 'https://www.googleapis.com/auth/plus.login',
'https://www.googleapis.com/auth/plus.profile.emails.read',
'https://www.googleapis.com/auth/blogger']}));
app.get('/auth/google/callback', passport.authenticate('google', {failureRedirect: '/', failureFlash: true}),
function (req, res) {
console.log('success authentication');
createJWT(req,res);
res.send(popupTools.popupResponse(req.user));
}
);
Related
I'm very new to the concept of API and nodejs. I have a task to create a simple agent that accesses users events on google calendar to remind him on his upcoming event, but I have been struggling with this error "Error: No access, refresh token or API key is set". I have followed a guide on how to authorize and retrieve the access token but it seems to not work.
Here is my main.js file:
const google = require('googleapis').google;
const dfff = require('dialogflow-fulfillment')
const app = express();
const googleConfig = {
clientId: 'xxxxxxxxxxxx',
clientSecret: 'xxxxxxxxxxxx',
redirect: 'https://d5242f9e0cb4.ngrok.io'
};
function createConnection() {
return new google.auth.OAuth2(
googleConfig.clientId,
googleConfig.clientSecret,
googleConfig.redirect
);
}
const defaultScope = [
'https://www.googleapis.com/auth/calendar.readonly'
];
function getConnectionUrl(auth) {
return auth.generateAuthUrl({
access_type: 'offline',
prompt: 'consent', // access type and approval prompt will force a new refresh token to be made each time signs in
scope: defaultScope
});
}
function urlGoogle() {
const auth = createConnection(); // this is from previous step
const url = getConnectionUrl(auth);
return url;
}
// Setting up EJS Views
app.set('view engine', 'ejs');
app.set('views', __dirname);
app.get('/', function (req, res) {
const url = urlGoogle()
return res.render("index", { loginLink: url });
});
app.get('/auth_callback', function (req, res) {
// Create an OAuth2 client object from the credentials in our config file
const OAuth = createConnection()
//if (req.query.error) {
// The user did not give us permission.
//return res.redirect('/error');
//} else {
const {tokens} = OAuth.getToken(code)
OAuth.setCredentials({
access_token: tokens.access_token,
refresh_token: tokens.refresh_token,
expiry_date: (new Date()).getTime() + (1000 * 60 * 60 * 24 * 7)
});
return res.redirect('/');
//});
//}
});
app.post('/', express.json(),(req,res)=>{
const calendar = google.calendar({version: 'v3' , auth:createConnection()});
const agent = new dfff.WebhookClient({
request : req,
response : res
})
function welcome(agent){
agent.add("Hi, I'm Rem. Please click on remind me button if you want to be reminded on your upcoming events!")
}
function listEvents(agent){
return calendar.events.list({
'calendarId': 'primary',
'auth':createConnection(),
'timeMin': (new Date()).toISOString(),
'showDeleted': false,
'singleEvents': true,
'maxResults': 1,
'singleEvents': true,
'orderBy': 'startTime'
}).then((err,response)=> {
let events = response.result.items;
if (events.length !== 0) {
var event = events[i];
var when = event.start.dateTime;
if (!when) {
when = event.start.date;
}
agent.add('Be ready for '+ event.summary + ' event '+ 'at ' + when )
}
else {
agent.add('You dont have any upcoming events.');
}
});
}
let intenMap = new Map()
intenMap.set('Default_Welcome_Intent',welcome)
intenMap.set('Remind_me',listEvents)
agent.handleRequest(intenMap)
});
// Listen on the port defined in the config file
app.listen("3002", function () {
console.log(`Listening on port 3002`);
});
What could I be missing??
I have a Node.js backend server which uses JWT for authentication. While building the frontend for the app when I send a login request and receive the token I store it in the localStorage of the browser, after that I want to redirect to the dashboard but the problem I am facing is that since the dashboard route is protected it requires the token but Js redirect method doesn't allow any headers. So, how should I be tackling this problem ?
const submit = document.getElementById("submit");
if (!localStorage.getItem("token"))
localStorage.setItem("token", "");
submit.addEventListener('click' , (e) => {
const email = document.getElementById("email").value;
const password = document.getElementById("password").value;
e.preventDefault();
const data = {
email,
password
}
axios.post('/api/user/login', data)
.then((res) => {
document.getElementById('login_form').reset();
console.log(res.data);
if (res.data.success) {
localStorage.setItem("token", res.data.token);
document.window.location.href = '/organizer/dashboard';
}
})
.catch((err) => {
console.log(err);
})
});
The JSON received after a successful login request :
{
"success": true,
"token": "Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6IjViNTQzMWE1OTA0ZjkzMDQwOWM2OWU0NCIsIm5hbWUiOiJyYXNpayByYWoiLCJlbWFpbCI6ImZpc3J0QGdtYWlsLmNvbSIsImFjY190eXBlIjoib3JnYW5pc2VyIiwiaWF0IjoxNTMyMjQ4Mjc3LCJleHAiOjE1MzIyNTE4Nzd9.RHBMlVXXo-1YpwxnJbPdZ2VJ6Yt7aqTNJ3o6OzbXk4M"
}
Here is an example of a custom middleware and its usage.
Creating the token and setting it in a cookie:
function createAuthToken(id, agent, guidUser) {
var sign = config[env].signature;
var package = { 'device': id, 'access': 'authenticated', 'agent': agent, 'user': guidUser }
return jwt.sign(package, sign, { expiresIn: '90 days' });
};
app.post('/authenticate', function (req, res) {
var body = req.body;
var updatedToken = createAuthToken(body.device, body.userAgent, body.user);
var newDate = new Date();
var expDate = newDate.setMonth(newDate.getMonth() + 3)
res.cookie('id', updatedToken, { sameSite: true, maxAge: expDate });
res.send({ Success: true})
});
Middleware (Nodejs):
function authenticateRoute(req, res, next) {
var token = req.cookies["id"];
var sign = config[env].signature;
jwt.verify(token, sign, function (err, decoded) {
if (err || !decoded) {
console.log("invalid token");
res.send(403);
}
else if (decoded && (!decoded.access || decoded.access == "unauthenticated")) {
console.log("unauthenticated token");
res.send(403);
}
else if (decoded && decoded.access == "authenticated") {
console.log("valid token")
next();
}
else {
console.log("something suspicious")
res.send(403);
}
});
};
Then on all routes you want to use this authentication:
app.post('/authedcall', authenticateRoute, function (req, res) {
res.send({ Success: true })
});
app.post('/unauthedcall', function (req, res) {
res.send({ Success: true })
});
Authenticated Routes:
app.use('/loginroute', express.static(__dirname + "/login")); //no auth
app.use('/dashboard', authenticateRoute, express.static(__dirname + "/dash")); //auth route
I think you’re looking for this....
<Switch>
<PrivateRoute exact path="/dashboard" component={Dashboard} />
</Switch>
You can wrap your private route in switch and then just put the path you want it to go if it’s authenticated and what component to load
Check this out this will be helpful
privateroute
I am making an iOS project which uses Stripe. I am using a STPCustomerContext and the parameter to create an instance is an object of MainAPI below. When I create the instance, it automatically calls createCustomerKey() but an error (404) is throwing. The URL is "http://localhost:1337/ephemeral_keys" and I believe that is what I have everywhere but yet it is throwing a 404. Here is the code for MainAPI.swift, index.js, & api.js.
The code is:
MainAPI.swift
class MainAPI:NSObject, STPEphemeralKeyProvider {
// override init(){}
static let shared = MainAPI()
var baseURLString = Constants.BASE_URL
// MARK: STPEphemeralKeyProvider
enum CustomerKeyError: Error {
case missingBaseURL
case invalidResponse
}
func createCustomerKey(withAPIVersion apiVersion: String, completion: #escaping STPJSONResponseCompletionBlock) {
// the request
func request(id: String) {
print("creating a eph key request with customerId: \(id)") // good
let url = self.baseURLString.appending("/ephemeral_keys")
Alamofire.request(url, method: .post, parameters: [
"api_version": apiVersion,
"customerId": id
])
.validate(statusCode: 200..<300)
.responseJSON { responseJSON in
switch responseJSON.result {
case .success(let json):
print("created customer ephemeral key!")
completion(json as? [String: AnyObject], nil)
case .failure(let error):
print("could not customer ephemeral key!\n Error info: ")
print(error.localizedDescription)
completion(nil, error)
}
}
}
print("attempting to create customer ephemeral key . . .(createCustomerKey())")
let customerId = . . . // get customer id
request(id: costumerId) // this passes on the CORRECT customerId each time
}
}
api.js
var express = require('express')
var router = express.Router()
var stripe_key = process.env.STRIPE_KEY || "sk_test_myTestKey"
var stripe = require('stripe')(stripe_key);
var request = require("request-promise-native")
//API
router.get('/', function (req, res) {
res.status(200).send(JSON.stringify({ message: 'API Gateway', success: true, error: null }));
}) // Just for testing, just for error-handling
//1. Create a customer account
router.post('/new_customer', function (req, res) {
console.log("Creating new customer account...")
var body = req.body
stripe.customers.create({ email: body.email, })
.then((customer) => {
console.log(customer)
// Send customerId -> Save this for later use
res.status(200).send(JSON.stringify({ success: true, error: null, customerId: customer.id }));
})
.catch((err) => {
console.log(err)
res.status(400).send(JSON.stringify({ success: false, error: err }))
});
})
//2. Save Credit Card with token
router.post('/new_card', function (req, res) {
var customerId = req.body.customerId
var token = req.body.token
stripe.customers.update(customerId, { source: token })
.then((customer) => {
console.log(customer)
res.status(200).send(JSON.stringify({ success: true, error: null }));
})
.catch((err) => {
console.log(err)
res.status(400).send(JSON.stringify({ success: false, error: err }))
});
})
//3. Use customerId to post a charge
router.post('/new_charge', function (req, res) {
var customerId = req.body.customerId
var amount = req.body.amount
var source = req.body.source
stripe.charges.create({
amount: amount, //in cents
currency: "usd",
customer: customerId, //CUSTOMER_STRIPE_ACCOUNT_ID
source: source, // obtained with Stripe.js
}).then((charge) => {
res.status(200).send(JSON.stringify({ message: 'Sucess.', success: true, error: null }));
}).catch((error) =>{
res.status(400).send(JSON.stringify({ message: 'Error', success: false, error: error }));
})
})
// here is the error I am assuming
router.post('/ephemeral_keys', (req, res) => {
const stripe_version = req.body.api_version;
var customerId = req.body.customerId;
if (!stripe_version) {
res.status(400).end();
return;
}
console.log(stripe_version)
// This function assumes that some previous middleware has determined the
// correct customerId for the session and saved it on the request object.
stripe.ephemeralKeys.create(
{customer: customerId},
{stripe_version: stripe_version}
).then((key) => {
console.log("Ephemeral key: " + key)
res.status(200).json(key);
res.status(200).send(JSON.stringify({ message: 'AAAAhh', success: true, error: null }));
}).catch((err) => {
console.log("Ephemeral key error: " + err)
res.status(200).send(JSON.stringify({ message: 'ABBBBBB', success: true, error: null }));
res.status(500).end();
});
});
module.exports = router;
index.js
//Environment Vars
var uri = process.env.NODE_ENV || "development"
console.log(uri + " environment")
//Express App
var express = require('express');
var app = express();
//Api for reading http post request body in express
var bodyParser = require('body-parser');
app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json())
//Log Connections
app.use(function timeLog (req, res, next) {
console.log('incoming connection . . . ')
next()
})
//API middelware
var api = require('./api')
app.use('/api', api)
app.get('/', function (req, res) {
res.status(200).send(JSON.stringify({ message: 'Welcome!', success: true, error: null }));
});
//Create Server
var port = process.env.PORT || 1337;
var httpServer = require('http').createServer(app);
httpServer.listen(port, function () {
console.log('server running on port ' + port + '.');
});
When I create a STPCustomerContext (like this):
let apiKeyObject = MainAPI.shared
customerContext = STPCustomerContext(keyProvider: apiKeyObject)
The following error prints (not allowing the STPPaymentContext later to display):
Response status code was unacceptable: 404.
Please try with the below nodejs code, because syntax which your code is using might not be correct, I was using the same code as you, but later changed the implementation & deployed to firebase CLI
exports.createEphemeralKeys = functions.https.onRequest((req, res) => {
var api_version = req.body.api_version;
var customerId = req.body.customerId;
if (!api_version) {
res.status(400).end();
return;
}
stripe.ephemeralKeys.create(
{ customer: customerId },
{ stripe_version: api_version },
function(err, key) {
return res.send(key);
});
});
You might get below kind of logs.
{
id: 'ephkey_1BramAFjruqsvjkVQGdZLiV5',
object: 'ephemeral_key',
associated_objects: [ { type: 'customer', id: 'cus_CEPMtLbshv7EaP' } ],
created: 1517701830,
expires: 1517705430,
livemode: false,
secret: 'ek_test_YWNjdF8xQmxUb0FGanJ1cXN2amtWLHVPcUdMN3d4UEhncW1sQkNJYmlOdzhwUGdjVUxOd1Y'
}
For .swift file
Please Click here
Please have a look at https://www.youtube.com/watch?v=NdszUvzroxQ
I believe you need to use some remote server, instead of local server,
In my Swift file I am using .responseString instead of .responseJSON by this is I am getting success but the response is a HTML file of requesting Google Signin
I am having a hard time wondering why, when i access my HTTP server http://localhost:8000/, i get a "Cannot GET /" message. I use express js for routing server side and angular at client-side.
I have read that this error is there because i haven't set a route for "/" path, but i don't want to route anything there, just want to let my angular handle "/".
FYI, my express server is in a different path than the angular app.
MY node code:
var bcrypt = require('bcryptjs');
var bodyParser = require('body-parser');
var cors = require('cors');
var express = require('express');
var jwt = require('jwt-simple');
var moment = require('moment');
var mongoose = require('mongoose');
var path = require('path');
var request = require('request');
var compress = require('compression');
var config = require('./config');
var User = mongoose.model('User', new mongoose.Schema({
instagramId: { type: String, index: true },
email: { type: String, unique: true, lowercase: true },
password: { type: String, select: false },
username: String,
fullName: String,
picture: String,
accessToken: String
}));
mongoose.connect(config.db);
var app = express();
app.set('port', process.env.PORT || 8000);
app.use(compress());
app.use(cors());
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(express.static(path.join(__dirname, 'public'), { maxAge: 2628000000 }));
/*
|--------------------------------------------------------------------------
| Login Required Middleware
|--------------------------------------------------------------------------
*/
function isAuthenticated(req, res, next) {
if (!(req.headers && req.headers.authorization)) {
return res.status(400).send({ message: 'You did not provide a JSON Web Token in the Authorization header.' });
}
var header = req.headers.authorization.split(' ');
var token = header[1];
var payload = jwt.decode(token, config.tokenSecret);
var now = moment().unix();
if (now > payload.exp) {
return res.status(401).send({ message: 'Token has expired.' });
}
User.findById(payload.sub, function(err, user) {
if (!user) {
return res.status(400).send({ message: 'User no longer exists.' });
}
req.user = user;
next();
})
}
/*
|--------------------------------------------------------------------------
| Generate JSON Web Token
|--------------------------------------------------------------------------
*/
function createToken(user) {
var payload = {
exp: moment().add(14, 'days').unix(),
iat: moment().unix(),
sub: user._id
};
return jwt.encode(payload, config.tokenSecret);
}
/*
|--------------------------------------------------------------------------
| Sign in with Email
|--------------------------------------------------------------------------
*/
app.post('/auth/login', function(req, res) {
User.findOne({ email: req.body.email }, '+password', function(err, user) {
if (!user) {
return res.status(401).send({ message: { email: 'Incorrect email' } });
}
bcrypt.compare(req.body.password, user.password, function(err, isMatch) {
if (!isMatch) {
return res.status(401).send({ message: { password: 'Incorrect password' } });
}
user = user.toObject();
delete user.password;
var token = createToken(user);
res.send({ token: token, user: user });
});
});
});
/*
|--------------------------------------------------------------------------
| Create Email and Password Account
|--------------------------------------------------------------------------
*/
app.post('/auth/signup', function(req, res) {
User.findOne({ email: req.body.email }, function(err, existingUser) {
if (existingUser) {
return res.status(409).send({ message: 'Email is already taken.' });
}
var user = new User({
email: req.body.email,
password: req.body.password
});
bcrypt.genSalt(10, function(err, salt) {
bcrypt.hash(user.password, salt, function(err, hash) {
user.password = hash;
user.save(function() {
var token = createToken(user);
res.send({ token: token, user: user });
});
});
});
});
});
/*
|--------------------------------------------------------------------------
| Sign in with Instagram
|--------------------------------------------------------------------------
*/
app.post('/auth/instagram', function(req, res) {
var accessTokenUrl = 'https://api.instagram.com/oauth/access_token';
var params = {
client_id: req.body.clientId,
redirect_uri: req.body.redirectUri,
client_secret: config.clientSecret,
code: req.body.code,
grant_type: 'authorization_code'
};
// Step 1. Exchange authorization code for access token.
request.post({ url: accessTokenUrl, form: params, json: true }, function(error, response, body) {
// Step 2a. Link user accounts.
if (req.headers.authorization) {
User.findOne({ instagramId: body.user.id }, function(err, existingUser) {
var token = req.headers.authorization.split(' ')[1];
var payload = jwt.decode(token, config.tokenSecret);
User.findById(payload.sub, '+password', function(err, localUser) {
if (!localUser) {
return res.status(400).send({ message: 'User not found.' });
}
// Merge two accounts. Instagram account takes precedence. Email account is deleted.
if (existingUser) {
existingUser.email = localUser.email;
existingUser.password = localUser.password;
localUser.remove();
existingUser.save(function() {
var token = createToken(existingUser);
return res.send({ token: token, user: existingUser });
});
} else {
// Link current email account with the Instagram profile information.
localUser.instagramId = body.user.id;
localUser.username = body.user.username;
localUser.fullName = body.user.full_name;
localUser.picture = body.user.profile_picture;
localUser.accessToken = body.access_token;
localUser.save(function() {
var token = createToken(localUser);
res.send({ token: token, user: localUser });
});
}
});
});
} else {
// Step 2b. Create a new user account or return an existing one.
User.findOne({ instagramId: body.user.id }, function(err, existingUser) {
if (existingUser) {
var token = createToken(existingUser);
return res.send({ token: token, user: existingUser });
}
var user = new User({
instagramId: body.user.id,
username: body.user.username,
fullName: body.user.full_name,
picture: body.user.profile_picture,
accessToken: body.access_token
});
user.save(function() {
var token = createToken(user);
res.send({ token: token, user: user });
});
});
}
});
});
app.get('/api/feed', isAuthenticated, function(req, res) {
var feedUrl = 'https://api.instagram.com/v1/users/self/feed';
var params = { access_token: req.user.accessToken };
request.get({ url: feedUrl, qs: params, json: true }, function(error, response, body) {
if (!error && response.statusCode == 200) {
res.send(body.data);
}
});
});
app.get('/api/media/:id', isAuthenticated, function(req, res) {
var mediaUrl = 'https://api.instagram.com/v1/media/' + req.params.id;
var params = { access_token: req.user.accessToken };
request.get({ url: mediaUrl, qs: params, json: true }, function(error, response, body) {
if (!error && response.statusCode == 200) {
res.send(body.data);
}
});
});
app.post('/api/like', isAuthenticated, function(req, res) {
var mediaId = req.body.mediaId;
var accessToken = { access_token: req.user.accessToken };
var likeUrl = 'https://api.instagram.com/v1/media/' + mediaId + '/likes';
request.post({ url: likeUrl, form: accessToken, json: true }, function(error, response, body) {
if (response.statusCode !== 200) {
return res.status(response.statusCode).send({
code: response.statusCode,
message: body.meta.error_message
});
}
res.status(200).end();
});
});
app.listen(app.get('port'), function() {
console.log('Express server listening on port ' + app.get('port'));
});
In that case, then you should catch all the routes in / to angular.
Put this code at the very last of your route definitions before error handlers.
app.get('*', function (req, res) {
res.sendFile('/path/to/angular/index.html');
});
As you are using Angular for your web app, you would want your express server to serve all the files related to the front-end so when you land on the link "http://localhost:8000/", Express would serve the related files back. This folder would include .js, .css and .html files as well as all the other resources (images, videos etc.) so you can link them in your markup. (eg link href="/logo.png").
You can serve these files using Express by telling express to use the Static Middleware.
Using the Middleware, you would tell Express to serve the contents of a specific folder as static resources. Putting your Angular App in the folder would then let Angular handle the routes.
var publicFolder = path.join(__dirname, '../client')
app.use(express.static(publicFolder);
You would register other endpoints to create an API for your web app. So express server would be able to provide data to the Angular app through those endpoints.
So, I've been struggling with these for a couple of hours now. The session won't get sent to server when I use AJAX to POST something to the server, but it works fine without AJAX, like clicking links, logout, etc and this is makes me pulling my hair in frustration. Anyway, these are my codes:
var express = require('express'), // express 4
mongoskin = require('mongoskin'),
Busboy = require('busboy'),
cookieParser = require('cookie-parser'),
session = require('express-session'),
mailer = require('nodemailer'),
compress = require('compression'),
morgan = require('morgan'),
ect = require('ect'),
suspend = require('suspend'),
MongoStore = require('connect-mongo')(session);
app.use(compress());
app.engine('.ect', renderer.render);
app.set('env', 'development');
app.use(express.static(__dirname + '/public'));
app.use(cookieParser());
app.use('/admin', session({
secret : 'qlauwork secret yo',
name : 'qlauworks.sess',
proxy : true,
rolling : true,
cookie : {
maxAge : 1000 * 60 * 60 * 6
},
store : new MongoStore({
db : 'qlauworks',
auto_reconnect : true,
defaultExpirationTime : 1000 * 60 * 60 * 6
}),
unset : 'destroy'
}));
// ... etc etc
app.post('/admin/login', function (req, res) {
var msg = {};
var busboy = new Busboy({ headers : req.headers });
busboy.on('field', function (fieldName, val) {
msg[fieldName] = val;
});
busboy.on('finish', function () {
suspend.run(function * () {
msg.password = crypto.createHash('whirlpool').update(SALT).update(msg.password).digest('hex');
var user = yield db.users.findOne({ username : msg.username, password : msg.password }, suspend.resume());
if (!user) {
return res.json({ error : 'Wrong username or password' });
}
// create session token
var token = yield crypto.randomBytes(32, suspend.resume());
token = token.toString('hex');
yield db.users.update({ username : msg.username }, { $set : { token : token } }, { upsert : true }, suspend.resume());
req.session.token = token;
res.redirect('/admin/forms');
}, function (err) {
if (err) {
console.log('login: ', err);
res.send('Server error');
}
});
});
req.pipe(busboy);
});
// this is the logout and forms, works just fine
app.get('/admin/logout', auth, function (req, res) {
suspend.run(function * () {
var token = req.session.token;
yield db.users.update({ token : token }, { $unset : { token : true } }, suspend.resume());
delete req.session.token;
req.session.destroy(function (err) {
if (!err) {
res.clearCookie('qlauworks.sess', { path : '/' });
res.redirect('/admin');
}
});
}, function (err) {
if (err) {
console.log('logout: ', err);
res.json({ error : 'Server error' });
}
});
});
app.get('/admin/forms', auth, function (req, res) {
res.send(formPage);
});
// and this is the auth middleware, could logout and moving around the admin page
// but req.session always undefined if comes from an AJAX request
function auth (req, res, next) {
suspend.run(function * () {
console.log(req.session);
console.log('=====================================================')
if (!req.session.token) {
return res.json({ error : 'Invalid token' });
}
var user = yield db.users.findOne({ token : req.session.token }, suspend.resume());
if (!user.username) {
return res.json({ error : 'Invalid token' });
}
next();
}, function (err) {
if (err) {
console.log('auth: ', err);
res.json({ error : 'Server error' });
}
});
}
and this is the client side
$.post('/api/item/new', elem, function (rep) {
thisForm.find('input[type="submit"]').attr('disabled', false);
if (rep.error) {
$('#alert-multi').removeClass('success').addClass('alert').text(rep.error);
} else {
$('#alert-multi').removeClass('alert').addClass('success').text('Success');
$('input[type="reset"]').click();
for (var i = 0; i < len; i++) {
$('#preview-multi' + i).attr('src', '');
$('#multi' + i).attr('data-image-src', '');
}
}
});
So, how do I solve this?
It looks like you mounted the session middleware on /admin but you're trying to call /api/item/view.
That won't work as using express.use(path, middleware) will invoke middleware only for requests whose req.url contains path.
Either mount the session middleware on / (by not using path parameter - simple express.use(middleware) will do), or change your ajax url to start with /admin (probably not something you want to do).