flask-social-blueprint

An OAuth based authentication blueprint for flask. Easy to extend and override.

https://github.com/wooyek/flask-social-blueprint

Demo

Based on example/gae codebase with secret settings_prd.py provided for proper OAuth providers configuration.

http://flask-social-blueprint.appspot.com/

Why?

There is Flask-Social extension, but is painfully interconnected and to change anything you basically have to fork and rewrite portions of it.

Not to mention that it requires POST request on social login endpoints. I hate that I need to write an inline forms to create a login button.

How it’s any better?

This blueprint plays nicely with Flask-Security and it’s easily overridable without forking everything, it’s plain simple OOP not that module based provider function search crap.

To extend it just write a provider class anywhere you want, and setup it’s client id and secret in the flask settings providing an import path like this:

SOCIAL_BLUEPRINT = {
    # https://developers.facebook.com/apps/
    "flask_social_blueprint.providers.Facebook": {
        # App ID
        'consumer_key': '197…',
        # App Secret
        'consumer_secret': 'c956c1…'
    },
    # https://apps.twitter.com/app/new
    "flask_social_blueprint.providers.Twitter": {
        # Your access token from API Keys tab
        'consumer_key': 'bkp…',
        # access token secret
        'consumer_secret': 'pHUx…'
    },
    # https://console.developers.google.com/project
    "flask_social_blueprint.providers.Google": {
        # Client ID
        'consumer_key': '797….apps.googleusercontent.com',
        # Client secret
        'consumer_secret': 'bDG…'
    },
    # https://github.com/settings/applications/new
    "flask_social_blueprint.providers.Github": {
        # Client ID
        'consumer_key': '6f6…',
        # Client Secret
        'consumer_secret': '1a9…'
    },
    # http://developers.douban.com/apikey/
    "flask_social_blueprint.providers.Douban": {
        # Client ID
        'consumer_key': '6f6…',
        # Client Secret
        'consumer_secret': '1a9…'
    },
    # http://connect.qq.com/manage/index
    "flask_social_blueprint.providers.QQ": {
        # Client ID
        'consumer_key': '6f6…',
        # Client Secret
        'consumer_secret': '1a9…'
    },
}

Done!

What’s missing?

This is just authentication blueprint there is no templates, models and stuff that you would want to customize yourself.

What to do more?

1. More providers
2. Make Flask-Security dependency optional

Examples

The core of this module has no GUI, but examples have a nice login and profile page to show it it works. Checkout the demo.

The example has a working model and templates, has a bunch of dependencies like Flask-SLQAlchemy, you can take it as a wire frame modify and build your app with that.

Examples are made from some existing apps, they may contain more stuff that’s really needed to showcase this module. When in trouble just ask questions.

Or just drop in this solution inside your working Flask app. It should not create any conflicts with existing stuff. You maybe required to write an adapter for your User model and SocialConnection model (or similar) but that’s 3 functions for the adapter. All User model requirements come from Flask-security.

1. for SQLAlchemy
2. for Google App Engine
3. for MongoDB

Development environment with Vagrant

You can always use our vagrant. It should set up everything needed for tests or development. This should set up everything you need:

vagrant up --provision

The code will be kept in /vagrant/ directory. You have will get 3 python virtual enviroments setup:

• gae – for gae example
• sqla – for sqla example
• mongodb – for mongodb example

Activate one of them using virtualenvwrapper. For example to activate mongodb:

workon mongodb
python /vagrant/example/mongodb/main.py

Google App Engine example have to be run little bit different, it needs GAE development server layer wrapping Flask.

workon gae
python ~/google_appengine/dev_appserver.py --host 0.0.0.0 --port 5055 /vagrant/example/gae/

When you develope with and without vagrant because please remeber that flask-social-blueprint/example/gae/lib/ will be shared between machines, it may cause problems.

Setup OAuth with different providers

This blueprint needs client id's and secrets provided by social services you want to integrate with, here's where you setup them.

In examples we use http://dev.example.com:5055 URL to overcome limitations posed on localhost and 127.0.0.1 when setting up integrations. The http://example.com URL is guaranteed to be valid and may be used by anyone in demos and documentation. Just map dev.example.com to 127.0.0.1 and you're good to go.

Callback URLs use the name of the provider at the end. Obtain client ids and secrets from OAuth providers using main URL http://dev.example.com:5055 and callbacks URLS like these:

• http://dev.example.com:5055/_social/callback/Google
• http://dev.example.com:5055/_social/callback/Facebook
• http://dev.example.com:5055/_social/callback/Twitter
• http://dev.example.com:5055/_social/callback/Github
• http://dev.example.com:5055/_social/callback/Douban
• http://dev.example.com:5055/_social/callback/QQ

Twitter

Create new application here: https://apps.twitter.com/app/new

Google

1. Create new project here: https://console.developers.google.com/project
2. In APIs & auth > Credentials create Client ID
3. Update consent screen details, at least product name, home page and email address
4. Enable Google+ API

GitHub

Create new application here: https://github.com/settings/applications/new

Douban

Create new application here: http://developers.douban.com/apikey/apply

Facebook

Create new application here: https://developers.facebook.com/apps/

Setup Valid OAuth redirect URIs in Settings > Advanced > Security