Whee! Doing a stunt!

Hello, I blog!

I share all my sporadic and toilet thoughts in here, because I am random like that.

Prevent automated registrations with JS

After GameMaki (one of my current pet projects) was hit by an onslaught of spam, I spent the last couple of hours thinking about how to prevent automated registrations.

Originally, I attempted a very primitive method, which is to add a hidden field in the registration form which is set to ‘true’ when the form is loaded on a Javascript-enabled browser. When the form is submitted, this hidden field is checked for its value, and it only goes through when the value is ‘true’.

Obviously it hadn’t worked. It was too straightforward, and I’m pretty sure bots are much smarter than that.

So I thought, checking for whether the site was loaded in a standard browser wasn’t good enough. In order for a request to be human-initiated, there has to be some sort of interaction with the website – whether it is a click, scroll or focus.

jQuery slider by TheyMakeApps for form submission.
jQuery slider by TheyMakeApps for form submission.

TheyMakeApps has quite a cool implementation that requires some form of human interaction to successfully submit a form. Instead of a standard ‘click’ to the submit button, their implementation requires the user to drag a slider to an end-point. jQuery is used to detect the position of the slider and the form will submit only when the slider has reached a certain point in the bar.

Quite nifty, but it didn’t feel natural. People are used to hitting ‘tab’ when navigating from one form field to another, before a final ‘tab’ and an ‘enter’ to submit a form.

I didn’t want to yank users out of their comfort zone. So, how do I check for automated registrations without imposing any additional burden to the user? (And quite obviously, CAPTCHAs are out of the question.)

Here’s how I eventually did it. Well, it still involves a hidden field, for sure.

Place a hidden field in your form as follows. This field has a unique ID of ‘botcheck’ with a default value of ‘false’.

<input type="hidden" name="botcheck" id="botcheck" value="false" />

Now, what we need is a bit of Javascript and jQuery.

I have two functions in my Javascript file. The first function, randomString() generates a random string of numbers to populate the hidden field with. The second is the validation function which will be called when the form is submitted. On top of that, we have one global variable to track the value of the generated random string.

// Global variable
var randomstring = "";

// Function to generate a random string
function randomString() {
  var chars = "0123456789ABCDEFGHIJKLMNO
PQRSTUVWXTZabcdefghiklmnopqrstuvwxyz";
  var string_length = 8;
  for (var i=0; i<string_length; i++) {
    var rnum = Math.floor(Math.random() * chars.length);
    randomstring += chars.substring(rnum,rnum+1);
  }
}

// Function to verify hidden field value
function doBotCheck() {
  var botcheckfield = $('#botcheck').val();
  if (botcheckfield == randomstring) {
    return true;
  } else {
    alert("Hello, robot!");
    return false;
  }
}

Note: Credit for the randomString() function goes to MediaCollege.

Now that we have all our Javascript functions ready, let’s add a bit of jQuery magic.

On document load, a random string will be generated. A ‘focus’ event is bound to all my form’s input fields. When this event is triggered, the hidden field is populated with the random string.

I chose the ‘focus’ event as it requires manual user interaction with the form to verify that the user of the form is indeed a human. (Originally, I contemplated using the ‘change’ event but decided against it since the fields can be directly manipulated via a script anyway.)

The use of a random string ensures that the value of the hidden field will not be easy to guess if the spammer wanted to directly manipulate it.

So, we have this.

//Populate hidden field only when user triggers a manual interaction with the form
$(document).ready(function() {
  // Generate a random string
  randomString();

  // Update hidden field on field focus
  $('#MyForm input').live('focus', function() {
    $('#botcheck').val(randomstring);
  });
});

Last but not least, remember to call the validation function from your form on submit.

<form id="MyForm" onSubmit="return doBotCheck()" method="POST">

And wa-laaaaah.

Well, this is my method for now. Whether it works, I’ll just have to wait and see. If you see any flaws in my method, don’t hesitate to holler. And if you’ve better ideas on how to solve this problem, feel free to share ’em!

Oct
27 2010

Introspection

Been doing a lot of thinking recently.

After having worked full-time for close to half a year, my perspectives have changed greatly. I became more aware of what I was looking for in a job, while my limitations became even more salient through my own eyes.

I always thought I was invincible. I guess my reputation of being that “excellent programmer” and “awesome team member” people generally enjoyed working with back in university stroked my ego a little too much. I generally felt there was nothing I cannot do, and if I can’t – I’ll learn it, and pick it up in a snap.

