Skip to content

Commit e8f6ced

Browse files
committed
almost done with next blog post
1 parent f6abe3c commit e8f6ced

File tree

12 files changed

+125
-13
lines changed

12 files changed

+125
-13
lines changed

Makefile

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,8 @@ run:
55
cp -R static/* generated/updated_site/
66
cp generated/updated_site/pages/* generated/updated_site/
77
rm -rf generated/updated_site/pages/
8+
sed -i '' 's/\(^.*~~.*$$\)/<span class="highlight">\1<\/span>/g' generated/updated_site/blog/*.html
9+
sed -i '' 's/~~//g' generated/updated_site/blog/*.html
810

911

1012
update:

content/posts/170723-monitor-flask-apps.markdown

Lines changed: 122 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,8 @@ the post:
3333
* [pyrollbar](https://rollbar.com/docs/notifier/pyrollbar/) monitoring
3434
instrumentation library,
3535
[version 0.13.12](https://github.com/rollbar/pyrollbar/tree/v0.13.12)
36+
* A [free Rollbar account](https://rollbar.com/) where we will send error
37+
data and view it when it is captured
3638
* [pip](https://pip.pypa.io/en/stable/) and the
3739
[virtualenv](https://virtualenv.pypa.io/en/latest/) virtual environment
3840
library, which come packaged with Python 3, to install and isolate the
@@ -150,11 +152,16 @@ the following [Jinja2](/jinja2.html) template markup into it.
150152
</html>
151153
```
152154

153-
**The above template does...**
155+
The above [Jinja2](/jinja2.html) template is basic HTML without any
156+
[embedded template tags](http://jinja.pocoo.org/docs/latest/templates/).
157+
The template creates a very plain page with a header description of
158+
"PUBG so good" and a GIF from this
159+
[excellent computer game](http://store.steampowered.com/app/578080/PLAYERUNKNOWNS_BATTLEGROUNDS/).
154160

155161
Time to run and test our code. Change into the base directory of your
156-
project where `app.py` is located. Execute `app.py` using the `python`
157-
command as follows:
162+
project where `app.py` file is located. Execute `app.py` using the `python`
163+
command as follows (make sure your virtualenv is still activated in the
164+
terminal where you are running this command):
158165

159166
```bash
160167
python app.py
@@ -165,13 +172,33 @@ of output.
165172

166173
<img src="/img/170723-monitor-flask-apps/python-app-py.png" width="100%" class="technical-diagram img-rounded" style="border:1px solid #ccc" alt="Run the Flask development server locally.">
167174

168-
**Test app out... happy path, error 404 and error 500.***
175+
What happens when we access the application running on
176+
[localhost port 5000](http://localhost:5000)?
169177

170-
The error is obvious to us because we are testing the application locally,
171-
but what happens when the application is deployed and a user gets the
172-
error in their own web browser? They will typically quit out of
173-
frustration and you will never know what happened unless you add some
174-
error tracking and application monitoring.
178+
<img src="/img/170723-monitor-flask-apps/localhost-base-url.png" width="100%" class="technical-diagram img-rounded" style="border:1px solid #ccc" alt="Testing our Flask application at the base URL receives an HTTP 404 error.">
179+
180+
HTTP status 404 page not found, which is what we expected because we only
181+
defined a single route and it did not live at the base path.
182+
183+
We created a template named `battlegrounds.html` that should be accessible
184+
when we go to
185+
[localhost:5000/battlegrounds/](http://localhost:5000/battlegrounds/).
186+
187+
<img src="/img/170723-monitor-flask-apps/localhost-pubg-gif.jpg" width="100%" class="technical-diagram img-rounded" style="border:1px solid #ccc" alt="Testing our Flask application at /battlegrounds/ gets the proper template with a GIF.">
188+
189+
The application successfully found the `battlegrounds.html` template but
190+
that is the only one available. What if we try
191+
[localhost:5000/fullstackpython/](http://localhost:5000/fullstackpython/)?
192+
193+
<img src="/img/170723-monitor-flask-apps/localhost-no-template.jpg" width="100%" class="technical-diagram img-rounded" style="border:1px solid #ccc" alt="If no template is found we receive a 500 error.">
194+
195+
HTTP 500 error. That's no good.
196+
197+
The 404 and 500 errors are obvious to us right now because we are
198+
testing the application locally. However, what happens when the app is
199+
deployed and a user gets the error in their own web browser? They will
200+
typically quit out of frustration and you will never know what happened
201+
unless you add some error tracking and application monitoring.
175202

176203
We will now modify our code to add Rollbar to catch and report those
177204
errors that occur for our users.
@@ -188,19 +215,101 @@ email address, a username and the password you want on the sign up page.
188215

189216
<img src="/img/170723-monitor-flask-apps/sign-up.jpg" width="100%" class="technical-diagram img-rounded" style="border:1px solid #ccc" alt="Enter your basic account information on the sign up page.">
190217

191-
After the sign up page you'll get to the onboarding flow where you can
218+
After the sign up page you will see the onboarding flow where you can
192219
enter a project name and select a programming language. For project
193-
name enter "Echo" and select that you are monitoring a Python app.
220+
name enter "Battlegrounds" and select that you are monitoring a Python app.
194221

195-
<img src="/img/170723-monitor-flask-apps/create-new-project.png" width="100%" class="technical-diagram img-rounded" style="border:1px solid #ccc" alt="Create a new project named 'echo' and select Python as the programming language.">
222+
<img src="/img/170723-monitor-flask-apps/create-new-project.jpg" width="100%" class="technical-diagram img-rounded" style="border:1px solid #ccc" alt="Create a new project named 'Battlegrounds' and select Python as the programming language.">
196223

224+
Press the "Continue" button at the bottom to move along. The next
225+
screen shows us a few quick instructions to add monitoring to our Flask
226+
application.
197227

198-
(links to Python docs)
228+
<img src="/img/170723-monitor-flask-apps/project-setup.jpg" width="100%" class="technical-diagram img-rounded" style="border:1px solid #ccc" alt="Set up your project using your server-side access token.">
229+
230+
Let's modify our Flask application to test whether we can properly connect
231+
to Rollbar's service. Change `app.py` to include the following highlighted
232+
lines.
233+
234+
```python
235+
~~import os
236+
import re
237+
~~import rollbar
238+
from flask import Flask, render_template
239+
from werkzeug.exceptions import NotFound
240+
241+
242+
app = Flask(__name__)
243+
~~rollbar.init(os.environ.get('ROLLBAR_SECRET'))
244+
~~rollbar.report_message('Rollbar is configured correctly')
245+
246+
MIN_PAGE_NAME_LENGTH = 2
247+
248+
249+
@app.route("/<string:page>/")
250+
def show_page(page):
251+
valid_length = len(page) >= MIN_PAGE_NAME_LENGTH
252+
valid_name = re.match('^[a-z]+$', page.lower()) is not None
253+
if valid_length and valid_name:
254+
return render_template("{}.html".format(page))
255+
else:
256+
msg = "Sorry, couldn't find page with name {}".format(page)
257+
raise NotFound(msg)
258+
259+
260+
if __name__ == "__main__":
261+
app.run(debug=True)
262+
```
263+
264+
We added a couple of new imports, `os` and `rollbar`. `os` allows us to
265+
grab environment variable values, such as our Rollbar secret key. `rollbar`
266+
is the library we installed earlier. The two lines below the Flask app
267+
instantiation are to initialize Rollbar using the Rollbar secret token and
268+
send a message to the service that it started correctly.
269+
270+
The `ROLLBAR_SECRET` token needs to be set in an environment variable.
271+
Save an quit the `app.py`. Run `export ROLLBAR_SECRET='token here'` on the
272+
command line where your virtualenv is activated. This token can be found
273+
on the Rollbar onboarding screen.
274+
275+
I typically store all my environment variables in a file like
276+
[template.env](https://github.com/fullstackpython/blog-code-examples/blob/master/monitor-flask-apps/template.env) and invoke it from the terminal using
277+
the `. ./template.env` command. Make sure to avoid committing your secret
278+
tokens to a source control repository, especially if the repository is
279+
public!
280+
281+
After exporting your `ROLLBAR_SECRET` key as an environment variable
282+
we can test that Rollbar is working as we run our application. Run it
283+
now using `python`:
284+
285+
```bash
286+
python app.py
287+
```
288+
289+
Back in your web browser press the "Done! Go to Dashboard" button. Don't
290+
worry about the "Report an Error" section code, we can get back to that in a
291+
moment.
292+
293+
If the event hasn't been reported yet we'll see a waiting screen like this
294+
one:
295+
296+
<img src="/img/170723-monitor-flask-apps/waiting.jpg" width="100%" class="technical-diagram img-rounded" style="border:1px solid #ccc" alt="Waiting for data on the dashboard.">
297+
298+
Once Flask starts up though, the first event will be populated on the
299+
dashboard.
300+
301+
<img src="/img/170723-monitor-flask-apps/first-event.jpg" width="100%" class="technical-diagram img-rounded" style="border:1px solid #ccc" alt="First event populated on our dashboard for this project.">
302+
303+
Okay, our first test event has been populated, but we really want to see
304+
all the errors from our application, not a test event.
199305

200306

201307
## Testing Error Handling
202308

203309

310+
(links to Python docs)
311+
312+
204313
## What's Next?
205314
We just learned how to catch and handle errors with Rollbar as a hosted
206315
monitoring platform in a simple Flask application. Next you will want to
128 KB
Loading
-141 KB
Binary file not shown.
55 KB
Loading
132 KB
Loading
83.3 KB
Loading
264 KB
Loading
124 KB
Loading
110 KB
Loading

0 commit comments

Comments
 (0)