Webdev Excerpts

Recently I needed to implement social media buttons with a custom look and feel. The "custom look and feel" part meant that I couldn't simply use the vendor supplied embed scripts. If I did then yes, I could use CSS to hide the vendor's button, but the browser's restriction on third-party iframe content meant I still couldn't access the share counts. I would need to use the vendor API's for obtaining share counts.

After a little research (Googling) I realized each vendor had a slightly different API. Some supported CORS or JSONP and were publicly documented, while others supported neither and were not public (I'm looking at you Google+). In short, there was no way to get the share counts I needed for the most popular vendors directly from the browser. A server-side script or service was required.

I figured I'd write a Node.js app that's a local proxy exposing a JSON API for obtaining social media share counts: socoapi. This way front end logic can be a bit simpler making only one XHR request to socoapi for obtaining the share counts. You can install socoapi with Node's package manager npm: npm install socoapi. Now you can use it as a standalone server or embedded in some other application.

Caching is also supported by the socoapi server. Here is the signature to the listen() method: listen(port, cachettl [,callback]). cachettl are the milliseconds to cache API responses for. This way vendor servers are not overburdened needlessly.

The socoapi API supports CORS (but currently not JSONP) and has two endpoints. The first endpoint is really all you need:

GET /counts?url=[the url to get share counts for]

This returns the share counts for url from all supported vendors. Be sure to percent-encode any query component to the share url. For example, GET /counts?url=http://www.foobar.baz/%3Fq1%3Dv1%26q2%3Dv2

If using socoapi as an embedded component to an application running behind a reverse proxy an Apache Virtual Host configuration might look something like this: