Monthly Archives: January 2011

Why you shouldn’t rely on ajax’s same origin policy

XmlHttpRequests (or “ajax“) is generally considered to be safe because it is restricted by the “same origin” policy, but that isn’t entirely correct. Consider the following: an ajax-call, like all http communication, consists of a request and a response. For read-operations the response is needed, for write-operations … that ain’t necessarily so!

So how can a “hacker” send a request for such a write-operation and have it executed (which amounts to  “cross site request forgery” actually)? There’s a number of  possibilities:

  1. Execute a GET-request by including it in the attack-site html as the src of a script, css or img tag, for all of which the same origin-policy does not apply.
  2. Using JavaScript to create a form, populate it and POST it, the same-origin policy does not apply to forms being posted.
  3. Just do a normal XHR-request, the same-origin policy applies, but some top-notch browsers will execute the request and just ignore the response (is that a bug or a feature?)

Conclusion: if you want to do anything more than read-requests on the same domain, you really-really-really have to protect your resources against CSRF using one of the techniques that are described in this wonderful OWASP CSRF cheat-sheet.

As found on the web (January 26th)

blog (feed #46)
generic (feed #50)
generic (feed #49)
facebook (feed #40)
frank Frank was gisteren nog stevig verkouden, maar voelt zich dankzij z’n vrouwtjes geneeskrachtige kippensoep vandaag een heel stuk beter! :-)..
generic (feed #50)
generic (feed #50)
blog (feed #46)
generic (feed #49)
facebook (feed #40)
frank Frank maakte een pannetje havermoutpap zoals hij dat 30 jaar geleden ook graag at :-)..

Did Flash really become irrelevant in 2010?

Little over a year ago I must have been smoking some weird shit when writing that Flash would become irrelevant in 2010. Because after all, this is 2011 and there’s still plenty of Flash for Adobe aficionados to make a living and the famous html5 video codec issue hasn’t been fully sorted out yet either. So I was wrong, was I? Well, … not really!

Apple still stubbornly refuses Flash on the iPhone and more importantly the iPad, Microsoft’s Internet Explorer 9 joined the HTML5-crowd in full force and even Adobe is going HTML5 with support in Dreamweaver and in Illustrator and with a preview of Edge, “a tool for creating animation and transitions using the capabilities of HTML5″.

But is was only in December 2010 that I knew I was dead on with my prediction, when I overheard this conversation at work between a business colleague and a web development partner:

Business Colleague: I would like a personalized dashboard with some nice-looking charts in my web application.
Web Development Partner: No problem, we’ll do it in Flash!
Business Colleague: No, we want this to work on the iPad too!

The year technology-agnostic decision-making business people started telling suppliers not to use Flash, that was the year Flash became irrelevant and “the open web technology stack” (somewhat incorrectly marketed as HTML5) took over.

Underworld live bij KCRW: paniek over kapotte knoppekes

De oudere jongeren van Underworld waren onlangs bij KCRW in de studio om daar wat muziek maken. Ze speelden onder andere “Two months off”, hieronder op YouTube. Best een fijn riedelke, meeslepend en zo, maar live in de radiostudio deed me dat toch niet veel. Tot er, 4 minuut 40 seconden ver in de trip, iets fout liep met een knoppeke of misschien wel met een hele sequencer. Karl Hyde gesticuleert dat de boel kapot is, Darren Price probeert Hyde met gebaren duidelijk te maken wat hij moet doen om de machinerie terug op gang te trekken, Rick Smith lijkt rustig “ik doe nog wel wat verder” te zeggen terwijl de roadie erbij wordt gehaald en Hyde ziet op 5 minuten 30 dat pakweg het volume gewoon op nul stond:

Underworld performing "Two Months Off" on KCRW

Watch this video on YouTube or on Easy Youtube.

“So we mumbled a bit” eindigt Hyde. Hij is dan ook al 53.

As found on the web (January 19th)

generic (feed #49)
generic (feed #49)
Watch this video on YouTube or on Easy Youtube.

youtube (feed #51)

Watch this video on YouTube or on Easy Youtube.

– Clockwatching.

Watch this video on YouTube or on Easy Youtube.

generic (feed #49)
generic (feed #49)
blog (feed #46)
Watch this video on YouTube or on Easy Youtube.

youtube (feed #51)

Watch this video on YouTube or on Easy Youtube.

Paul Ft Heleen Vandamme – Temperature/Bel Me Even Op.

Watch this video on YouTube or on Easy Youtube.

How to do jQuery templates with jQote2

For a proof of concept I was preparing at work I needed a jQuery templating solution. Although there is beta templating support (contributed by Microsoft) in jQuery, I decided to implement jQote2 instead. This alternative jQuery plugin is small (3,2Kb minimized, 1,7Kb compressed), versatile and most importantly very, very fast!

So what do you need to know about jQote2 to get it working? Well, there’s 3 ingredients; data, template and javascript-code to put the data in the template.

The data can be fetched from an external source, e.g. this call to the iRail-api for departures from Brussels North.

The template is basically just HTML with some placeholders for your data:

<script type="text/x-jqote-template" id="liveboard_tmpl">
 <tr>
  <td class="left">	
   <%= this.station %>
  </td>
  <td class="right">
   <%= this.time %>
  </td>
  <td class="right">
   <%= this.platform %>
  </td>
 </tr>
</script>

The javascript fetches the data using jQuery’s getJson, parses all departures in the template and adds the resulting HTML to an element in your DOM (in this case #liveboard’):

<script type="text/javascript">
$(document).ready(
	function() {
		$.getJSON(
			'http://api.irail.be/liveboard/?format=json&station=Brussel%20Noord&lang=EN&arrdep=DEP&callback=?',
			function(data) {
					$('#liveboard').jqoteapp('#liveboard_tmpl', data.departures.departure);
			}
		)
	}
);
</script>

Off course the UNIX-timestamp in this.time isn’t really usable, but we can easily add some javascript to the template, just before outputting the time, to fix that;

<% this.time=((new Date((Number(this.time))*1000)).toLocaleTimeString()).substr(0,5); %>

That’s right, use “<%” instead of “<%=” and you can mingle javascript in the template. To only show trains that have not left and to show departures including delay, the template looks like this:

<script type="text/x-jqote-template" id="liveboard_tmpl">
<% if (this.left!="1") { %>
 <tr>
  <td class="left">
   <%= this.station %>
  </td>
  <td class="right">
   <% if (this.delay!="0") {
    this.time="<span class=\"delayed\">"+((new Date((Number(this.time)+Number(this.delay))*1000)).toLocaleTimeString()).substr(0,5)+"</span>";
   } else {
    this.time=((new Date((Number(this.time))*1000)).toLocaleTimeString()).substr(0,5);
   } %>
   <%= this.time %>
  </td>
  <td class="right">
   <%= this.platform %>
  </td>
 </tr>
<% }; %>
</script>

Add some CSS and you’ll quickly have something like the demo you can find here. Just look at the code, it’s pretty straightforward and check out the jQote2 reference for even more info.

As found on the web (January 12th)

generic (feed #49)

Watch this video on YouTube or on Easy Youtube.

youtube (feed #51)

frank liked

Watch this video on YouTube or on Easy Youtube.

Legend & The Roots "I Can’t Write Left Handed" Bill Withers Cover (LIVE) at iheartradio.

Watch this video on YouTube or on Easy Youtube.

blog (feed #46)
generic (feed #49)
generic (feed #49)
generic (feed #49)
generic (feed #50)
generic (feed #50)