1

I am trying to send server data to my javascript client and then output it in html(jade).

Problems
1. My Js Client & Html variables (publicKey, name, artist, picture, id) are "undefined"
2. Not clear on "try" or "catch" conditionals mean (maybe this is affecting something)

My Research
https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest
Basic Ajax send/receive with node.js

Is the problem likely in my server code, Javscript client, or Jade?

Node.js server

app.get('/user/:id', function (req, res) {
  if (!req.user)
    res.send(err);
  if(req.user) {
    try {
      var id = req.params.id;
      var dbUser = req.user;

      res.send({
        'publicKey': dbUser.publicKey,
        'name': dbUser.name,
        'artist': dbUser.artist,
        'picture': dbUser.picture,
        'id':  dbUser.id
      });

    } catch (e) {
      res.send({'status': 404});
    }
  } else {
    res.send({'status': 403});
  }

});

Js Client

  var keysCache = {};
  var xhr = new XMLHttpRequest();
  xhr.open('GET', '/user/' + message.userid, true);
  xhr.onreadystatechange = function() {
    if (xhr.readyState === 4) {
      var res = JSON.parse(xhr.responseText);

      keysCache[message.userid] = {
        'publicKey': res.publicKey,
        'name': res.name,
        'artist': res.artist,
        'picture': res.picture,
        'id': res.id
      }
      console.log(res.name);
      displayOutput(message);
    }
  };
  xhr.send(null);

Jade

 #chat
  (...)
  script.
   window.user = {id:"#{user.id}", name: "#{user.artist}", picture: "#{user.picture}", gtoken: "#{user.gtoken}", eccKey: "#{user.eccKey}"};
  script(src='/javascripts/client.js')
Community
  • 1
  • 1
Chā
  • 122
  • 1
  • 9
  • *My Js Client & Html is "undefined"* — What does this mean? Are you saying that the browser just renders the word `undefined` in the viewport when you type in the URL for the HTML document into the address bar? – Quentin Mar 24 '16 at 20:13
  • *I don't know what "try" or "catch" conditionals mean* — They're basic parts of JavaScript. Did you try [reading up on them](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/try...catch)? – Quentin Mar 24 '16 at 20:14
  • @Quentin My bad I updated my question, and thanks for the Js resource. – Chā Mar 24 '16 at 20:19
  • Are you using mean stack? express? – Henri Cavalcante Mar 24 '16 at 20:22
  • 2
    try to open the `/user/:id` in your browser, and post the results – stjepano Mar 24 '16 at 20:23
  • @HenriCavalcante Yes Mongo, Express, Node – Chā Mar 24 '16 at 20:26
  • `console.log(res.name);` shows something? – Henri Cavalcante Mar 24 '16 at 20:39
  • @HenriCavalcante it reads "undefined." so I assumed that all were undefined since the others are part of the same function. – Chā Mar 24 '16 at 20:42
  • @stjepano Thanks I didn't even think to check that. However, /user/:id is Undefined as well. This leads me to believe my server code is clogging things up. – Chā Mar 24 '16 at 20:45
  • Did you check the mongodb if the document is there? – Henri Cavalcante Mar 24 '16 at 20:48
  • @HenriCavalcante I can successfully render all user variables directly to my Jade file, but I can't get those variables to pass through to the Javascript file first. This a chat function. I need to attach user variables to a message, then output everything in Jade. – Chā Mar 24 '16 at 20:54

1 Answers1

0

It appears as if I was looking for love in all the wrong places. I didn't put this code in here because I didn't think it was the problem but after logging every function starting from my server I realized I was mistaken. This is the entire part code, the first part is where the error was.

Answer/Simple Lesson: I wasn't calling my JSON data correctly. Always double check JSON data nesting. 

  function displayOutput(message) {
    if(!message) return;
    if(typeof(message.text) === 'undefined') return;

var html = '';

if ('userid' in message && message.userid in keysCache) {

  var signature = message.signature;

  delete message.signature;

  var result = ecc.verify(keysCache[message.userid].publicKey, signature, JSON.stringify(message));

  if(result) {
    html = '<p><img src="'+ keysCache[message.userid].picture +'" class="avatar"><strong>' +  keysCache[message.userid].artist + '</strong><br><span>' + message.text + '</span></p>';
  } else {
    html = '<p><img src="images/troll.png" class="avatar"><strong></strong><br><em>A troll tried to spoof '+ keysCache[message.userid].artist +' (but failed).</em></p>';
  } 

  output.innerHTML = html + output.innerHTML;

} else {
  var xhr = new XMLHttpRequest();
  xhr.open('GET', '/user/' + message.userid, true);
  xhr.onreadystatechange = function() {
    if (xhr.readyState === 4) {
      var res = JSON.parse(xhr.responseText);

      keysCache[message.userid] = {
        'publicKey': res.publicKey,
        'name': res.name,
        'artist': res.artist,
        'picture': res.picture,
        'id': res.id
      }
      console.log(name);
      displayOutput(message);
    }
  };
  xhr.send(null); 
}

}

Chā
  • 122
  • 1
  • 9