As a result, methinks I bit off a little more than I could chew when I chose to be a part of this project. Other than being generally present in the social media scene (and doing part time social-media and copywriting for almost nine months), I hardly had any marketing experience. On the other hand, the job scope involved product evangelism through multiple platforms.

Thankfully, I had my programming experience to fall back on, and I ended up doing a mix of tech engineering and marketing. People tell me that being able to do multiple things is my strength – I could write, illustrate, design, code, photograph and conceptualize ideas.

Unfortunately, being able to do too much can also spiral downwards to become a weakness – you end up specializing in nothing. Basically, the jack of all trades but the master of none.

In the second month of my involvement, I was beginning to pick up the vibes. Unfortunately, I have a pretty strong intuition when it comes to picking up signals as to whether I am doing well, or otherwise. And I really hoped I would eventually prove my intuition wrong. The vibes told me that my capabilities were far short of what was expected, and that I’d better pull up my socks.

So I did. I picked up a whole new programming framework in less than a couple of weeks, when my past programming experiences involved little or no frameworks. I read up articles online and reference books on social media and marketing strategies (and applied theories). However, I soon realized that I was constantly playing a game of ‘catch-up’. And if I was doing that, it meant it was unlikely I were to ever significantly contribute something worthwhile.

I soon began to question myself and my abilities endlessly. Here I am in a startup filled with immensely brilliant people, all experts in their own field. They specialize in what they are doing, and they know their craft inside out. Me? I may be able to do many things, but my knowledge is at most surface level.

So, what on earth am I doing here?

I briefly brought up my thoughts to some of my closest friends, who told me repeatedly to stop being silly, that I was thinking too much, and that I had a ridiculously low opinion of myself. I hoped they were right too.

Unfortunately by then, my confidence was practically crawling on the floor – although my ego prevented me from admitting it back then. I really wanted to make a worthwhile contribution, for my presence to actually make a positive difference. However, I was usually struggling to play catch and quite a few times, ended up falling flat on my face. Either because I did something wrong, or produced something that wasn’t up to expectations.

Into the third month, I was beginning to pick up vibes that told me I could possibly be in trouble. I was becoming a bit redundant, and I was surrounded by people who could easily take over individual parts of what I am doing and do it ten times better.

The situation is much worse considering how I am a highly competitive industry. So it becomes a case of may the strongest win.

A couple of times, I have had thoughts of leaving. The team needs talented people who are skilled at their craft, not someone who simply knows the basics. The team needs people they can count on to surge forward in the face of stiff competition, not someone who has to catch up with the pace all the time. I was like a little dimbulb in the presence of all the bright souls around. However, I stayed on – ego strikes again, I suppose. Because leaving would make me seem like a quitter. And I am no quitter.

But the fourth month rolled around and I was beginning to feel really redundant. I mean, I was still contributing tirelessly. But I didn’t feel particularly useful.

It then dawned on me at that point in time that my ideal job has to go more than simply doing what I enjoy doing. I have internal expectations of myself when it comes to work, and I want to exceed them. I wanted to be a part of the forces that pushes things forward, and to make revolutionizing contributions and changes.

Unfortunately, I have way too many limitations in ability.

Limitations can be overcomed – that’s what I had always believed in. However, for someone with such a large ego to be suddenly aware of her multiple limitations, it was a bit too much to handle at one go.

Eventually, the inevitable happened. I was one of the first few to go when the team decided to downsize. And I would be lying if I said I didn’t see that coming.

Again, my intuition proved itself right.

I love my team. I am extremely proud of them and how far they’ve come. As for me being a part of it, I am uncertain as to whether I should be proud of myself or not because part of me thinks I don’t deserve to be there.

I still have faith that my knowledge and ability in multiple tasks will continue to be one of my strengths. However, this strength has to be fitting with the project I choose to work in. If a project involves a team of highly talented folks that are the best of the best in their individual fields, put together while complementing each other nicely, then chances are, I won’t fit in because I’d become redundant very fast.

Meanwhile, I’d try to put my shattered confidence together and continue to broaden my horizons in the world of marketing and social media in the coming months so that I can be my usual rockin’ self in the next project I join.

I had learned a lot in the past five months though. From work habits, to enriched experiences in my different fields – I had especially learned a lot about UX through one of my team mates, not to mention how my programming ability has improved by leaps and bounds. I had also picked up countless habits for creative thinking and idea generation. Oh and yeah, humility.

I still have a long way to go though. One can never be good enough. But I hope to get there.

And I hope the next round, my intuition will be telling me a different story.

More Stuff