0

I've been working on getting a website together with GAE and the channel api to display and process real time data from a robot I'm working on. I'm pretty new to web development, and python in general, but it seems to me like this code should work I'll make it more fancy once I get it working (logging data into a database, actual data processing etc.), but for now I just want it to display the most recent occurance of the variable "val" from a post request sent from the internet connected board on the robot. Hopefully this will be helpful to anyone looking to do real time data display with the channel api.

Right now I'm displaying a template with an input box set to send a post request to the page. Instead of updating the front page with the current value on submission however, I get a blank screen. I'm not sure if my problem actually has to do with the channel api code, or the java function for updating the displayed value.

Python code:

import os
import webapp2
import jinja2
import json
import logging
from google.appengine.ext import db
from google.appengine.api import channel
from google.appengine.api import users

template_dir = os.path.join(os.path.dirname(__file__), 'templates')
jinja_env = jinja2.Environment(loader = jinja2.FileSystemLoader(template_dir), autoescape=True)

channels = []

class MainPage(webapp2.RequestHandler):

    def get(self):

        user = users.get_current_user()
        if not user:
          self.redirect(users.create_login_url(self.request.uri))
          return

        nickname = user.nickname()
        clientid = user.user_id()
        channel_token = channel.create_channel(clientid)
        channels.append(channel_token)

        template_values = {'channel_id': channel_token, 'nickname': nickname}

        template = jinja_env.get_template('front.html')
        self.response.out.write(template.render(template_values))

    def post(self):
        value = self.request.get("value")

        if value:
        jsn = json.dumps({"val": value})
        for i in range(len(channels)):
            channel.send_message(channels[i], jsn)

app = webapp2.WSGIApplication([
    ('/', MainPage)
], debug=True)

Relevant part of HTML Template:

    <form method="post">
        <label>
            <div>Title</div> <input type="text" name="value" value="{{value}}">
        </label>
        <br>
        <input type="submit">

        <div class="error">{{error}}</div>
    </form>

    <hr>

    <script>
        onMessage = function myFunction(message)
        {
        document.getElementById("val").innerHTML=message;
        }
        var token = '{{ channel_id }}';
        var channel = new goog.appengine.Channel(token);
        var socket = channel.open();
        socket.onmessage = onMessage(message.val);

    </script>

    <p id="val">No value to display</p>

</body>

Thanks in advance.

MikO
  • 16,652
  • 11
  • 69
  • 103
smath
  • 65
  • 6

1 Answers1

0

On the line in javascript where you assign socket.onmessage:

    socket.onmessage = onMessage(message.val);

What you're doing is assigning the result of a call to the onMessage() function. Instead just assign the function itself to socket.onmessage, like so:

    socket.onmessage = onMessage;

Also in your onMessage handler, use message.data to get the JSON value you passed in. To get the val field you'll need to JSON decode message.data.

Moishe Lettvin
  • 8,422
  • 1
  • 24
  • 38