Sejauh ini, server yang kami buat tidak memiliki penggunaan praktis, jadi kami akan mulai menerapkan beberapa fungsi praktis dan berguna.
Yang perlu kita lakukan adalah: pengguna memilih file, mengunggah file, dan kemudian melihat file yang diunggah di browser.
Pertama -tama kita memerlukan TextArea untuk pengguna untuk memasukkan konten, dan kemudian mengirimkannya ke server melalui permintaan POST.
Kami menambahkan kode ke event handler start, dan memodifikasi requesthandlers.js sebagai berikut:
Salinan kode adalah sebagai berikut:
fungsi start (response) {
console.log ("permintaan pawang 'start' dipanggil.");
var body = '<html>'+ '<head>'+
'<meta http-equiv = "konten-tipe" content = "text/html;'+
'Charset = UTF-8 " />'+
'</head>'+
'<body>'+
'<Form Action = "/unggah" Metode = "POST">'+
'<textarea name = "text" rows = "20" cols = "60"> </textarea>'+
'<input type = "kirim" value = "kirim teks" />'+
'</form>'+
'</body>'+
'</html>';
response.writeHead (200, {"tipe konten": "teks/html"});
response.write (tubuh);
response.end ();
}
unggah fungsi (respons) {
console.log ("unggahan unggahan 'pawang' dipanggil.");
response.writeHead (200, {"tipe konten": "teks/polos"});
response.write ("Hello unggah");
response.end ();
}
Exports.start = Mulai;
Exports.upload = unggah;
Anda dapat melihat efeknya dengan mengunjungi http: // localhost: 8888/mulai di browser Anda.
Selanjutnya kami ingin menerapkan pemicu penangan permintaan /unggah untuk menangani permintaan posting ketika pengguna mengirimkan formulir.
Untuk membuat seluruh proses non-blocking, Node.js akan membagi data POST menjadi banyak blok data kecil, dan kemudian meneruskan blok data kecil ini ke fungsi callback dengan memicu peristiwa tertentu. Peristiwa spesifik di sini termasuk acara data (menunjukkan bahwa blok data kecil baru telah tiba) dan acara akhir (menunjukkan bahwa semua data telah diterima).
Kami melakukan ini dengan mendaftarkan pendengar pada objek permintaan. Objek permintaan di sini diteruskan ke fungsi panggilan balik OnRequest setiap kali permintaan HTTP diterima.
Kami meletakkan kode di server dan memodifikasi server.js sebagai berikut:
Salinan kode adalah sebagai berikut:
var http = membutuhkan ("http");
var url = membutuhkan ("url");
fungsi start (rute, handle) {
function onRequest (request, response) {
var postdata = "";
var pathname = url.parse (request.url) .pathname;
Console.log ("Permintaan" + Pathname + "Diterima.");
request.setencoding ("UTF8");
request.addlistener ("data", function (postdatachunk) {
postdata += postdatachunk;
console.log ("menerima post data chunk '" + postdatachunk + "'.");
});
request.addlistener ("end", function () {
rute (pegangan, pathname, respons, postdata);
});
}
http.createServer (onRequest) .listen (8888);
Console.log ("Server telah dimulai.");
}
Exports.start = Mulai;
Kode di atas melakukan tiga hal: Pertama, kami menetapkan format pengkodean dari data yang diterima ke UTF-8, dan kemudian mendaftarkan pendengar untuk acara "data" untuk mengumpulkan blok data baru yang diterima setiap kali dan menetapkannya ke variabel postdata. Akhirnya, kami memindahkan panggilan yang meminta rute ke end event handler untuk memastikan bahwa itu hanya akan menembak ketika semua data diterima dan hanya menembak sekali. Kami juga melewati data pos untuk meminta rute, karena data ini akan digunakan oleh penangan permintaan.
Selanjutnya, pada halaman /unggah, tampilkan input pengguna
Mari ubah router.js:
Salinan kode adalah sebagai berikut:
rute fungsi (pegangan, pathname, respons, postdata) {
console.log ("Akan merutekan permintaan untuk" + pathname);
if (typeof handle [pathname] === 'function') {
menangani [pathname] (respons, postdata);
} kalau tidak {
console.log ("Tidak ada penangan permintaan yang ditemukan untuk" + pathname);
response.writeHead (404, {"tipe konten": "teks/polos"});
response.write ("404 tidak ditemukan");
response.end ();
}
}
Exports.Route = rute;
Kemudian, di Requesthandlers.js, kami menyertakan data dalam respons terhadap permintaan unggahan:
Salinan kode adalah sebagai berikut:
fungsi start (respons, postdata) {
console.log ("permintaan pawang 'start' dipanggil.");
var body = '<html>'+
'<head>'+
'<meta http-equiv = "konten-tipe" content = "text/html;'+
'Charset = UTF-8 " />'+
'</head>'+
'<body>'+
'<Form Action = "/unggah" Metode = "POST">'+
'<textarea name = "text" rows = "20" cols = "60"> </textarea>'+
'<input type = "kirim" value = "kirim teks" />'+
'</form>'+
'</body>'+
'</html>';
response.writeHead (200, {"tipe konten": "teks/html"});
response.write (tubuh);
response.end ();
}
unggah fungsi (respons, postdata) {
console.log ("unggahan unggahan 'pawang' dipanggil.");
response.writeHead (200, {"tipe konten": "teks/polos"});
response.write ("Anda sudah mengirim:" + postdata);
response.end ();
}
Exports.start = Mulai;
Exports.upload = unggah;
Hal terakhir yang harus kami lakukan adalah: Saat ini kami meneruskan seluruh badan pesan dari permintaan ke routing permintaan dan penangan permintaan. Kita hanya boleh meneruskan data posting, bagian yang kita minati, ke routing permintaan dan penangan permintaan. Dalam contoh kami, yang kami minati adalah bidang teks.
Kami dapat menggunakan modul QueryString yang diperkenalkan sebelumnya untuk mengimplementasikannya:
Salinan kode adalah sebagai berikut:
var queryString = membutuhkan ("querystring");
fungsi start (respons, postdata) {
console.log ("permintaan pawang 'start' dipanggil.");
var body = '<html>'+
'<head>'+
'<meta http-equiv = "konten-tipe" content = "text/html;'+
'Charset = UTF-8 " />'+
'</head>'+
'<body>'+
'<Form Action = "/unggah" Metode = "POST">'+
'<textarea name = "text" rows = "20" cols = "60"> </textarea>'+
'<input type = "kirim" value = "kirim teks" />'+
'</form>'+
'</body>'+
'</html>';
response.writeHead (200, {"tipe konten": "teks/html"});
response.write (tubuh);
response.end ();
}
unggah fungsi (respons, postdata) {
console.log ("unggahan unggahan 'pawang' dipanggil.");
response.writeHead (200, {"tipe konten": "teks/polos"});
response.write ("Anda telah mengirim teks:"+ queryString.parse (postdata) .text);
response.end ();
}
Exports.start = Mulai;
Exports.upload = unggah;
OK, di atas adalah semua tentang memproses data post.
Di bagian selanjutnya, kami akan menerapkan fungsi mengunggah gambar.