Working with SteemConnect - part 1

Recently I have been working on implementing SteemConnect (v2) into one of my projects. I spent most of the time working through documentation and figuring out why stuff wasn't working (that can be a pita when the error messages are far from descriptive of the actual error), so I figured I write a post about it to help others that would like to work with SteemConnect.

This is actually part 1 of multiple and just to demonstrate the basics. DO NOT USE THIS IN PRODUCTION as that requires some security measures to be implemented that below example is missing. I will explain more about that in a later post.

What you'll need

• Python (3.5 or newer)

Step 1

First, we need to create a proxy account for our app. To do that, go to https://v2.steemconnect.com/dashboard and log in. Then go to My Apps and choose New App. Follow the instructions, but pay special attention to the Redirect URI(s). For developing our app, we need to have at least the following in there:

The description, icon, and website are not required for now.

Step 2

Now, create your project directory (and preferably enter a virtual environment) and install the required Python packages:

$ pip install --upgrade pip
$ pip install Flask requests

Step 3

Fire up your favorite text editor, create a new Python file, and add the following code:

_{Sorry I put an image here, but the MarkDown parser is messing up the code.}

Be sure to substitute example.app on line 15 for the correct proxy account name you registered with SteemConnect.

Save the file (I named it myapp.py here), and start your development server:

$ python ./myapp.py
 * Running on http://127.0.0.1:5000/ (Press CTRL+C to quit)
 * Restarting with stat
 * Debugger is active!
 * Debugger PIN: 319-397-664

Step 4

Open up your favorite browser and go to http://127.0.0.1:5000/login
You'll then be redirected to SteemConnect:

Click CONTINUE and login with your Steem credentials (for this example, your memo-key is sufficient):

You'll then be redirected back to your local development server. If all went well, you'll see something as follows:

How it works

We first hit the /login route on our server:

@app.route('/login')
def login():
    query_string = urllib.parse.urlencode({
        'client_id': 'example.app',
        'redirect_uri': url_for('callback', _external=True),
        'scope': 'login',
    })
    url = "https://v2.steemconnect.com/oauth2/authorize?{qs}".format(qs=query_string)
    return redirect(url, code=302)

All this does, is redirect you to SteemConnect, with some added parameters in the URL. In this case, it will result in a redirect to the following URL: https://v2.steemconnect.com/oauth2/authorize?client_id=example.app&redirect_uri=http%3A%2F%2Flocalhost%3A5000%2Fcallback&scope=login

---

Then, after logging in with SteemConnect, you are redirected back to your server. This triggers the /callback route:

@app.route('/callback', methods=['GET'])
def callback():
    access_token = request.args.get('access_token')

    headers = {
        'Authorization': access_token,
        'Accept': 'application/json',
    }
    error = None
    try:
        response = requests.get("https://v2.steemconnect.com/api/me", headers=headers, timeout=10)
    except RequestException as ex:
        error = str(ex)

    status = response.status_code
    if status != 200:
        error = "Got {} response from server.".format(status)

    try:
        response_json = response.json()
    except ValueError:
        error = "Received invalid response from server."

    if error:
        return error

    return "
Great success!
You are now logged in as: {}
Account info:
{}
".format(response_json.get('user'), response_json.get('account'))

SteemConnect has added an access-token to the URL, which we can then use to authenticate when we request a protected resource (or, for instance, want to broadcast a transaction on the network on behalf of the user). In this case, we request the URL https://v2.steemconnect.com/api/me and add the access-token to the headers of that request: Authorization: very_long_string_of_hexadecimal_characters.

---

Next up

I'll show you how to first get an authorization-code and then request the access-token with that. This enables us to refresh the token when it is (almost) expired, to prevent the user from having to sign in again each time the token expires.

---

^{Me and my fellow blockbrothers are a witness as @blockbrothers. If you want to support us we would appreciate your vote here. Or you could choose to set us as your proxy.}

Vote for @blockbrothers via SteemConnect
Set blockbrothers as your proxy via SteemConnect

^{As blockbrothers, we build Steemify, a notification app for your Steemit account for iOS.
Get it Here:}