I am writing a realtime app. The basic principle is like a chat, but instead of text messages, users share youtube videos. The backend hasn't been completely done yet, and I don't know how I will do it. But I have some questions for what has been done.
Right now, user authentication with user/pass, FB, Twitter works well, and credentials are being stored in my db. User sign in works fine as well. Error messages get flashed fine.
I'm using mongodb (mongoose) and express on the backend. It is not an API based design because I don't know how to work with user authentication in API's (I can make GET/POST/PUT/DELETE API, just don't know how to fit in authentication in there).
When a user, say, signin's using the homepage, the credentials are verified using req.body.<field> in an express.js route. If authenticated, redirect the user to a dashboard, else redirect to signin with flash messages. So, there are no Ajax calls, and right now, the app isn't realtime in any way. I'd like it to be realtime though.
So, leading to that, I have 3 questions:
I am using a modal window (bootstrap), to ask the user to update profile. The modal shows fine, except the field I want to be shown are not shown. The password and email fields are empty, even though I have a value attribute.
input.form-control.dash(type="password", name="newuserpassword", ng-minlength=8, ng-model="password", value="__USE_EXISTING__")
input.form-control.dash(type="email", name="newuseremail", required=true, ng-model="email", value=user.email)
http://snappy-app.com/s/read.php?pass=9fc7ffa1e2b2140aad5232d5733f4caf
I want that when user edits the "Save" button, a message in the modal should either how any errors, or show that the update was successful. As it is, right now, my update method doesn't do this. Beyond redirecting the user, I don't know how can I achieve what I want.
exports.update_user = function(req, res) {
var user = new User({
'username' : req.user.username,
'password': req.body.newuserpassword || ,
'email': req.body.newuseremail
});
console.log(user);
user.save(function(err) {
if (err) {
console.log(err);
for (var field in err.errors) {
var error = err.errors[field].message;
req.flash('error', error);
}
res.redirect('/dashboard');
} else {
req.logIn(user, function (err) {
if (!err) {
req.flash('success', 'Done!');
} else {
req.flash('error', 'Something went wrong.');
}
});
}
});
}
After the user updates the values by clicking "Save", the modal will close. The user can still click on the "Edit" link to change values yet again, and the modal will open. Now, based on what I have read, the user won't see the changes, because there hasn't been a page/modal reload. How do I make sure that the user sees updated values?
Any help is appreciated.
When I read your text, I think:
"Hum, he tried to make an Ajax call and let the view display the errors or go on"
When I read your code, I think:
"Hum, it's a synchrone "give me all the page" call"
Which version do you want?
The Async one? So we can explain you the Ajax principle and your real problem is an UI update.
The Sync one? It's definitively an UI problem, and you should add a tag for it.
Related
Im currently working on a side project with firebase on web and it uses user auth. I have the user logging in and then creating a game room which redirects to a separate page for the game "room". After the page redirects though i cannot pull any of the users data and the only way that im doing it is by re initializing firebase and using
auth.onAuthStateChanged(function(user) {
if (user && user != null) {
uid = user.uid;
email = user.email;
currUser = user;
} else {
//user isnt logged in
window.location.href = 'index.html';
}
There seems to probably be an easier way to do this but i cant seem to get it working and this way also messes up sections of my other code.
Attaching an onAuthStateChanged callback is the idiomatic way to get the user.
You can also get the user with firebase.auth().currentUser. But if a token refresh is required, you may in that case mis-detect that there is no user. That why an onAuthStateChanged callback is recommended.
See the Firebase documentation on getting the current user.
New to Meteor, I'm using the alanning:roles package to handle roles.
I've managed to be able to only publish a collection when a user is logged in, when the page is first refreshed.
Meteor.publish('col', function(){
if (Roles.userIsInRole(this.userId, 'admin')) {
console.log('authed');
return Sessions.find({});
} else {
console.log('not auth');
// user unauthorized
this.stop();
return;
}
});
Logging out kills access to the collection (I'm using mongol to see). Logging back in after logging out, or logging in from a logged out state when the page is first loaded, will not give me access.
The webapp I'm trying to build is something like an ticketing system. I'm trying to be secure, so no unnecessary publishing if the user is not authorized.
What I'm trying to do is, get ticket information submitted from users from a collection, and display it on the client screen (as long as the client is authorized first). Maybe a better way to handle this is to force a refresh (how do I do that?) after a user change so unauthorized users are "kicked" out? And render all relevant data from the private collection right after the user is authorized?
I actually managed to get what I want for now with helpers...
In my ./client/Subs.js file:
Meteor.subscribe('col');
Template.NewTicket.helpers({ // match the template name
// move this into method later, not secure because on client??
isAdmin() {
console.log('is admin.');
console.log(Meteor.userId());
Meteor.subscribe('col');
return Roles.userIsInRole(Meteor.userId(), 'admin');
},
});
and then somewhere in my template file ./client/partials/NewTicket.html:
<template name="NewTicket">
{{#if isAdmin}}
{{/if}}
</template>
to trigger the check? I'm 99% sure theres a better way.
I have this logic that I'm trying to implement and I'm failing to do so... Here is the deal. I have implemented the confirmation mail for new users and now with the code that I will paste bellow I'm basically blocking the user from login into the app before he confirms he's email address. Okay fairly clear. But now I want to send him to a dedicated "verifiaction" page where it will only be some kind of text like "You need to verify you email before you can login, click to resend the confirmation link, blablabla". Im also using iron router.
Im doing this for the check:
//(server-side) called whenever a login is attempted
Accounts.validateLoginAttempt(function(attempt){
if (attempt.user && attempt.user.emails && !attempt.user.emails[0].verified ) {
console.log('email not verified');
// Router.go('verification'); - some kind of my "logic" what I want to
}
return true;
});
There is a discussion with the same issue here and in the comments, a user suggests resending the verify email token and alerting the user, instead of redirecting to a page, which would be simpler. The code for that would look like:
Accounts.validateLoginAttempt(function(attempt){
if (attempt.user && attempt.user.emails && !attempt.user.emails[0].verified ) {
Accounts.sendVerificationEmail(user._id);
Alert('Your email has not been verified, we have re-sent the email. Please verify before logging in.');
//you could also use a modal or something fancy if you want.
}
return true;
});
If definitely want to create a page, there is an answer here about ways to do that, but how you do it it depends on whether you want it to be part of the layout or not.
I have a node.js application with a connection to a remote mongoDB server. The database contains some custom codes that have been pre-created and distributed to certain users. The idea is that only those who enter one of such codes into a form on the index page can be allowed to view the rest of the site. That is, I want to cross-reference the code entered with the master list stored in my database.
This is an example of what I'm trying to do(note this is in routes/index.js):
collection.findOne({ "Code": "fooCode" }, function(err, doc){
if you cannot find fooCode
show an error message, clear the input area and tell the user to re-enter a correct code
if you find fooCode
redirect to a new page;
});
The above code is within a
router.post('/', function(req, res){...})
function.
My question is, how do I clear the text input area(without refreshing the page) and ask the user to re-enter a new code when a wrong code is entered?
Secondly how do I redirect the user to a new page on valid entry of a code? Thanks.
For that kind of behavior you would need to submit the form via XHR, parse the (JSON) response, and then clear the form on error and display error information. On the server side you can simply do something like res.json({ status: 'success' }); or res.json({ status: 'error', error: 'Bad token' });
On success, you could do the redirect in the browser via window.location.replace("http://example.org/foo"); or if you want the current page in the session history (e.g. reachable with the browser's back button) you can use window.location.href = "http://example.org/foo".
To clear the input: I would handle this on the front-end, so that everytime the button is clicked (to send the form) it clears the input with:
<input id="userInput" type="text">
<button id="submitBtn">Send</button>
Then in your script:
// Cache DOM
const myInput = document.getElementById('userInput');
const myBtn = document.getElementById('submitBtn');
// Event Bind
myBtn.on('click', clearInput);
// Functions
function clearInput() {
myInput.value = '';
}
2. To redirect the user to a new page
res.redirect('/<path>');
You can do the following in your routes to redirect user to the home route.
collection.findOne({ "Code": "fooCode" }, function(err, doc){
if err throw err
else {
res.redirect('/');
}
})
I am building a webpage using AngularJS and Firebase. I want to use facebook login to connect information on the webpage with the user. Firebase has a version of simple login which I guess is supposed to simplify the login process.
My problem is that I want to access information about the logged in user in a lot of places on my webpage but I can't find a good way to do it.
This is how I started out:
var userInfo = null;
var ref = new Firebase('https://<yourfirebase>.firebaseIO.com/');
var auth = new FirebaseSimpleLogin(ref, function(error, user) {
if(error)
alert("You are not logged in");
else if(user)
{
//store userinfo in variable
userInfo = user;
}
else
//user logged out
});
//do something with userInfo
alert(userInfo.name);
My first thought was to run this at the top of my page and then use the info about the user. The problem is that the code using userInfo (as in e.g. the alert) will always run before the userInfo variable has been filled and userInfo will return undefined/null.
I then proceeded to always create a new firebasesimplelogin object when i want to retrieve user data. Which of course isn't very good. Especially since every created FirebaseSimpleLogin object will be called again whenever another is called or a user logs out, for example.
So my question is, how do I use FirebaseSimpleLogin to handle and use my user information in the best way?
I would have liked some function to getUserInfo() or check isLoggedIn() for example. How do you do this properly?
You can take a look at this example for thinkster. It's based on using simple login with userid/password. http://www.thinkster.io/angularjs/4DYrJRxTyT/7-creating-your-own-user-data-using-firebase.
You can create a function like getLoggedinUser that runs in $rootScope that will allow you to find the user throughout the application.
UPDATE:
Around the middle of October 2014, firebase made some big changes. This method might still work, but it's better to take advantage of the newer version of firebase, specifically getauth and onauth. These methods will allow you to do the same thing without running on the rootScope. https://www.firebase.com/docs/web/guide/user-auth.html#section-login
Please make a constant to use it everywhere in your App like that
.constant('facebookUrl', 'https://rjrestaurantapp.firebaseio.com');
Then in the controller inject this constant "facebookUrl & "$state" as shown below...
.controller('loginCtrl', function($scope,facebookUrl,$state){
and then you only need to give name of the state where you want to redirect after facebook authentication..
var ref = new Firebase(facebookUrl);
$scope.fbLogin = function () {
ref.authWithOAuthPopup("facebook", function(error, authData) {
if (error) {
console.log("Login Failed!", error);
} else {
console.log("Authenticated successfully with payload:", authData);
$state.go('restaurant');
}
})
}})
You can see the information in authData object after successfull authentication using facebook ....
please read this doc carefully https://www.firebase.com/docs/web/guide/login/facebook.html
The above is the example of simple login using firebase and for retrieving data for each logged in user, you have to store user information at the time of signin as you know that firebase makes every child with a unique ID .. then you only need to use the offline features of firebase that will find which user is offline and according to that remove the node with the same ID which one is offline, you can find examples in the MANAGING PRESENCE section of the below link ..
https://www.firebase.com/docs/web/guide/offline-capabilities.html