หมายเหตุ
การเข้าถึงหน้านี้ต้องได้รับการอนุญาต คุณสามารถลอง ลงชื่อเข้าใช้หรือเปลี่ยนไดเรกทอรีได้
การเข้าถึงหน้านี้ต้องได้รับการอนุญาต คุณสามารถลองเปลี่ยนไดเรกทอรีได้
DevServer คือเว็บเซิร์ฟเวอร์ภายในเครื่องที่คุณเรียกใช้ขณะพัฒนาปริมาณงาน Fabric ให้บริการส่วนหน้า (SPA) ของคุณบน localhost และจัดเตรียมตําแหน่งข้อมูล HTTP ชุดเล็กๆ ที่ Fabric เรียกใช้ระหว่างการพัฒนาเพื่อดึงรายการผลิตภัณฑ์และรายการของคุณ เมื่อรวมกับ DevGateway แล้ว Fabric สามารถโหลด UI ปริมาณงานของคุณใน iFrame และอ่านข้อมูลรายการของคุณโดยไม่ต้องเผยแพร่อะไรไปยังผู้เช่าของคุณ
DevServer ทําอะไร
- โฮสต์ส่วนหน้าปริมาณงานของคุณผ่าน HTTP บน localhost (เช่น http://localhost:60006) เพื่อให้ Fabric สามารถโหลดใน iFrame ได้
- แสดงเนื้อหาแบบคงที่ที่อ้างอิงโดยรายการของคุณ (ไอคอน สตริงที่แปลเป็นภาษาท้องถิ่น รูปภาพ)
- แสดงตําแหน่งข้อมูล JSON ในเครื่องที่ Fabric ใช้เพื่ออ่านรายการของคุณในระหว่างการพัฒนา
- เปิดใช้งานรอบการแก้ไข-รีเฟรชอย่างรวดเร็วด้วยการโหลดใหม่แบบร้อนในการตั้งค่าส่วนใหญ่
สําคัญ
DevServer ทํางานร่วมกับ DevGateway DevGateway ลงทะเบียนอินสแตนซ์ปริมาณงานในเครื่องของคุณกับ Fabric เพื่อให้บริการทราบว่าต้องพูดคุยกับตําแหน่งข้อมูล DevServer ของคุณในขณะที่คุณพัฒนา
ตําแหน่งที่ Fabric เรียก DevServer
เมื่อคุณเปิดใช้งานโหมดการพัฒนาและเริ่มทั้ง DevGateway และ DevServer ของคุณ:
- Fabric นําทางไปยังส่วนหน้าของคุณผ่านปลายทางส่วนหน้าที่กําหนดโดยรายการปริมาณงานของคุณ (ดู รายการปริมาณงาน) ในการพัฒนา โดยปกติจะชี้ไปที่ URL localhost ที่เปิดเผยโดย DevServer
- Fabric จะสืบค้น DevServer สําหรับข้อมูลเมตาที่เผชิญกับผลิตภัณฑ์ของคุณ เพื่อให้สามารถแสดงการนําทาง ไทล์ และ UX อื่นๆ สําหรับปริมาณงานของคุณได้ วิธีนี้ช่วยให้คุณสามารถทําซ้ํา
Product.jsonและรายการรายการได้โดยไม่ต้องสร้างใหม่และอัปโหลดแพ็คเกจ
ปลายทางภายในเครื่องที่ DevServer มีให้
เส้นทางที่แน่นอนอาจแตกต่างกันไปตามเทมเพลต แต่ที่เก็บตัวอย่างจะแสดงชุดปลายทางที่คาดเดาได้ขนาดเล็ก:
- GET / — ส่งคืนเว็บแอปของคุณ (UI Fabric โหลดลงใน iFrame)
- GET /manifests — ส่งคืนเพย์โหลด JSON ที่รวมรายการผลิตภัณฑ์และรายการรายการที่ใช้โดยส่วนหน้า สิ่งนี้สะท้อนโครงสร้างที่ Fabric คาดหวังในเวลาเผยแพร่ (ดู รายการสินค้า และ รายการสินค้า)
- GET /assets/... — ให้บริการไอคอน รูปภาพ และสตริงที่แปลเป็นภาษาท้องถิ่นที่อ้างอิงโดยรายการของคุณ
Note
- CORS และส่วนหัวได้รับการกําหนดค่าไว้ล่วงหน้าใน DevServer ตัวอย่าง เพื่อให้สามารถฝังแอปและสื่อสารกับโฮสต์ได้
- ชื่อเส้นทางด้านบนเป็นไปตามตัวอย่างปัจจุบัน ปรึกษา README ของเทมเพลตหากโปรเจ็กต์ของคุณใช้เส้นทางอื่นสําหรับตําแหน่งข้อมูลรายการ
ขั้นตอนการพัฒนาทั่วไป
- เริ่ม DevServer จากที่เก็บตัวอย่างเพื่อโฮสต์ส่วนหน้าของคุณบน localhost
- เริ่ม DevGateway เพื่อลงทะเบียนปริมาณงานในเครื่องของคุณกับ Fabric
- เปิดพื้นที่ทํางาน Fabric ของคุณและเปิดใช้จุดเริ่มต้นปริมาณงาน Fabric โหลดแอปของคุณใน iFrame และเรียกตําแหน่งข้อมูล DevServer ของคุณเพื่ออ่านข้อมูลรายการ
- แก้ไข UI หรือไฟล์ Manifest และรีเฟรช การเปลี่ยนแปลงจะมีผลทันทีโดยไม่ต้องบรรจุใหม่
สําหรับวิธีการเริ่มต้นแต่ละกระบวนการ โปรดดูบทช่วยสอนการเริ่มต้นใช้งานและคู่มือการตั้งค่า
ความสัมพันธ์กับรายการที่เผยแพร่
ในการผลิต รายการของปริมาณงานของคุณจะถูกจัดแพ็กเกจและอัปโหลดเป็นส่วนหนึ่งของแพคเกจ NuGet ของปริมาณงานของคุณ (ดู ภาพรวมรายการ) ในระหว่างการพัฒนา ปลายทางในเครื่องของ DevServer จะทําหน้าที่เป็นตัวสํารองที่มีน้ําหนักเบาสําหรับไฟล์แพ็กเกจเหล่านั้น คุณจึงสามารถทําซ้ําได้อย่างรวดเร็ว:
- Schema และกฎจะเหมือนกับรายการที่เผยแพร่
- DevServer มีผลต่อการพัฒนาในท้องถิ่นเท่านั้น แต่ไม่ได้เปลี่ยนวิธีการทํางานของการเผยแพร่
คำแนะนำในการแก้ไขปัญหา
- หาก iFrame แสดงหน้าว่าง ให้ยืนยันว่า DevServer กําลังทํางานอยู่ และตําแหน่งข้อมูลส่วนหน้าในไฟล์ Manifest ของคุณชี้ไปยัง URL localhost ที่ถูกต้อง
- หากไอคอนหรือสตริงหายไป ให้ตรวจสอบ
assetsเส้นทางและ DevServer กําลังให้บริการไฟล์เหล่านั้นภายใต้/assets - หาก Fabric ไม่พบรายการของคุณ ให้ยืนยัน
/manifestsว่าเส้นทางมีอยู่ในเทมเพลตของคุณและส่งคืน JSON ที่ถูกต้อง