Pekerja Web HTML5
Pekerja Web
Memperkenalkan konsep pekerja web dalam spesifikasi html5 untuk menyelesaikan masalah bahawa JavaScript sisi klien tidak boleh berbilang benang kod, tetapi web Pekerja berada dalam persekitaran serba lengkap dan tidak boleh mengakses objek tetingkap dan objek dokumen utas utama Ia hanya boleh berkomunikasi dengan utas utama melalui mekanisme penghantaran mesej tak segerak
. Kita perlu meletakkan kod JavaScript yang ingin kita laksanakan secara berasingan ke dalam fail js yang berasingan, dan kemudian memanggil pembina Pekerja dalam halaman untuk mencipta utas Parameter ialah laluan fail Jika storan parameter ialah alamat relatif, maka skrip yang mengandungi pernyataan yang memanggil pembina Pekerja harus digunakan sebagai rujukan Jika ia adalah laluan mutlak, Ia adalah perlu untuk memastikan asal yang sama (protokol + hos + port). Fail ini tidak memerlukan kami menggunakan teg skrip untuk memaparkan rujukan pada halaman
var worker=new Worker('js/worker.js');
Mudah Contoh kecil
Paparkan semua nombor dari 0 hingga 10000 yang boleh dibahagi dengan n pada halaman Sudah tentu, kami tidak menggunakan i*n untuk membuat pengiraan sedikit lebih rumit
index.html
<!DOCTYPE html>
<html>
<head>
<title>Web Workers</title>
</head>
<body>
<h1>Web Workers</h1>
<div id="test" style="width:500px;"></div>
<script type="text/javascript">
var worker=new Worker('js/worker.js');
worker.postMessage({
n:69
});
worker.onmessage=function(e){
var test=document.getElementById('test').innerHTML=e.data;
};
</script>
</body>
</html>/js/worker.js
function calc(n){
var result=[];
for(var i=1;i<10000;i++){
var tem=i;
if(i%n==0){
if(i%(10*n)==0){
tem+='<br/>';
}
result.push(tem);
}
}
self.postMessage(result.join(' '));
self.close();
}
onmessage=function(e){
calc(e.data.n);
};Kesan paparan:
Buat fail pekerja web
Sekarang, Mari cipta pekerja web kami dalam JavaScript luaran.
Di sini kami mencipta skrip pengiraan. Skrip disimpan dalam fail "demo_workers.js":
var i=0;
function timedCount()
{
i=i+1;
postMessage(i);
setTimeout("timedCount()",500);
}
timedCount();
Bahagian penting dalam kod di atas ialah kaedah postMessage() - ia digunakan untuk menghantar mesej kembali ke halaman HTML.
Nota: pekerja web biasanya tidak digunakan untuk skrip mudah seperti itu, tetapi untuk tugas yang lebih intensif CPU.
Buat Objek Pekerja Web
Kami sudah mempunyai fail pekerja web, kini kami perlu memanggilnya dari halaman HTML.
Kod berikut mengesan sama ada pekerja itu wujud, jika tidak - ia mencipta objek pekerja web baharu dan kemudian menjalankan kod dalam "demo_workers.js":
if(typeof (w) =="undefined")
{
w=new Worker("demo_workers.js");
}
Kemudian kita boleh berlaku daripada pekerja web dan Menerima mesej .
Tambahkan pendengar acara "onmessage" pada pekerja web:
w.onmessage=function(event){
document.getElementById("result").innerHTML= event.data;
};
<pApabila web="" worker="" menghantar mesej, kod dalam pendengar acara akan dilaksanakan. event.data="" mengandungi data daripada ="" event.data="".
Tamatkan Pekerja Web
Apabila kami mencipta objek pekerja web, ia akan terus mendengar mesej (walaupun selepas skrip luaran selesai) sehingga ia ditamatkan.
Untuk menamatkan pekerja web dan melepaskan sumber penyemak imbas/komputer, sila gunakan kaedah terminate():
w.terminate();
