Wednesday, December 12, 2007

Nhúng dữ liệu vào URL

Theo cách thông thường, nếu muốn trình bày một hình ảnh ở một trang web, người làm web phải chứa hình ảnh ở một nơi, rồi viết một thẻ HTML gọi đến nơi chứa hình ảnh đó. Và như vậy, trong trường hợp thực tế là, ở một trang cho người dùng soạn thảo nội dung có 50 hình ảnh biểu cảm, thì phía người dùng sẽ phải gửi đến máy phục vụ web ít nhất là 50 yêu cầu. Nếu như có cách nào đó, 50 hình ảnh này được mã hóa dưới dạng văn bản và được nhúng ngay trong trang web thì số yêu cầu từ phía người dùng gửi đến máy phục vụ web sẽ giảm đi rất nhiều; và như vậy, tốc độ hiển thị trọn vẹn trang web sẽ tăng lên rất đáng kể.

Với ý tưởng này, các nhà phát triển chuẩn web đã đưa ra một chuẩn mới, cho phép nhúng nhiều dạng dữ liệu vào ngay trong phần HTML của trang web. Cấu trúc của chuẩn khá đơn giản:

data:[][;base64],

;base64 có trong cú pháp nếu như dữ liệu được mã hóa dạng base64. Nếu như phần không có trong cú pháp, thì sẽ được ngầm hiểu là text/plain;charset=US-ASCII. Về phần cú pháp này, bạn có thể yên tâm, không hiểu cũng không sao.Vì dựa trên cú pháp này, có nhiều phần mềm giúp mã hóa dữ liệu và viết giùm cú pháp cho chúng ta.

Tôi xin đưa ra một ví dụ đơn giản, đây là thẻ HTML chèn một hình ảnh của một dấu tròn đỏ ở dạng png đã được mã hóa dạng base64:

<img src="data:image/png;base64,%20iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABGdBTUEAALGP%20C/xhBQAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9YGARc5KB0XV+IA%20AAAddEVYdENvbW1lbnQAQ3JlYXRlZCB3aXRoIFRoZSBHSU1Q72QlbgAAAF1J%20REFUGNO9zL0NglAAxPEfdLTs4BZM4DIO4C7OwQg2JoQ9LE1exdlYvBBeZ7jq%20ch9//q1uH4TLzw4d6+ErXMMcXuHWxId3KOETnnXXV6MJpcq2MLaI97CER3N0%20vr4MkhoXe0rZigAAAABJRU5ErkJggg==" alt="Red dot" />

Như đã giới thiệu ở trên, website http://www.scalora.org/projects/uriencoder/ giúp chúng ta mã hóa file hình ảnh và tạo cú pháp cho dữ liệu nhúng của chúng ta. Sử dụng trang web này cũng khá đơn giản. Ở phần upload một file, bạn bấm nút browse để chọn một file ở máy tính của mình; sau đó, nhấp nút encode file, trang web sẽ hiển thị cú pháp của dữ liệu cho chúng ta.

Với các dịch vụ đánh dấu trang web hiện nay (như digg, delious, ...), chúng ta có dễ dàng lưu trữ trực tuyến những dữ liệu nhỏ nhỏ của mình. Xin chú ý, chuẩn này được hỗ trợ trên hầu hết các trình duyệt web, nhưng đối với Internet Explorer thì lại không và dữ liệu tối đa có thể được nhúng cũng có các giới hạn khác nhau ứng với mỗi trình duyệt, thí dụ, Firefox thì hỗ trợ 10 KB còn đối với Opera thì hỗ trợ chỉ 5 KB.

No comments: