Archives

All posts for the month December, 2013

Things My Wife Doesn’t Understand – 2013 Review

2012_sparklers

The year is over and WordPress has kindly sent me a summary of that stats for my blog.  The growth has been more than I ever expected.  I still consider this a personal blog for my own edification and learning but I’m glad I could share my knowledge and problems with so many.  In the coming year I would like to focus a bit more on Django and Python but understand that a lot of people really want front end help and so I will continue to post about JavaScript and CSS.

Eric Saupe: Things My Wife Doesn’t Understand – 2013 Review

Thanks again for visiting my blog.  I hope it helps you as much as it helps me.

Security-camera-sign

A couple of weeks ago it came out that there is a flaw in Django’s ImageField which could potentially allow for phising programs to be uploaded and grab cookies or do other malicious things.  While there will be no fix in Django directly you still need to take precautions on how you serve and receive files uploaded by your users.

Django has a page dedicated to fixing this exact issue.  Head over to their security guide and read up on the fixes.  They shouldn’t be too hard and shouldn’t affect any user experience.

Just wanted to post and let everyone know of the vulnerability.

Adding Custom Django 404 and 500 Pages

2_creative_404_pages_by_theollybanks-d3gmv9v

Django comes with a default 404 and 500 error pages which are dull and boring.  It would be much better if you add your own spin on those pages to inform your user of what happened.  Django makes this super easy by searching your project template files for a 404.html or 500.html file when it tries to render those pages.  This means all you need to do is make a nice Django template called 404.html and 500.html and place it in your project templates folder and you’re done!  You’ll have access to whatever context processors you are running for information, most of the time these pages won’t be user specific and will just display some error.

Please note that you won’t be able to see them unless you turn DEBUG = False in your settings.py file.  Once debug is off Django will render the 404 and 500 pages rather than the debug output.

Hope this helps people get their pages a little more user friendly and comfortable.

Growing up I was always interested in computers.  I helped put parts in computers and install programs as young as five or six.  As I went to school I always knew I wanted to do something with computers.  Sadly, I wasn’t able to take any computer related classes in middle school or high school because they simply were not offered.  I would have loved to take a computer science course before going to college to better prepare myself for the challenges that it brings.

Luckily, there is a group trying to change that.  Between December 9-15, 2013 is Computer Science Education Week organized by Code.org.  Their goal is to promote computer science education.  They’ve done a great job getting celbrities to back the cause and made a great YouTube video that you can see on this page and their site.

Computer science is not just for those who want to program.  Computer science is all about solving complex problems and critical thinking.  The solutions computer scientists come up with are manifest through a computer program but anyone can benefit from being a better problem solver.  Taking time to learn to program just a little bit will help you better see solutions to complex problems and understand how many of your favorite programs work and function.

Take time to program today or teach someone else.  The Computer Science Education Week website has a lot of great tutorials for anyone new to computer science.  If you already have experience but want to practice a bit more, head on over to GitHub and find an open-source project that interests you and contribute.

git

I’ve found that a lot of things on Ubuntu are very easy to install but there are some trickery ones that if you don’t know the procedure can be a pain to get up and running on a new installation.  Here is a quick setup guide for getting SmartGit installed on a fresh Ubuntu installation.

  1. Install the Java Runtime Environment from here.  http://apt.ubuntu.com/p/openjdk-7-jre
  2. Install Git with the command sudo apt-get install git-core
  3. Install Mercurial with the command sudo apt-get install mercurial meld
  4. Download and install SmartGit per their instructions on their site

That’s all there is to it.  Hope this helps both myself and anyone else looking for a quick guide to get SmartGit up and running.

world-cup-trophy

With the World Cup draw just getting over, and the United States bracing for a tough group, I am pleased to announce a small project I have been working on in my spare time, a World Cup Prediction App (if you have a better name for it please email me)!  My wife wanted a way to get her family more into the World Cup.  Since they are big American football and basketball fans they are familiar with brackets and tournaments.  I decided to make a simple website that allows people to create World Cup predictions to compete with others.  This app is still in very early days.  Most of the images are placeholders and the scoring system and group creation is still in the works.

You can sign up now to get updates on the app as it develops as well as create your predictions right now.  Just create an account and login.  Then click Brackets at the top and New Bracket.  Enter a name for your bracket and submit.  Now you can select the winners of the groups and the winners of each match by simply clicking their name.

This is also all open source so if you want to keep up on updates or leave feedback/bugs head on over the the project’s GitHub page or send an email to info@ericsaupe.com.

