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(port, cachettl [,callback]).
cachettl are the milliseconds to cache API responses for. This way vendor servers are not overburdened needlessly.
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,
socoapi as an embedded component to an application running behind a reverse proxy an Apache Virtual Host configuration might look something like this: