How can I check if ECC Key and Public Key are being passed through Js file?

Question

I'm having a problem locating where my problem is. I'm using PubNub for realtime messaging and the example project is using ECC (elliptical curve cryptography) encrypted messaging.

Every thing in the file works(animation, channel presence, etc.) except for sending the message. Every time I hit send I get this message:

Here is my chat-app.js file:

(function() {

  if (typeof(user) === 'undefined') {
    return;
  } 

  var output = document.getElementById('output'), 
      input = document.getElementById('input'), 
      picture = document.getElementById('picture'),
      presence = document.getElementById('presence'),
      action = document.getElementById('action'),
      send = document.getElementById('send');

  var channel = 'fun';

  var keysCache = {};

  var pubnub = PUBNUB.init({
      subscribe_key: 'sub-c-xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx',
      publish_key: 'pub-c-xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx',
      uuid: user.name,
      auth_key: user.gtoken,
      ssl: true
  });


  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].name + '</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].name +' (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
          }
          displayOutput(message);
        }
      };
      xhr.send(null); 
    }
  }

  function getHistory() {
    pubnub.history({
      channel: channel,
      count: 30,
      callback: function(messages) {
        messages[0].forEach(function(m){ 
          displayOutput(m);
        });
      }
    });
  }

  pubnub.subscribe({
    channel: channel,
    restore: true,
    connect: getHistory,
    disconnect: function(res){
      console.log('disconnect called');
    },
    reconnect: function(res){
      console.log('reconnecting to pubnub');
    },
    callback: function(m) {
      displayOutput(m);
    },
    presence: function(m){
      if(m.occupancy === 1) {
        presence.textContent = m.occupancy + ' person online';
      } else {
        presence.textContent = m.occupancy + ' people online';
      }
      if((m.action === 'join') || (m.action === 'timeout') || (m.action === 'leave')){
        var status = (m.action === 'join') ? 'joined' : 'left';
        action.textContent = m.uuid + ' ' + status +' room';
        action.classList.add(m.action);
        action.classList.add('poof');
        action.addEventListener('animationend', function(){action.className='';}, false);
      }
    }
  });

  function post() {
    var safeText = input.value.replace(/\&/g, '&amp;').replace( /</g,  '&lt;').replace(/>/g,  '&gt;');
    var message = { text: safeText, userid: user.id };

    var signature = ecc.sign(user.eccKey, JSON.stringify(message));
    message['signature'] = signature;

    pubnub.publish({
      channel: channel,
      message: message
    });

    input.value = '';
  }

  input.addEventListener('keyup', function(e) {
    if(input.value === '') return;
    (e.keyCode || e.charCode) === 13 && post();
  }, false);

  send.addEventListener('click', function(e) {
    if(input.value === '') return;
    post();
  }, false);


})();

This error is coming from my ecc.js file

Uncaught TypeError: Cannot read property 'r' of undefined 

However, I'm assuming the error is in the chat-app.js file because I didn't touch the ecc.js file. I got it from the project -- https://github.com/pubnub/auth-chat-demo

More info on ECC can be found here: https://github.com/jpillora/eccjs

Answer 1

According to your description, it looks like this line is giving you the error:

var signature = ecc.sign(user.eccKey, JSON.stringify(message));

So I am guessing you are not properly passing user.eccKey?

Do you have all the user data from oAuth (or any login auth)? or is the eccKey generated correctly upon the user sign-up?

Also, try include the non-minified version of ecc.js so you can track where the error is coming from more easily. https://raw.githubusercontent.com/jpillora/eccjs/gh-pages/dist/0.3/ecc.js