CODEWITHSUNDEEP
javascriptjquerypythonweb-applicationsflask
user94628
user94628

Reputation: 3731

How is a text file sent to a browser line by line

I have a text file and want to send it line by line to a web browser. So as each line is read it is output in the browser.

I presume JQuery would be the route to take, but I've never used it as the client needs to keep the connection open to receive the (1000s) of lines I'll be sending.

This means I'm unsure how to render the html/ javascript page. This is my python server code:

from flask import Flask,render_template, request

app = Flask(__name__)


@app.route('/_reader')
def reader():
    f = open('/home/ranjeev/Desktop/sample_tweets.dat', 'rb')
    for line in f:
        print line
    return line

@app.route('/')
def index():
    return render_template('index.html')

if __name__ == '__main__':
    app.run(debug=True, port= 8888)

And my html code:

{% extends "layout.html" %}
{% block body %}
<script type=text/javascript>
  $(function() {
      $.getJSON($SCRIPT_ROOT + '/_reader', 
       function(data) {
        $("#result").text(data.result);
});
      return false;
    });

</script>
<h1>Coordinates</h1>
<p>
   <span id=result>?</span>
{% endblock %}

I would really appreciate help, as it seems like this is a very complex issue, which I don't think it should be.

Thanks

Upvotes: 0

Views: 613

Answers (3)

user9876
user9876

Reputation: 11102

When you're using XMLHttpRequest, you can read .responseText when it's still loading, and you will get the data that's been loaded so far. (You might want to check if there's a partial line at the end and chop it off if so).

The latest standard says that XMLHttpRequest fires a progress event whenever more data is received, so you can listen for that event and render the new data. Unfortunately neither Mozilla Firefox or IE implement the progress event, so you'll have to just set a timer and check .responseText from that timer.

On the server side you don't need anything fancy at all; just send raw text. (Even just getting the web server to serve a .txt file is fine).

Upvotes: 1

MaxPRafferty
MaxPRafferty

Reputation: 4977

I know no python, so this will be fairly high level, but it is all about the client-server relationship.

The browser connection is not going to behave like an open port. It expects to make a request, and get an HTTP structured response. There is no "streaming" in HTTP.

That said, with control of both ends of the equation, you can fake it. This will have nothing to do with JQuery, though their AJAX library may be useful, but not required.

To accomplish this, you will treat each line as an individual AJAX request. Doing this sequentially is not too bad. Your requests will look like this:

  1. Browser opens - Javascript asks for line 1
  2. Python server spins up, sends line 1
  3. Browser recieves line one - Javascript asks for line 2... etc
  4. Server sends end of document notification, browsers stops requesting lines.

the absolute most basic way to accomplish this using Javascript would be as follows, where i have assumed your server is sending json objects and encoding them as {'number':'value','line':'value'}, and that it responds correctly to restful requests in the format yourServer/yourService/lineNumber

var loginUrl = "http://yourServer/yourService/"
var doRequestLine = function(lineNumber){
$.getJSON(loginUrl+lineNumber, function (data) {
               $(document.body).append($("<p>"+data.line+"</p>"))
               if(data.number === "end"){return;}
               doRequestLine(data.number++);
});
} 

doRequestLine(0);

Upvotes: 1

Ron E
Ron E

Reputation: 2252

WebSockets would fit here: http://en.wikipedia.org/wiki/WebSocket

This would allow you to send content back to the browser, pick it up with JS and continue you're processing there.

Upvotes: 2

Related Questions