Flask 6: User Input - Get requests

Get requests, get requests in flask, html code changes

Let’s go!

1 - GET Requests

HTTP GET requests are a basic way to get info from users on a website. Ever noticed URLs with question marks while browsing? Like when you search something on a website, the URL might look something like this:

example.com/search?query=weather

The part after the question mark is a GET argument. Here, query is the name of the argument, and weather is its value. While these arguments are often automatically generated by filling out forms on a website, you can also type them directly into the URL or click a link that has them.

GET requests are used to fetch non-sensitive information needed to display a page based on what's in these arguments. They're designed so that if you send the same GET request multiple times, you'll always get the same result back. This makes them safe for actions like viewing different pages without changing any data on the server.

2 - Get Requests in Flask

Now, let's use GET requests in our Headlines project to let users choose which news publication they want to see. We'll start by tweaking our Python code to handle this:

• Import the request context from Flask

• Remove the dynamic URL variable

• Check to see if the user has entered a valid publication as a GET argument

• Pass the user query and the publication to the template

update the main python file to do this:

import feedparser
from flask import Flask
from flask import render_template
from flask import request

app = Flask(__name__)

RSS_FEEDS = {'bbc': 'http://feeds.bbci.co.uk/news/rss.xml',
             'cnn': 'http://rss.cnn.com/rss/edition.rss',
             'fox': 'http://feeds.foxnews.com/foxnews/latest',
             'iol': 'http://www.iol.co.za/cmlink/1.640'}

@app.route("/")
def get_news():
        query = request.args.get("publication")
        if not query or query.lower() not in RSS_FEEDS:
                publication = "bbc"
        else:
                publication = query.lower()
        feed = feedparser.parse(RSS_FEEDS[publication])
        return render_template("home.html",articles=feed['entries'])

if __name__ == "__main__":
    app.run(port=1234)

The first update we're making involves importing Flask’s request context, which is like a handy tool that Flask gives us to make dealing with web requests easier. It acts like a global point where our code can grab info about the latest request sent to our app. This is super useful because any GET arguments a user includes in a request—like in a URL—automatically show up in request.args, which we can use like a Python dictionary to access specific data (though it can't be changed).

In our code, we use the get() method from request.args to check if a particular publication is specified. If it’s not there, get() just returns None. If it is there, we make sure it’s a valid option from our RSS feeds. If everything checks out, we show the news from that publication.

To see this in action, just go to your browser and type something like localhost:1234/?publication=bbc and you should see the news feed from BBC pop up.

3 - HTML changes

It looks like our changes have made the app a bit less user-friendly, which isn't what we wanted. But here’s the good news: our users don't actually have to manually tweak the URL to see different news feeds. With just a small tweak, we can set up our app so that the URL arguments get filled in automatically, meaning users won't need to mess with the URL themselves.

Let’s make it easier. Go into your home.html template and add this bit of HTML right below the heading section:

<form>
  <input type="text" name="publication" placeholder="search" />
  <input type="submit" value="Submit" />
</form>

This might seem pretty straightforward, but let's break it down to understand how everything fits together. First off, we add an HTML form element to the page. When this form is submitted, it sends an HTTP GET request, which means it adds whatever is typed into the form as GET arguments in the URL.

Inside our form, we include a single text input with the name publication. This name is key because the GET argument in the URL will use it. We also add a placeholder to this input field, which isn't necessary but helps users by showing a hint about what they should type in the field.

Then, we have a submit button, created with another input of type submit. This button makes it easy for users to send their input to our Python backend just by clicking it.

After saving your changes and reloading the page, you'll see the new input form right at the top. Just a few lines of HTML have added significant functionality. Now, our app not only looks more polished but is also easier to use, showing that GET arguments, while they might have seemed a bit complex at first, actually help make our web app simpler and friendlier for users.