Cara Menggunakan Pekerja Web Berkongsi JavaScript di HTML5

3Kami baru -baru ini membincangkan pekerja web JavaScript dengan merujuk kepada pelbagai "berdedikasi". Jika anda belum membacanya, saya cadangkan anda melakukannya terlebih dahulu - artikel ini membina konsep yang sama.

pekerja web secara ringkas

Pekerja web adalah fail JavaScript tunggal yang dimuatkan dan dilaksanakan di latar belakang pada benang yang berasingan. Pekerja web yang berdedikasi dikaitkan dengan pencipta mereka (skrip yang memuat pekerja). Pekerja web yang dikongsi membenarkan beberapa skrip untuk berkomunikasi dengan pekerja tunggal. Pekerja web yang dikongsi mematuhi peraturan yang sama seperti rakan-rakan berdedikasi mereka: tidak ada DOM, dokumen atau akses skrip halaman, dan kebenaran baca sahaja yang terhad kepada kebanyakan sifat tetingkap. Di samping itu, skrip halaman hanya boleh berkomunikasi dengan pekerja web bersama dari asal/domain yang sama (somesite.com). Pada masa ini, pekerja web berkongsi disokong di Chrome, Safari dan Opera. Sokongan Firefox 4 dan IE9 mungkin tiba, tetapi jangan bertaruh. Pekerja bersama boleh menjimatkan sumber tetapi mereka menambah tahap kerumitan tambahan. Jangkakan beberapa isu, mis.,

• acara DOM2 (addEventListener) Pengendali kelihatan sebagai pelaksanaan yang paling boleh dipercayai.
• Anda pasti akan menemui kebiasaan dan debug khusus penyemak imbas adalah sukar. Kod berikut berfungsi dalam versi terkini Chrome, tetapi jangan menganggap ia akan berfungsi di Safari atau Opera.

Membuat Pekerja Web Dikongsi

Untuk membuat pekerja web bersama, anda lulus nama fail JavaScript ke contoh baru objek Sharedworker:

var worker = new SharedWorker("jsworker.js");

berkomunikasi dengan pekerja web bersama

Mana -mana skrip halaman anda boleh berkomunikasi dengan pekerja web yang dikongsi. Tidak seperti pekerja web yang berdedikasi, anda mesti berkomunikasi melalui objek 'port' dan melampirkan pengendali acara mesej. Di samping itu, anda mesti memanggil permulaan pelabuhan () kaedah sebelum menggunakan postmessage pertama (): PageScript.js:

var worker = new SharedWorker("jsworker.js");

worker.port.addEventListener("message", function(e) {
	alert(e.data);
}, false);

worker.port.start();

// post a message to the shared web worker
worker.port.postMessage("Alyssa");

Apabila skrip pekerja web menerima mesej pertama dari skrip, ia mesti melampirkan pengendali acara ke port aktif. Di bawah kebanyakan keadaan, pengendali akan menjalankan kaedah posmessage sendiri () untuk mengembalikan mesej kepada kod panggilan. Akhirnya, kaedah permulaan pelabuhan () juga mesti dilaksanakan untuk membolehkan pemesejan: jsworker.js:

var connections = 0; // count active connections

self.addEventListener("connect", function (e) {

	var port = e.ports[0];
	connections++;

	port.addEventListener("message", function (e) {
		port.postMessage("Hello " + e.data + " (port #" + connections + ")");
	}, false);

	port.start();

}, false);

Seperti adik -beradik mereka yang berdedikasi, pekerja web berkongsi boleh:

• memuat skrip selanjutnya dengan importscripts ()
• Lampirkan pengendali ralat, dan
• Jalankan kaedah port.close () untuk mengelakkan komunikasi selanjutnya pada port tertentu.

Pekerja web yang dikongsi mungkin tidak akan menjadi teknologi yang berdaya maju selama beberapa tahun, tetapi mereka meningkatkan peluang yang menarik untuk masa depan pembangunan JavaScript. Mari kita berharap vendor penyemak imbas dapat membekalkan beberapa alat pengesan dan debugging yang baik!

Soalan Lazim (Soalan Lazim) Mengenai JavaScript Shared Web Pekerja

Apakah perbezaan utama antara pekerja bersama dan pekerja web di JavaScript? Seorang pekerja web terhad kepada skop tab di mana ia dicipta. Ia tidak dapat berkomunikasi dengan tab atau tingkap lain. Sebaliknya, pekerja bersama boleh diakses dari pelbagai skrip - walaupun mereka yang dijalankan pada tab, tingkap, atau iframes yang berbeza, selagi mereka berada dalam domain yang sama. Ini menjadikan pekerja bersama sesuai untuk tugas -tugas yang memerlukan perkongsian data dan komunikasi antara konteks penyemak imbas yang berbeza. Berikut adalah contoh mudah:

var mysharedworker = new sharedworker ('worker.js');

Dalam contoh ini, 'worker.js' adalah skrip yang pekerja bersama akan dilaksanakan. Adalah penting untuk diperhatikan bahawa skrip mesti berada di domain yang sama seperti skrip yang mewujudkan pekerja bersama kerana sekatan dasar yang sama. Kaedah postmessage digunakan untuk menghantar mesej kepada pekerja bersama, sementara pengendali acara OnMessage digunakan untuk menerima mesej daripadanya. Berikut adalah contoh:

// menghantar mesej kepada pekerja bersama
mysharedworker.port.postmessage ('hello, pekerja!'); e.data); ; Ini mungkin kerana semua skrip dari domain yang sama mempunyai akses kepada contoh pekerja bersama yang sama. Ini menjadikan pekerja bersama sesuai untuk tugas-tugas yang memerlukan kemas kini masa nyata di pelbagai tab atau tingkap, seperti aplikasi pengeditan kolaboratif atau permainan berbilang tab. Walau bagaimanapun, mereka tidak disokong di Internet Explorer. Adalah idea yang baik untuk menyemak maklumat keserasian penyemak imbas terkini di laman web seperti yang saya gunakan atau dokumen web MDN.

Bagaimanakah saya dapat mengendalikan kesilapan dalam pekerja bersama? Berikut adalah contoh:

mysharedworker.onerror = function (e) { console.log ('ralat berlaku:' e.message); Mereka mempunyai akses kepada objek XMLHTTPREQUEST, yang boleh digunakan untuk membuat permintaan tak segerak ke pelayan. Ini membolehkan pekerja bersama mengambil data dari pelayan tanpa menyekat benang utama, meningkatkan prestasi aplikasi web anda. Ini membolehkan mereka menubuhkan saluran komunikasi dua hala dengan pelayan, menjadikannya mungkin untuk menghantar dan menerima data secara real-time tanpa memerlukan pengundian. Ini kerana mereka berjalan dalam benang yang berasingan dan tidak mempunyai akses ke skop yang sama seperti benang utama. Walau bagaimanapun, mereka boleh menghantar mesej ke benang utama, yang kemudiannya boleh mengemas kini DOM berdasarkan mesej ini. Walau bagaimanapun, penting untuk diperhatikan bahawa ini akan segera menamatkan pekerja bersama, tanpa mengira sama ada ia telah menyelesaikan tugasnya sekarang. Berikut adalah contoh:

mysharedworker.terminate ();

Ini akan segera menamatkan pekerja bersama. Secara amnya adalah idea yang baik untuk hanya menamatkan pekerja bersama jika tidak lagi diperlukan atau jika ia menyebabkan masalah prestasi.

Atas ialah kandungan terperinci Cara Menggunakan Pekerja Web Berkongsi JavaScript di HTML5. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!