Sean Fujiwara

Web Developer at YouTube

Read this first

Using the Cloud Vision API on App Engine

Here’s a quick snippet of how to use the Cloud Vision API on App Engine. It’s pretty straight forward, the only tricky thing is making sure you set the Content-Type.

import json
from logging import info
from urllib import urlencode
from google.appengine.api import urlfetch

headers = {'Content-Type': 'application/json'}
url = 'https://vision.googleapis.com/v1/images:annotate?%s' % urlencode({
    'key': '<google_api_key>'
})
payload = json.dumps({
    'requests': [
        {
            'image': {
                'source': {
                    'gcsImageUri': 'gs://bucket/path/to/file.jpg'
                }
            },
            'features': [
                {'type': 'LABEL_DETECTION', 'maxResults': 10}
            ]
        }
    ]
})
response = urlfetch.fetch(url, deadline = 30, method = urlfetch.POST, headers = headers, payload = payload)
response_data =
...

Continue reading →


Data binding in Polymer 1.0

https://www.polymer-project.org/1.0/api/dom-bind

<body>
  <template is="dom-bind">
    <h1>{{title}}</h1>
    <paper-slider value="{{title}}" style="width: 100%"></paper-slider>
  </template>
</body>

This took way too long to figure out. I only found out by looking at the Polymer unit tests.

View →


Let’s Encrypt on Google App Engine

Let’s Encrypt is a pretty awesome initiative to provide free SSL certificates to make creating a secure website easy. It comes with support for automatic installation on Apache and nginx, but requires some extra work for other servers.

Here’s how to use it with App Engine. I used Google Cloud Shell to run these commands.

Download the client:

git clone https://github.com/letsencrypt/letsencrypt
cd letsencrypt

Generate the certificate:

sudo ./letsencrypt-auto -a manual certonly

Part of the process is a challenge and response verification that you own the domain. You’ll see something like this:

Make sure your web server displays the following content at                                                                                                                             
http://www.example.com/.well-known/acme-challenge/[challenge] before continuing:
[response]
Content-Type
...

Continue reading →


How SWFWire works

This is an overview of a decompiler and a debugger I made in Flash a few years ago. This is mainly for my own reference.

There are three parts of SWFWire:

  • SWFWire Decompiler - A library for SWF and ABC decompilation
  • SWFWire Inspector - An app for viewing the decompiled contents of a SWF
  • SWFWire Debugger - An app for interactive debugging of SWFs

Disassembly

The disassembler takes binary data, and parses it according to the SWF spec.

SWF

The SWF file format is very well documented by Adobe. SWFs are binary files consisting of a header and a series of tags. The header gives you some basic metadata such as the target Flash Player version and stage dimensions. Each tag contains a type, length, and data section. The type tells you how to parse it, and the length lets you verify you’ve parsed that tag correctly, or skip it without knowing anything about the contents.

Basic data

...

Continue reading →


Load balancing WebSockets with ELB and nginx on EC2

Following this guide will allow you to create an Elastic Load Balancer for a WebSocket application with support for SSL and the ability to read client IP addresses.

Setup an Elastic Load Balancer

Enable TCP forwarding on port 80. If you want to use SSL, you must also upload a certificate and forward port 443.
elb-config.png

Enable the proxy protocol for your ELB

You can only enable the proxy protocol through the command line SDK.

aws elb create-load-balancer-policy --load-balancer-name my-load-balancer --policy-name EnableProxyProtocol --policy-type-name ProxyProtocolPolicyType --policy-attributes "AttributeName=ProxyProtocol,AttributeValue=true"

Enable the proxy protocol in nginx

Your nginx.conf should look something like this. By setting the X-Forwarded-For header to $proxy_protocol_addr, the WebSocket application will be able to get the client’s IP.

server {
  listen  80  proxy_protocol;
...

Continue reading →


Setting up Auto Scaling on EC2

This post is specifically about Ubuntu, but the process is similar for other operating systems. You’ll need to have an S3 bucket, and know how to launch EC2 instances.

Here’s a quick overview of the process:

  1. Create a bootstrap script that downloads installation files from S3.
  2. Create an install script that initializes your application code.
  3. Upload your install script and installation files to S3.
  4. Create an IAM role so your instances can download installation files.
  5. Create a Launch Configuration with your bootstrap script as the user data.
  6. Create an Auto Scaling group based on the launch configuration.

Create a bootstrap script

This is a minimal shell script that will install the AWS cli and nginx.

userdata.sh

!/bin/sh

echo Installing software
apt-get -y install awscli
apt-get -y install nginx

echo Setting directory permissions
chgrp -R ubuntu /etc/nginx
chown -R ubuntu
...

Continue reading →


Migrating to Socket.IO 1.0

There are a few things not covered in the official guide that I had to figure out on my own. Here is an example of the changes required for a mock application using namespaces, rooms, query strings, and a reverse proxy.

Client

var socket = io.connect('//example.com/mynamespace?mynumber=123', {
            'force new connection': true,
            'resource': 'path/to/socket.io'});
socket.on('connect_failed', function(data)
{
    console.log('connect_failed');
});
socket.on('connecting', function(data)
{
    console.log('connecting');
});
socket.on('disconnect', function(data)
{
    console.log('disconnect');
});
socket.on('error', function(reason)
{
    console.log('error');
});
socket.on('reconnect_failed', function(data)
{
    console.log('reconnect_failed');
});
socket.on('reconnect', function(data)
{
    console.log('reconnect');
});
socket.on('reconnecting', function(data)
{
...

Continue reading →