Waiting on a subscription in Flow Router - meteor

Objective : I want to render one among template A or template B from my flow router function, based upon a document which is retrieved after a subscribe call.
More specifically, I want to render either an admin or a student template based upon the isAdmin field of a user document, retrieved after a completed subscribe call.
My router function is as shown below.
FlowRouter.route('/songs/list', {
name: 'Songs.list',
subscriptions: function(params, queryParams) {
this.register('getUser', Meteor.subscribe('allUsers', Meteor.userId()));
}
action(params, queryParams) {
if(Meteor.user().isAdmin){
BlazeLayout.render("admin_home");
}
else{
BlazeLayout.render("student_home");
}
}
});
The Flow router documentation mentions specifically that
FlowRouter only deals with registration of subscriptions. It does not wait until subscription becomes ready.
So there could be a case where the "if condition" is evaluated before the subscription has updated the local cache.
With iron-router, this is easily handled using a waitOn. However for flow router, I am forced to have 2 separate functions, which further enforces 2 separate url's, for rendering the admin and student templates.
Is this a design choice made by the flow router developers?

Why not carry subscription logic out of routing and use template level subscriptions with builtin Template.subscriptionsReady helper?
FlowRouter.route('/songs/list', {
name: 'Songs.list',
action: function(params) {
BlazeLayout.render('home');
}
});
<template name="home">
{{#if Template.subscriptionsReady}}
{{#if isAdmin}}
{{> admin_home}}
{{else}}
{{> student_home}}
{{/if}}
{{/if}}
</template>
Template.home.onCreated(function() {
this.subscribe('allUsers', Meteor.userId());
});
Template.home.helpers({
isAdmin: function() {
// check if user is admin
}
});
This approach also recommended in FlowRouter docs.

Try:
Meteor.subscribe('allUsers', {
OnReady(){
if(Meteor.user().isAdmin){ BlazeLayout.render("admin_home"); } else{ BlazeLayout.render("student_home"); } }

I think the function you're after is FlowRouter.subsReady, an example of how you might use it within a router (similar to IronRouter) is provided in the docs here.
So in your case, it might look something like:
FlowRouter.route('/songs/list', {
name: 'Songs.list',
subscriptions: function(params, queryParams) {
this.register('getUser', Meteor.subscribe('allUsers', Meteor.userId()));
},
action(params, queryParams) {
Tracker.autorun(function() {
var ready = FlowRouter.subsReady("getUser");
Tracker.nonreactive(function(){
if(ready && Meteor.user().isAdmin){
BlazeLayout.render("admin_home");
}
else if(ready){
BlazeLayout.render("student_home");
}
else {
BlazeLayout.render("loading");
}
});
});
}
});

Related

meteor: publication / subscription not working

I can't for the life of me figure out why nothing shows up client-side in this meteor app. I have tried all the advise in all the related topics and nothing seems to work. I'm using msavin:mongol and I don't even see the subscription on the client at all, despite console.log() debug output indicates that it is there with the current number of entries.
/imports/api/friends.js:
export const Friends = new Mongo.Collection('friends');
Friends.deny({ insert() { return true; }, update() { return true; }, remove() { return true; } }); // access to collections only through method calls
/imports/api/server/friends.js:
import { Meteor } from 'meteor/meteor';
import { Friends } from '../friends.js';
Meteor.publish('friends.all', function(){
return Friends.find();
})
/imports/ui/pages/friends.js:
import { Friends } from '/imports/api/friends.js';
import './friends.html';
Template.friends.onCreated(function() {
this.subscribe('friends.all');
});
Template.friends.helpers({
friends: ()=>{ return Friends.find(); }
});
/imports/ui/pages/friends.html:
<template name="friends">
<h1 class="ui header">Friends</h1>
{{#if Template.subscriptionsReady}}
<h2 class="ui heder">friends list:</h2>
<div class="ui list">
{{#each friend in friends}}
<div class="item">{{friend.name}} ({{friend.email}})</div>
{{/each}}
</div>
{{/if}}
</template>
The "friends list" header shows up, so the subscriptionsReady call returns, but I don't get any data (verified that data exists in the database).
I've also tried moving the subscription into the router (using ostrio:flow-router-extra) and there the waitOn() function never returns when I add the subscription
What is going on here?
If you are missing to include your publication on the server then your client's subscription will immediately be 'ready' but there will be no error message.
This can cause a lot of confusion when creating templates with template-level-subscriptions.
In order to check if a publication exists or not, you can use on the server after start the (undocumented) server.publish_handlers array. It keeps a record of the registered publications.
Meteor.startup( () => {
console.log( Meteor.server.publish_handlers );
});
This comes in very handy, if you have designed your api in way that it keeps track of its intended publications:
friendsdef.js
// definition file for Friends collection and it's
// surrounding functionality
export const FriendsDef = {
collectionName: 'friends',
schema: { ... },
methods: { ... },
publications: {
all: {
name: 'friends.all'
}
}
}
someServerStartup.js
// make sure on startup, that all intended
// publications are registered
Meteor.startup( () => {
Object.values( FriendsDef.publications).forEach( pub => {
if (!Meteor.server.publish_handlers[pub.name]) {
throw new Error('publication should exist, but does not');
}
});
});
The same works with method_handlers for methods. Use these data structures with a well defined API and you will decrease errors of missing includes or misspelled names a lot.

Get current user email meteor

I am having a bit of difficulty getting the email of the current user in Meteor.
publish.js
Meteor.publish('allUsers', function(){
if(Roles.userIsInRole(this.userId, 'admin')) {
return Meteor.users.find({});
}
});
Meteor.publish('myMail', function(){ {
return Meteor.user().emails[0].address;
}
});
profile.html
<template name="Profile">
<h1> My Profile </h1>
{{#if currentUser}}
<p>{{currentUser.profile.firstName}}</p> <p>{{currentUser.roles}}</p>
<p>{{currentUser.userEmail}}</p>
{{/if}}
</template>
profile.js
Template.Profile.helpers({
users: function() {
return Meteor.users.find();
},
userEmail: function() {
return Meteor.user().emails[0].address;
}
});
Firstname and ._id display fine, emailaddress unfortunately does not. Does anyone have a tip? thanks!
Your 'myMail publication is both redundant and incorrect. You should either return a cursor (or an array of cursors), or observe a cursor and send handle the publication lifecycle yourself (a fairly advanced feature, irrelevant to your question). You are using it a-la Meteor.methods, and you should not really user Meteor.user() in a publication anyway.
It's redundant because Meteor's accounts package publishes the current user's emails field automatically.
In your template, you are treating userEmail as an attribute of the current user, instead of calling it as a helper.
I would advise to use a guard and make sure that the user actually has an email address, something in the lines of:
JS:
Template.Profile.helpers({
users: function() {
return Meteor.users.find();
},
userEmail: function(user) {
if (user.emails && user.emails.length > 0) {
return user.emails[0].address;
}
return 'no email';
}
});
HTML:
<template name="Profile">
<h1> My Profile </h1>
{{#if currentUser}}
<p>{{currentUser.profile.firstName}}</p> <p>{{currentUser.roles}}</p>
<p>{{userEmail currentUser}}</p>
{{/if}}
</template>
I would also strongly advise against publishing all of the fields in the 'allUsers' publication, as it will expose sensitive data that should not leave the server under almost any circumstances (e.g, password data).

Meteor: accessing user details on client [duplicate]

This question already has answers here:
How to use Meteor methods inside of a template helper
(6 answers)
Closed 6 years ago.
I'm trying to access (another) user's details on the client side in meteor. I have a server side method called 'userDetails' that I'm calling from a template helper called 'acc'.
Server method:
'userDetails': function(userId) {
check(userId, String);
return Meteor.users.findOne({_id: userId},
{fields: {
"services.facebook.first_name": 1,
"profile.birthday": 1,
"services.facebook.gender": 1,
"profile.location.name": 1
}});
}
Template helper:
acc: function(_id) {
Meteor.call('userDetails', _id, function(err, res) {
if(err) throw error;
return res;
});
}
When I try to access acc.profile.birthday in the template I don't get anything. What could cause this?
Meteor calls are asynchronous calls, that is why your helper is not returning any data.
Best option here is to either use Session or ReactiveVar or ReactiveDict
I'll use Session option here
acc: function(_id) {
Meteor.call('userDetails', _id, function(err, res) {
if(err){
}else{
Session.set('userDetails', res)
}
});
return Session.get('userDetails')
}
In your html you can use this helper like this
{{#if acc}}
{{name}}
...
{{else}}
<p>Information not found</p>
{{/if}}
You have to wrap the return in a else statement.
if(error) {
}
else {
return res;
}
The call to you method in asynchronous. This means that the callback function will be executed when your server method completes.
If you want to display the result on a template, you have two possibilities:
1/ Use a session.
acc: function(_id) {
Meteor.call('userDetails', _id, function(err, res) {
if(err){
}else{
Session.set('data', res)
}
});
return Session.get('data')
}
2/ Use Template subscriptions (better solution):
On the server, you publish the data:
Meteor.publish("data", function(){
return Meteor.users.findOne(...)
});
On the client, you subscribe:
Template.mytemplate.onCreated(function () {
Template.instance().subscribe("data");
});
Then directly on the client you will be able to create a helper and call the findOne.
In the html:
{{#if Template.subscriptionsReady}}
{{#each myHelper}}
{{acc.profile.birthday}}
{{/each}}
{{else}}
<p>Loading...</p>
{{/if}}
Important Notice about users:
Users profile are editable by default. Please read this: https://dweldon.silvrback.com/common-mistakes

How to access FlowRouter subscriptions in Meteor template helpers?

it seems like I can't access a FlowRouter template subscription in my helper. How can you do this?
In my server code:
Meteor.publish('AllUsers', function() {
return Meteor.users.find({}, {fields: {profile: 1}});
})
In my router code:
var userRoutes = FlowRouter.group({
subscriptions: function(params, queryParams) {
this.register('AllUsers', Meteor.subscribe('AllUsers'));
},
});
In my template code:
{{#if checkFlowRouterSubs}}
{{#each getTheUsers}}
{{>userPartial}}
{{/each}}
{{/if}}
In my helpers I have the 'guard':
checkFlowRouterSubs: function() {
if (FlowRouter.subsReady()) {
return true;
};
return false;
},
And then the getTheUsers helper:
...
var users = AllUsers.find(filterObject, { sort: { 'profile.firstname': 1 } }).fetch(); // the actual query definitely works
...
But I get an error:
Exception in template helper: ReferenceError: AllUsers is not defined
I should note that in the getTheUsers helper, FlowRouter.subsReady('AllUsers') returns true
so, first, this :
var userRoutes = FlowRouter.group({
subscriptions: function(params, queryParams) {
this.register('AllUsers', Meteor.subscribe('AllUsers'));
},
});
is NOT server code: it is Client code: the Flow-router is a client side router: counter intuitive but this is the basis of all these routers.
The hint here is that you are 'subscribing' to the publication in this code, so it is on the client side.
Iron-Router is routing both on the server and client-side so it makes things even more confusing when you come from there.
What you are missing here is the publish function on the server side.
Meteor.publish('AllUsers', function() {
return AllUsers.find();
});
EDIT:
The Error
Exception in template helper: ReferenceError: AllUsers is not defined
seems like because you did not define the collection on the client side
var AllUsers = Mongo.Collection('AllUsers'); //or whatever the actual collection
When you try to get data from a subscription, you want to call the actual collection you're looking to get data for, not the subscription name. In this case, I think you mean Meteor.users:
var users = Meteor.users.find(filterObject, { sort: { 'profile.firstname': 1 } });
if( users ) {
return users.fetch();
}

Meteor: Publishing all user not working without autopublish package

I would to show a list of all users, in my template.
I have:
//publications.js
Meteor.publish('users', function() {
return Meteor.users.find({}, { fields: {username: 1, profile: 1} });
});
//router.js
Router.route('/users/add/:_id?', {name: 'users.add', controller: 'UserAddController'});
UserAddController = RouteController.extend({
subscriptions: function(){
return [ Meteor.subscribe('hospitals'),
Meteor.subscribe('roles'),
Meteor.subscribe('users') ];
},
action: function() {
this.render('addUser', {
data: function(){
return { hospital_id : this.params._id }
}
});
}
});
//client
Template.listUsers.helpers({
users: function() {
return Meteor.users.find({});
}
});
But the list keep showing only the current logged-in user. I have created a list of users using Account.createUser() function What am I doing wrong?
Thanks.
You have to subscribe to a publication using this.subscribe() in subscriptions hook:
// a place to put your subscriptions
subscriptions: function() {
this.subscribe('items');
// add the subscription to the waitlist
this.subscribe('item', this.params._id).wait();
}
Or use waitOn:
// Subscriptions or other things we want to "wait" on. This also
// automatically uses the loading hook. That's the only difference between
// this option and the subscriptions option above.
waitOn: function () {
return Meteor.subscribe('post', this.params._id);
}
By default, Meteor publishes the current user. I see that you have a addUser template and a listUsers template. The problem is that while addUser is subscribed to the users publication, listUsers is not (this would depend on what else you have in your router of course). To fix this, change the call to this.render to render the listUsers template. Then, your users helper should work, and you can render the information however you like.
I tested this with my own app (the Microscope project from DiscoverMeteor) and it worked for me. Hope it works for you too. Comment here if not, and be sure to accept this answer if it worked. =)

Resources