Jon
Jon

Reputation: 8531

Chrome Extension - Channels Not Working

I am trying to create a channel to my Google App Engine (Python) server, and there seems to be a problem but I am unsure why. When the user toggles the extension, it authenticates the user. If successful, the server replies with a channel token which I use to create the channel. When I authenticate the user, alert("a") appears, but alert("b") does not which makes me believe there is a problem with the line var channel = new goog.appengine.Channel(msg.token);, but the console does not report an error.

I have also copied the javascript code from here and placed it in my manifest as oppose to putting <script type="text/javascript" src="/_ah/channel/jsapi"></script> in background.html.

//script.js
function authenticate(callback) {
    var url = "https://r-notes.appspot.com/init/api/authenticate.json?username=" + username + "&password=" + password;
    $.post(url, function(data) {
        if (data.status == "200") {
            channelToken = data.channeltoken;
            if (callback) {
                callback();
            }
            var port = chrome.extension.connect({name: "myChannel"});
            port.postMessage({token: channelToken});
            port.onMessage.addListener(function(msg) {
                console.log(msg.question);
            });         
        }
    }); 
}


//background.html
chrome.extension.onConnect.addListener(function(port) {
    port.onMessage.addListener(function(msg) {
        alert("a"); //pops up
        var channel = new goog.appengine.Channel(msg.token);
        alert("b"); //does not pop up
        console.log(channel); //display error ' Error in event handler for 'undefined': ReferenceError: goog is not defined '
        var socket = channel.open()
        socket.onopen = function() {
          // Do stuff right after opening a channel
          console.log('socket opened');
        }
        socket.onmessage = function(evt) {
          // Do more cool stuff when a channel message comes in
          console.log('message recieved');
          console.log(evt);
        }
    });
}); 


//manifest.json
{
    "name": "moot",
    "description": "Clicking on the moot button will display a sidebar!",
    "version": "0.2.69",
    "background_page": "html/background.html",
    "browser_action": {
        "default_icon": "img/icon_64.png",
        "default_title": "moot"
    },
    "content_scripts": [
        {
            "matches": ["<all_urls>"],
            "js": ["js/channelApi.js", 
                   "js/script.js", "js/mootsOnSidebar.js", "js/mootsOnPage.js", "js/authenticate.js", "js/otherFunctions.js",
                   "js/jquery/jquery-1.7.1.js", "js/jquery/jquery.mCustomScrollbar.js", "js/jquery/jquery-ui.min.js", 
                   "js/jquery/jquery.autosize.js", "js/jquery/jquery.mousewheel.min.js", "js/jquery/jquery.easing.1.3.js",
                   "js/channel.js"],
            "css": ["css/cssReset.css", "css/sidebar.css", "css/onPageCreate.css", "css/onPageExists.css", "css/scrollbar.css", "css/authenticate.css"]
        }
    ],
    "permissions": [
        "tabs", "contextMenus", "http://*/*", "https://*/"
    ],
    "icons": {
      "16": "img/icon_16.png",
      "64": "img/icon_64.png"
    }
}

EDIT - After doing console.log(channel), I discovered the error ' Error in event handler for 'undefined': ReferenceError: goog is not defined '. I am unsure why I receive this error as I did include the required javascript file as I followed this post.

Upvotes: 0

Views: 697

Answers (2)

Jon
Jon

Reputation: 8531

So the solution is that you need to include the file <script type="text/javascript" src="https://talkgadget.google.com/talkgadget/channel.js"></script> in a HTML page. I placed this on the first row of background.html.

My mistake was saving a local copy of channel.js, and refer to it in manifest.json.

I'm now going to place a copy of channel.js on my server, and refer to my server's copy. I don't think there will be any issues with that.

Upvotes: 1

tobiasmueller
tobiasmueller

Reputation: 140

Make a console log for the value of msg direct between alert("a") and var channel = ... and inspect the value.

Upvotes: 0

Related Questions