พนักงานบริการคืออะไรใน react js


93

เมื่อสร้างแอปตอบกลับพนักงานบริการจะถูกเรียกโดยค่าเริ่มต้น เหตุใดจึงใช้พนักงานบริการ สาเหตุของการเรียกค่าเริ่มต้นคืออะไร?

คำตอบ:


105

คุณอาจไม่จำเป็นต้องมีพนักงานบริการสำหรับใบสมัครของคุณ หากคุณกำลังสร้างโปรเจ็กต์ด้วย create-react-app ระบบจะเรียกใช้ตามค่าเริ่มต้น

พนักงานบริการจะอธิบายได้ดีในนี้บทความ เพื่อสรุปจากนั้น

A service workerคือสคริปต์ที่เบราว์เซอร์ของคุณทำงานในพื้นหลังแยกจากหน้าเว็บเปิดประตูสู่คุณลักษณะที่ไม่จำเป็นต้องมีหน้าเว็บหรือการโต้ตอบกับผู้ใช้ วันนี้พวกเขาอยู่แล้วมีคุณสมบัติเช่นpush notificationsและbackground syncและมีการ รวมทั้งability to intercept and handle network requests programmatically managing a cache of responses

ในอนาคตแรงงานบริการอาจสนับสนุนสิ่งอื่น ๆ เช่น หรือperiodic syncgeofencing

ตามPRนี้เพื่อสร้าง-react-app

Service workersSWPrecacheWebpackPluginจะถูกนำมาใช้กับการสร้างปฏิกิริยาแอปผ่าน

การใช้ผู้ปฏิบัติงานเซิร์ฟเวอร์ที่มีกลยุทธ์แคชเป็นอันดับแรกมีข้อดีด้านประสิทธิภาพเนื่องจากเครือข่ายไม่ได้เป็นคอขวดสำหรับการตอบสนองคำขอการนำทาง อย่างไรก็ตามหมายความว่านักพัฒนา (และผู้ใช้) จะเห็นเฉพาะการอัปเดตที่ทำให้ใช้งานได้ในการเยี่ยมชมหน้า "N + 1" เนื่องจากทรัพยากรที่แคชไว้ก่อนหน้านี้จะได้รับการอัปเดตในเบื้องหลัง

การโทรถึงregister service workerจะเปิดใช้งานโดยค่าเริ่มต้นในแอพใหม่ แต่คุณสามารถลบออกได้ตลอดเวลาจากนั้นคุณจะกลับสู่พฤติกรรมปกติ


2
เนื่องจากแอป reactjs ที่สร้างขึ้นในขณะนี้มีรหัส sw แต่ความคิดเห็นระบุว่าไม่ได้เรียกใช้ฟังก์ชันการลงทะเบียน คำถามคือฉันจะเรียกมันได้ที่ไหน?
Daneel Yaitskov

@ DaneelS Yaitskov คุณสามารถเรียกมันว่าไฟล์ index.js ระดับบนสุดหรือที่คล้ายกัน
สิทธารถะ

1
@ คุณสิทธารถะคุณใจดีพอที่จะให้ตัวอย่างที่เป็นรูปธรรมและอาจจะอัพเดตคำตอบได้หรือไม่? ฉันพบว่าสิ่งนี้มีประโยชน์มาก แต่ฉันไม่มีรายละเอียดขั้นสุดท้ายเหล่านั้น ขอบคุณ.
Ted Stresen-Reuter

17

พูดง่ายๆคือสคริปต์ที่เบราว์เซอร์ทำงานในพื้นหลังและไม่มีความสัมพันธ์ใด ๆ กับหน้าเว็บหรือ DOM และให้คุณสมบัตินอกกรอบ นอกจากนี้ยังช่วยให้คุณแคชเนื้อหาและไฟล์อื่น ๆ เพื่อให้เมื่อผู้ใช้ออฟไลน์หรืออยู่ในเครือข่ายที่ช้า

คุณสมบัติบางอย่างเหล่านี้คือการร้องขอเครือข่ายพร็อกซีการแจ้งเตือนแบบพุชและการซิงค์พื้นหลัง พนักงานบริการมั่นใจว่าผู้ใช้จะได้รับประสบการณ์ออฟไลน์ที่สมบูรณ์

คุณสามารถคิดว่าพนักงานบริการเป็นคนที่อยู่ระหว่างไคลเอนต์และเซิร์ฟเวอร์และคำขอทั้งหมดที่ส่งไปยังเซิร์ฟเวอร์จะส่งผ่านผู้ปฏิบัติงานบริการ โดยพื้นฐานแล้วเป็นชายกลางคน เนื่องจากคำขอทั้งหมดผ่านพนักงานบริการจึงสามารถสกัดกั้นคำขอเหล่านี้ได้ทันที

ป้อนคำอธิบายภาพที่นี่


6

ฉันต้องการเพิ่มข้อควรพิจารณาที่สำคัญ 2 ประการเกี่ยวกับพนักงานบริการที่ต้องคำนึงถึง:

  1. พนักงานบริการต้องการ HTTPS แต่การที่จะช่วยให้การทดสอบท้องถิ่นข้อ จำกัด localhostนี้ใช้ไม่ได้กับ นี่เป็นเหตุผลด้านความปลอดภัยเนื่องจาก Service Worker ทำหน้าที่เหมือนคนที่อยู่ตรงกลางระหว่างเว็บแอปพลิเคชันและเซิร์ฟเวอร์

  2. ด้วยการสร้างปฏิกิริยา Appnpm run buildบริการคนทำงานถูกเปิดใช้งานเฉพาะในสภาพแวดล้อมการผลิตเช่นเมื่อทำงาน

บริการคนทำงานอยู่ที่นี่เพื่อช่วยเหลือการพัฒนาก้าวหน้า Web App ทรัพยากรที่ดีเกี่ยวกับมันในบริบทของการสร้างปฏิกิริยา App สามารถพบได้ในเว็บไซต์ของพวกเขาที่นี่

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.