Pengesahan data adalah bahagian penting dalam mana-mana aplikasi web kerana ia membantu memastikan data yang dimuat naik menepati keperluan tertentu yang dikenakan oleh pembangun. Data boleh disahkan pada kedua-dua bahagian pelayan dan klien tetapi pengesahan pihak klien selalunya menjimatkan masa pengguna dan membuktikan pengalaman pengguna yang lebih baik dan lancar. Pengesahan data pihak pelanggan boleh dilakukan dengan mudah dan menggunakan lebih sedikit masa.
Dalam panduan cara ini, kami akan melalui proses mencipta borang menggunakan HTML, JavaScript/jQuery yang mengesahkan saiz fail semasa ia dimuat naik. Faedah pengesahan ini ialah kami boleh menyekat pengguna untuk memuat naik hanya saiz fail tertentu dan memastikan mereka mematuhi keperluan kami dengan ketat. Jika saiz fail adalah salah, kami boleh menggesa mesej kepada pengguna tanpa memuat naik fail ke pelayan yang menjimatkan masa yang berharga.
Buat Halaman Web
Pertama, kami akan membuat halaman web HTML yang mudah:
DOCTYPE html >
< html >
< kepala >
< tajuk >
Pengesahan bagi fail saiz sementara memuat naik menggunakan JavaScript / jQuery
tajuk >
kepala >
< badan gaya = 'padding-top: 10px; text-align:center;' >
< hlm > Muat naik a fail hlm >
< input ID = 'fail' menaip = 'fail' gaya = 'padding-left: 95px;' />
< br >< br >
< butang onclick = 'SizeValidation()' > Muat naik butang >
badan >
html >
Memahami Kod:
Dalam badan halaman web, kami hanya menggunakan a , ,
dan a
The
Tentukan Fungsi JavaScript sizeValidation().
Sekarang mari kita tulis kod JavaScript yang mentakrifkan sizeValidation() fungsi.
< skrip >
fungsi saizPengesahan ( ) {
input var = document.getElementById ( 'fail' ) ;
adalah fail = input.files;
jika ( file.length== 0 ) {
amaran ( 'Tiada fail dipilih' ) ;
kembali salah ;
}
var fileSize = Math.round ( ( fail [ 0 ] .saiz / 1024 ) ) ;
jika ( saiz fail < = 5 * 1024 ) {
amaran ( 'Dimuat naik' ) ;
} lain {
amaran (
'Ralat! Fail terlalu besar' ) ;
}
}
skrip >
Memahami Kod:
Di dalam badan sizeValidation() fungsi kita mula-mula mendapatkan tag dan kemudian gunakan fail var = inputElement.files; talian supaya kita boleh mendapatkan akses kepada fail yang sedang dimuat naik. Kemudian kami menyemak sama ada fail telah dimuat naik, jika tidak, kami akan menggesa mesej ralat dan keluar daripada fungsi dengan mengembalikan palsu.
Kami kemudian menggunakan beberapa matematik untuk menentukan saiz fail. Jika fail bersaiz sesuai iaitu, 5MB (dalam kes ini), ia dimuat naik.
Jika tidak, pop timbul yang mengandungi mesej ralat dipaparkan.
Kesimpulan
Walaupun pengesahan pihak klien jauh lebih cekap, ia masih bukan pengganti untuk pengesahan sisi pelayan dan boleh dielakkan dalam kebanyakan kes. Ia sentiasa menjadi amalan terbaik untuk melaksanakan kedua-dua pelayan dan pengesahan pihak pelanggan supaya anda boleh memastikan kedua-dua kecekapan dan ketepatan aplikasi anda.