My question is about the basic understanding of handlebars.
First of all: Is handlebars operating front- or backend?
Now to my specific question:
An Example:
I prevent an user from seeing some admin stuff with the Built-in if helper
{{#if admin}}
<h1>Welcome Admin</h1>
{{/if}}
Will a user be able to manipulate/bypass this somehow?
Related
Is there is any way to use route function inside the front-end, something like href="<%= route("add_agent") %> instead of using href="./add_agent"
Add Agent
Edit/Delete Agent
All Admins
Add Admin
Just to let you know, I am using NodeJs (express framework) with ejs views.
In Angular 9 is there a way to build my Angular app and then whenever the client requests the page modify it based on data sent in that request?
For example run it through an Express templating engine such as EJS or PUG (aka Jade)?
The purpose behind this is that I need to ensure that certain parts of my application are never sent to the client unless they have a specific authentication token.
Here's an example of what I want (and works) in EJS:
<div>Hello!</div>
<% if (username === "Tester") { %>
<div>This contains sensitive admin forms!</div>
<div>People shouldn't know that these exist!</div>
<% } %>
This is possible in Angular from what I understand, however either user information isn't available as it's not compiling at runtime, or it has to be processed by the client - which is a major security issue.
Is there any way to get this, or something similar to work in Angular?
I am familiar with Angularjs(1.x) and use templates in directives.
Currently I am learning nodejs and as a part of the course template engines are mentioned. What are the advantages of using them on the backend?
Currently I can't see any use.
If you have data (say from a database) that needs to be rendered to HTML, you can use a template engine to take the data and a template and render it to HTML (which subsequently gets served to the client).
If your frontend app does the same, using XHR calls or something similar to retrieve the data from the server, it's generally not useful to render to HTML server side (instead, the data gets sent as JSON to the client).
So it depends on how your app (both frontend and backend) is structured if it makes sense or not to use a templating engine.
There's also hybrid solutions where the initial HTML is rendered server side, and then the client side "takes over". This is something that, for instance, React supports. The big idea there is that you can use the same components both on the server and on the client, and that when a page is opened, the user will get to see a fully rendered initial page (instead of the client side having to retrieve the data from the backend first and then rendering the page).
You actually dont need them, but they have a lot of features that makes your pages more dynamic..
For example you can render just HTML using this code
app.get('/',function(req,res){
res.sendFile(path.join(__dirname+'/index.html'));
//__dirname : It will resolve to your project folder.
});
But with engines you can send data to template.
http://expressjs.com/en/api.html#res.render
// pass a variable to the view
res.render('somePage', {
title: 'Awesome title',
userFriends: friendsList,
name: 'loggedUserName'
});
And now on front-end templates(EJS in this case) will populate html with data that you send in. So html became dynamic and you can make each page looks different for each user.
<ul>
<% for(var i=0; i<userFriends.length; i++) {%>
<li><%= userFriends[i] %></li>
<% } %>
</ul>
With just HTML you will need to make a lot of unnecessary AJAX calls to get and add data into html which is bad idea.
Hope this helps.
A view engine allows you to render HTML with options. For example, using squirrelly, I can create a file that looks like this:
<!DOCTYPE html>
<html>
<head>
<title>{{title}}</title>
</head>
<body>
{(userIsSignedIn){<!-- if the user is signed in, display username and description-->
<p>{{username}} is {{description}}</p>
}}
{(!userIsSignedIn){<!--if user isn't signed in, ask them to sign in-->
<p>Sign in to view this page</p>
}}
</body>
</html>
So I could listen, for example, to a dynamic user profile URL with Express and then return dynamic content.
It's almost 2020, Template literals are literally meant to replace template engines.
https://medium.com/#PaulBrowne83/do-we-really-need-template-engines-anymore-214eb6bc112e
Currently building a Single-page App with Node, with user authentication using passport and mongodb. I want to be able to send the user messages like "that username is already taken" or "please fill out all fields" on signup and login. However, all of the examples of this I have seen use a templating engine with a package like flash to render html based on javascript sent from the server. Is there a way around this? My app is pretty far along, and switching to a templating service is going to be a real pain. I don't need to render html, a simple alert box will suffice.
You can create controller action that matches the route and manually pass found model to the view.
In UserController:
find: function(req, res) {
User.findOne({'id': req.params['id']}, function(err, user) {
res.view({user: user})
})
}
Then You can reference this model in views/user/find.ejs:
<%- user.id %>
<%- user.name %>
use the above syntax to give alert();
I hope this is what you are looking for!
Intro:
Okay I have put together a nice app allowing users to login (node.js, passportjs, mongodb). Now furthering the app, I need to see who is logged in.
Theory:
So this idea just hit me, I think the best idea would be to pass a connected = true, or connected = false when a user logs in, and logs out to the user model.
Question:
My question is what is the best way to track who's sessions are active/connected/loggedin within my app? Would it be passing in those properties to the model?
Is there be a standard way for tracking the sessions of all the users? I don't want this to be an opinionated question which is against the rules, but there has to be a technical way to track the sessions! What would be best practices for something like this?
Trials:
So here I can be more specific I put it to the test and I forgot inside my handlebars template I can only access properties from that users mongodb model.
<div class="row">
{{#if user.connected}}
{{#each user.connected}}
<li>{{this}}</li>
{{/each}}
{{/if}}
</div>
The above obviously doesn't work, because the data is passed like this when the route for that page is made.
res.render('profile', { user : req.user });
So I am sticking with the connected: true, connected: false it's easy, works, and makes sense to me.
Refined question:
So with the given, I am routing using express, rendering and passing the response object to my handlebars template. I want to create a model that has admin = true and only should that user get access to all the models.
My question is in the response object how can I pass a collection of all the users. It wouldn't work as a response, I may need to do a mongoDB query? Does that sound right, something like
AppUser.find({ connected: true }, function (err, user) {
console.log(user);
res.render('profile', { user : user });
});
Something like the above, I am going to test it and post back. I feel I have narrowed it down, so what would be the best solution in passing a list of all connected models to the "res.render" so that I can access them in my template?
Edit: So this sort of works, here is a problem I am running into.
I want to be able to render the user like this res.render('chat', { user : req.user }) but I also want to render a list of the users if the req.user is an admin. So off the top of the head I am thinking to pass two objects.
AppUser.find({}, function (err, users) {
console.log(users);
res.render('profile', { user: req.user, users : users });
});
Handlebars
<div class="row">
{{#each users}}
{{#if this.connected}}
<li><b>Connected:</b> {{this.connected}}</li>
{{#if this.facebook.email}}
<li><b>Email:</b> {{this.facebook.email}}</li>
{{else}}
<li><b>Email:</b> {{this.local.email}}</li>
{{/if}}
{{/if}}
{{/each}}
</div>
^^^ Works! :) any thoughts?