Why isn't my helper collection query not reflecting in the html template?

The name of the pictureThe name of the pictureThe name of the pictureClash Royale CLAN TAG#URR8PPP



Why isn't my helper collection query not reflecting in the html template?



Following the tutorial on how to "Write an API", I seem to have gotten stuck and can't move beyond how to get the generated API Key to display in the template.



I have a query APIKeys.find().fetch() in the helper that should reflect correctly in the html template, but it doesn't. I have spent hours looking through my code and have failed to notice any errors in my code.


APIKeys.find().fetch()



I am not that new to Meteor which makes it all the more annoying!



Kindly help!



Find below the template code:
/client/main.html


<template name="apiKey">
<div class="row">
<div class="col-xs-12 col-sm-6">
<h4 class="page-header">Your API Key</h4>
<p>To gain access to the Pizza API, use the following API Key.
Make sure to keep it super safe! <strong>If you'd like to
generate a new key, click the "refresh" icon on the field
below</strong>.</p>

<label class="sr-only" for="apiKey">Your API Key</label>
<div class="input-group">
<input type="text" readonly class="form-control" id="apiKey" placeholder="API Key" value="apiKey">
<div class="input-group-addon regenerate-api-key"><span class="glyphicon glyphicon-refresh"></span></div>
</div>
</div>







In the template above, NOTHING is rendered in the template under value="apiKey". I dont understand why this is.


value="apiKey"



Find below my helpers code: /client/main.js


import '../imports/api/tasks.js';

Template.apiKey.helpers(
apiKey: function()
var apiKey = APIKeys.findOne();

if ( apiKey )
return apiKey.key;
console.log("Sucessful");

else
console.log("Failed! Can't find: APIKeys.findOne()");



);



The helper code above renders this in the console: Failed! Can't find: APIKeys.findOne().
Further, when I query APIKeys.find().fetch() in the console, I get this:


Failed! Can't find: APIKeys.findOne()


APIKeys.find().fetch()





Find below my onCreated code: /client/main.js


Template.apiKey.onCreated(function()
console.log("Your in onCreated!");
this.subscribe( "APIKey" );
);



The onCreated code above renders this in the console: Your in onCreated!.


Your in onCreated!



Find below my events code that is triggered to generate a new API Key: /client/main.js


import '../imports/api/tasks.js';

Template.apiKey.events(
'click .regenerate-api-key': function( )
var userId = Meteor.userId();
confirmRegeneration = confirm( "Are you sure? This will
invalidate your current key!" );

if ( confirmRegeneration )
Meteor.call( "regenerateApiKey", userId, function( error, response )
if ( error )
alert( error.reason, "danger" );

else
alert( "All done! You have a new API key: " +response );
console.log("Response is: " +response);

);


);



The events code above renders a popup box with: All done! You have a new API key: 0. Also the console renders: Response is: 0.


All done! You have a new API key: 0


Response is: 0



Find below the regenerateApiKey method code /server/main.js


regenerateApiKey


Meteor.methods(
regenerateApiKey: function( userId )
check( userId, Meteor.userId() );

var newKey = Random.hexString( 32 );
console.log(">>>: " +newKey);

try
var keyId = APIKeys.update( "owner": userId ,
$set:
"key": newKey

);
console.log(">>> newKey : " +keyId);
return keyId;

catch(exception)
console.log("FAILED UPDATE")
return exception;


);



The method code above renders the below in the terminal:


>>>: af3233a999308e39f9471b790e121cf5
>>> newKey : 0



I have narrowed the issue in the code down to this. The keyId variable being equal to "0" suggests that the APIKeys collection isn't getting updated. Can anyone explain why this is happening?


keyId



I have included further information in hope that it will help.



Find below the code where i subscribe /client/main.js


Router.route('/apiKey',
template: 'apiKey',

waitOn: function()
return Meteor.subscribe('APIKey');


);



Find below the code where I publish /server/main.js


Meteor.publish( 'APIKey', function()
var user = this.userId;
var data = APIKeys.find( "owner": user , fields: "key": 1 );

if ( data )
console.log("User: " +user+ " data is: " +data);
console.log("Was able to find data in Publish APIKey!");
console.log(APIKeys.find().fetch());
return data;

return this.ready();
);



The publish code above renders the below in the terminal:


User: xELzNtMQp7u9FpZib data is: [object Object]
Was able to find data in Publish APIKey!



Find below the code where I declare the collection imports/api/tasks.js


import Mongo from "meteor/mongo";
import Template from 'meteor/templating';
import ReactiveVar from 'meteor/reactive-var';

global.APIKeys = new Meteor.Collection("apiKeys");


/*
* Allow
*/

APIKeys.allow(
insert: function()
// Disallow inserts on the client by default.
return false;
,
update: function()
// Disallow updates on the client by default.
return false;
,
remove: function()
// Disallow removes on the client by default.
return false;

);

/*
* Deny
*/

APIKeys.deny(
insert: function()
// Deny inserts on the client by default.
return true;
,
update: function()
// Deny updates on the client by default.
return true;
,
remove: function()
// Deny removes on the client by default.
return true;

);




1 Answer
1



The problem looks like you don't have any keys in the database, when you try to update it



Try swapping out APIKeys.update for APIKeys.upsert, which will create a key if one doesn't exist.


APIKeys.update


APIKeys.upsert


try {
var keyId = APIKeys.upsert( "owner": userId ,
$set:
"key": newKey

);





Thank you very much for figuring this out! It had been stressing me out for days!
– SirBT
Aug 8 at 7:32






By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Popular posts from this blog

Firebase Auth - with Email and Password - Check user already registered

Dynamically update html content plain JS

Creating a leaderboard in HTML/JS