Posts in "Uncategorized" category

How to debug REST/JSON services

I recently had to write a webservice in PHP that were to be used by iPhone/Android apps to post data and images to. With standard HTTP POSTS I’ve usually just created a quick dummy html to post data to the server to test, but this time I had to do some research on how to quickly test the services while developing… Just writing it down here so I don’t forget :-)

cURL to the rescue

So, let’s say I have a service that requires a session_id, title and comment_text. This can be called from the command line with cURL like this:

curl -X POST -d '{"session_id":"2399024390","title":"This is my title","comment_text":"Some text"}'

You’ll get the response on the command line right there so it makes it quick to debug stuff while developing.

What about posting files?

I had a challenge where one of the services were to accept a base64_encoded image in the JSON post, so the simple curl example above wouldn’t suffice. My friend Frode had the idea of using PHP on the command line to save the JSON request array to a file and then posting that request using cURL afterwards. That did the trick!

So, to create the JSON array to POST to the server I ran this PHP code:

php -r 'file_put_contents("json.txt", json_encode(array("session_id" => "3d6e4871170d4c1c2d91a18264904587b2c8ee0d","image_caption" => "This is an image","sender_email" => "[email protected]","sender" => "My nick", "image_base64" => base64_encode(file_get_contents("gmail.png")))));'

Notice the “image_base64” key in the JSON array there. The server expects to receive a base64 encoded binary image (this is how I got it from the apps that were interacting with the webservice). So that code would read gmail.png which was located in the same folder, base64 encode it and add it to the JSON array.

With a complete JSON array all that remained was the actual POST:

curl -X POST -d @json.txt

And the server returned {“status”:”ok”} and all was well!

There are probably better ways and some awesome tools for doing this out there so please hit me with those in the comments ;-)

Minimal HTML5 iPad Offline Cache Test

I just pushed a HTML5 template called “Minimal HTML5 iPad Offline Cache Test” to github:

Basically it’s a demo of a simple webpage that can be cached offline on an iPad. It also contains the meta tags required to make it work as a so-called “webclip”, that is you can add it to the homescreen on an iPad and it will open in fullscreen without the URL bar at top and without any other safari elements.

You can try out a demo here:

Testing the demo

To test it on your iPad navigate to the demo and click the icon with the arrow to the left of the URL bar and then click “Add to Home Screen” in the menu:

After that you should see the icon on your homescreen:

The Minimal HTML5 Offline Cache Test added to homescreen

Click the icon and it should look like this:

Sweet. No trace of Safari – it looks like a native app (or it could if we just styled it).

Now, let’s test it offline. Set your iPad in “Airplane mode” and click the icon again to test. You should see this:

Don’t worry, that popup means that everything works. You’re in offline mode, so Safari is not able to cache anything. You’ll find the code for listening to these window.applicationCache errors in offlinetest.js .. you do not have to load that file if you do not want to.

If you’re not able to use the page linked above offline on your iPad the problem is most likely with your iPad.

Troubleshooting – what if it does not work

The template above should work, if it doesn’t work something is most likely wrong with either your iPad or your webserver (or your files..)

Here’s some quick troubleshooting pointers:

  • If the demo page does not work for you, try upgrading your iPad software. I was running 4.2.2 and had problems getting offline caching to work but after upgrading to 4.3.5 everything worked perfectly.
  • If the demo works, but it does not work when you upload on your own server, it might be that the .htaccess does not work on your server so that the cache.manifest file isn’t getting sent to the browser with the “text/manifest” mime-type. Try out the manifest validator.

Also, note this (from “Dive Into HTML5”):

The first is something you just read, but I bet it didn’t really sink in, so here it is again: if even a single resource listed in your cache manifest file fails to download properly, the entire process of caching your offline web application will fail. Your browser will fire the error event, but there is no indication of what the actual problem was.

Download the files from github:

Good luck! :-)

SEO Lite – The one calorie SEO addon for ExpressionEngine 2.x

A while back I released DevKit for ExpressionEngine using the module “SEO Lite” as an example. Now this module is ready for download!

Click here to download SEO Lite

Full documentation: SEO Lite documentation

A SEO module for ExpressionEngine – what does it do?

Sure you could add custom fields for this kind of meta data, but SEO Lite makes it cleaner and easier to use for the client.

SEO Lite is a lightweight addon for ExpressionEngine that adds SEO meta data for title, keywords and description for entries on your site, enabling them to rank better in the search engines. It uses a template which you can customize to your needs.

It will add a new tab to the publish entry page called “SEO Lite” where you specify title, keywords, and description for the entry.

If you do not specify anything the original entry title will be used, together with the default values for keywords and description.

Why Lite?

First, it’s very lightweight – you only use one tag to output the template, and this tag uses only one database query to fetch the template, entry title, default entry keywords/description or/and the specific keywords/descriptions for that entry.

So you add the power of SEO optimalization with only one query which should be a good tradeoff and perfect for high-traffic websites.

Second, it’s lite functionality-wise as well. No frills. If you want a more extensive module I recommend NSM Better Meta which is a very good commercial alternative.

The template

The default meta data template looks like this:

<title>{title} - {site_name}</title>
<meta name='keywords' content='{meta_keywords}' />
<meta name='description' content='{meta_description}' />
<!-- generated by seo_lite --!>

This can be edited in the SEO Lite Settings. The only thing that’s replaced by SEO Lite is {title}, {meta_keywords} and {meta_description} and you can use any kind of global variables and EE conditionals in it which should make it pretty powerful.

The Tag

Use this tag in your header template to output the template above:

{exp:seo_lite url_title="{segment_3}"}

The url_title parameter uses {segment_3} to find the entry based on the current url. If you have the entry_id you may also use it like this:

{exp:seo_lite entry_id="{entry_id}"}

Installing the module in a WooTheme

Here’s a video showing how to install the module and use it with any of the WooThemes:

Of course this process will be the almost identical on any site.

ScribeSEO Support In The Works

I’m currently implementing support for ScribeSEO. To get an update when this is ready subscribe to my RSS feed or follow me on Twitter.


Download .zip

Documentation, support, download etc. available over at

Let me know what you think! :-)