I will post more about the app as it gets updated but in the mean time please feel free to create an account and click around.  The address is currently at http://soccer.ericsaupe.com but once a name is chosen I will change that.

aws-logo

Amazon Web Services (AWS) has been revolutionary in getting servers and processing power to virtually anyone on the cheap.  You can host your web site there, process large sets of data, even back up your personal files to an Amazon S3 server.  Even if your site isn’t hosted directly on AWS you can still benefit by hosting your files from there.  A lot of sites do this to help off load the bandwidth costs onto Amazon because in many cases it is cheaper than the bandwidth costs for your site.  In this post I want to go over how to access these files stored on an S3 instance of AWS from Python using a plugin known as Boto.  You can read the Boto S3 commands at their website.  There are a lot of them and I am only going over the basics here.

Boto is a Python interface to Amazon Web Services and helps you interact with every aspect of AWS.  I’m just going to focus on the S3 portion since that is where we store files for clients.  We designed a way for clients to view and store files through our client portal.  It is sort of like Dropbox but not nearly as sophisticated.  We are able to drop files in their folder for them to view and they can even add in files for themselves.  Everything is saved back at Amazon and everyone is happy.  To accomplish all of this in our Django project we needed to interact with S3 as if it were a normal file system.  Since S3 is remote, connections need to be made, files need to be uploaded, and paths need to be verified.  One of the easiest things we did was create a FileUtils class that handled all of our Boto code and then simply created an instance of it and called our methods.  Let’s go through our code and feel free to change whatever you need to to make it work for you.  I’ve stripped out a lot of the more proprietary code that is uninteresting or unneeded in the course of this post.

There was a ton of code and this post was messy so I moved it all to a PasteBin link.

Let me explain everything that is happening here.  Because we are storing files specific to clients we need to keep them separated.  We gave them the ability to share documents through email addresses.  You’ll notice throughout that we make checks for FileSharesPermissions to verify the user has access to the file they are trying to access.  If you do not care about that and you just want to serve files, feel free to rip all of that out.

The FileUtils class is created by passing in a companyID.  Again, if you are not worried about separation of files just remove all of that.  What is important is a rootFolder, s3Connection, and s3Bucket.  We have opted to place these in the settings file as they will be used and changed as needed.  The rootFolder can be anything you want it to be.  S3 stores files using a key name that can be equated to a path to a file.  Inside of your bucket you will have keys organized by their name and sub categorized by their name just like a path to a file.  We have set up a rootFolder where we will be placing client files separated by their client ID.  Once again, if you don’t need to separate then drop all that code and stick the files wherever you’d like.

In the FileUtils class you’ll see a number of very basic file manager methods.  Save, create folder, delete, get file, get raw file, move, move file, get contents, and various helper methods to accomplish all of this.  Most of the methods should be self explanatory and are only complicated by the check for permission to access the file.

A few things of note.  Everytime you want to save a new file you need to create a new key using Boto.  You’ll see that under the save_file method that k = self.s3Bucket.new_key(path).  This is creating a new empty key, no data, at that name in the S3 instance.  It then sets its contents from a string, passed from a file upload, and is saved.  You do not need to worry about creating a folder or subfolder for the file.  S3 takes care of that using the name of the key.  For example, if I have a totally empty S3 instance and I try to save a file to Files/New Files/Some Other Folder/My PDF.pdf all I would need to do is set the name of the key that holds My PDF.pdf as that path name.  S3 will automatically read the slashes as folders and take care of the rest.  This makes things tricky for something like creating a new folder.  Something actually has to be in the folder to be considered by S3 to be a folder.  To get around this you’ll see under the create_folder method that we generate a key at that path and set the contents to nothing.  This creates the key, S3 displays it as a folder, but that folder is technically empty.  Now you can see it and save files to it whenever you’d like.

When you retrieve a file S3 generates a temproary URL.  Under the method get_file you’ll see that we return the url = k.generate_rul(120).  The 120 is how many seconds that temporary URL will be valid for.  This is great for security as it requires users to constantly regenerate the URL to ensure they still have access to it.  The get_raw_file on the other hand does not use the temporary URL and instead just gets the contents of the file and returns it to the user.  Both methods work and you should use the one that suits your needs.

This post might be really complicated and a bit hard to understand.  If anything needs to be clarified please feel free to comment below and I will be glad to rewrite and expound more on the code and workings of Boto.