ข้ามไปยังเนื้อหา

ส่งต่อพอร์ตจากเทอร์มินัล

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

ไม่มีอะไรที่นี่เปิดเครื่องออก: ทุกเส้นทางถูกสร้างโดยเซิร์ฟเวอร์ เมื่อมีการ ร้องขอ และดับไปพร้อมกับเทอร์มินัลหรือริก

  1. เปิด Terminal (VM) ของการสนทนา หรือเชลล์ของโฮสต์ (ในสเปซหรือบนหน้า PR)
  2. เริ่มเซิร์ฟเวอร์ของคุณ — pnpm dev, python -m http.server 8000 อะไรก็ได้
  3. ภายในไม่กี่วินาที ไอคอนปลั๊ก ที่มุมขวาบนของเทอร์มินัล จะมีจุดขึ้นมา คลิกมัน

แผงจะแสดงทุกพอร์ตที่กำลังฟังพร้อมโพรเซสที่เป็นเจ้าของมัน ในรูปแบบ 3000 → 3000: พอร์ตที่โพรเซสบายด์ไว้ทางซ้าย พอร์ตที่มันตอบในเครื่องทางขวา (เป็นหมายเลขเดียวกันทุกครั้งที่หมายเลขนั้นว่างบนเครื่องของคุณ) แต่ละแถวยัง บอกด้วยว่า localhost บนเดสก์ท็อป, Browser (VM) และ Android เข้าถึงมันได้หรือไม่

การค้นหาถูกจำกัดขอบเขตไว้: Terminal (VM) ถูกโพลจากภายในเกสต์นั้น ส่วนเชลล์ของโฮสต์ถูกโพลจากทรีโพรเซส PTY ของเซสชันนั้น สเปซอื่น และโพรเซสอื่นบน Mac ของคุณ จะไม่ปรากฏในรายการ

พอร์ตใหม่ในเทอร์มินัลนี้จะถูกส่งต่อโดยอัตโนมัติ ปิด ส่งต่อพอร์ตอัตโนมัติ ในแผงเดียวกัน หากคุณต้องการเฉพาะพอร์ตที่คุณเพิ่มเอง

ใช้ คัดลอก URL ในเครื่อง บนแถวนั้น — http://localhost:3000 การส่งต่อ จะฟังบนลูปแบ็กเท่านั้น สิ่งอื่นบนเครือข่ายของคุณจึงมองไม่เห็นมัน

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

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

--host (หรือการผูกกับ 0.0.0.0) ไม่ ทำให้ Browser (VM) ที่อยู่ใน เอนโคลเจอร์เข้าถึงเซิร์ฟเวอร์บน Mac ได้ เกสต์มีลูปแบ็กของตัวเอง เซิร์ฟเวอร์ จะปลูกทันเนลเข้าไปในเกสต์นั้นเมื่อแท็บ Browser อยู่ใน สเปซเดียวกัน

เปิดเบราว์เซอร์ที่อยู่ในเอนโคลเจอร์ในการสนทนาเดียวกัน พิมพ์ localhost:<left-hand port> — หมายเลขที่โพรเซสบายด์ไว้ การแมปใหม่ (5173 → 3000) ก็ตอบที่หมายเลขทางขวาในเบราว์เซอร์นั้นด้วย คัดลอก URL จึงใช้ได้ที่นั่นเช่นกัน browser_use ของเอเจนต์สามารถไปยังหมายเลขใดก็ได้ เซิร์ฟเวอร์ในสเปซ A ไม่เคยปรากฏเป็น localhost:5173 ในเบราว์เซอร์ของสเปซ B

ใช้ localhost ไม่ใช่ IP ของ LAN และไม่ใช่ --host เกสต์มีลูปแบ็กของ ตัวเอง ทันเนลจะฟังที่นั่นทั้งบน IPv4 และ IPv6

หน้าเว็บที่เปิดการเชื่อมต่อจำนวนมากในคราวเดียว (แอสเซ็ตนับสิบ ซ็อกเก็ต รีโหลดสด) จะใช้ทันเนลเดียวกันนั้นร่วมกัน Browser (VM) จะมัลติเพล็กซ์พวกมัน ไปบน exec แบบถาวรหนึ่งตัว การเรียกข้อมูลที่ถาโถมมาจึงไม่ใช่การสปอว์นโพรเซส หนึ่งตัวต่อการเชื่อมต่อหนึ่งครั้ง และไม่หมดเวลาเป็นหน้าจอขาว

ภายในสเปซเดียว การส่งต่อของ Terminal (VM) ชนะเชลล์ของโฮสต์บนหมายเลข เดียวกัน ข้ามสเปซไม่มีความเป็นลำดับความสำคัญ — มันเป็นแผนที่แยกจากกัน

เปิดแท็บ Android ของสเปซนั้น localhost:<port> ของโปรแกรมจำลองจะถูก ส่งต่อย้อนกลับไปยังพอร์ตที่เผยแพร่ของสเปซนี้ (adb reverse) โปรแกรมจำลอง มีเพียงตัวเดียวสำหรับทั้งอุปกรณ์: การเชื่อมสเปซ B จะเปลี่ยนเป้าหมายของ :5173 ไปที่ B และทิ้งของ A ปิดแท็บแล้วการส่งต่อย้อนกลับที่ริกนี้ติดตั้งไว้ จะถูกลบออก

เครื่องจำลอง iOS ก็คือ Mac อยู่แล้ว — ไม่ต้องส่งต่อย้อนกลับ iPhone เครื่องจริง ยังต้องใช้การแชร์บน LAN

⋯ → แชร์บนเครือข่ายภายใน จะเผยแพร่พอร์ตที่ <server-ip>:<random port> — มีประโยชน์สำหรับเปิดหน้าเว็บบนโทรศัพท์ของคุณ หรือเมื่อเซิร์ฟเวอร์รันอยู่บนเครื่องอื่น

  • พอร์ต LAN ถูกกำหนดโดย OS เสมอ ไม่เคยเป็นหมายเลขของเกสต์ การเปิดเผย จึงเป็นที่อยู่ที่จงใจและมองเห็นได้ ไม่ใช่ที่อยู่ที่เดาได้
  • มันยังคงเป็นส่วนตัว (ลูปแบ็กเท่านั้น) จนกว่าคุณจะเปิด และ ⋯ → เฉพาะเครื่องนี้ จะดึงมันกลับออกจากเครือข่าย

⋯ → ตั้งโดเมนเบราว์เซอร์ (.test) กำหนดโดเมนสำหรับพัฒนา เช่น myapp.test ให้กับพอร์ต ภายใน Browser (VM) https://myapp.test จะโหลดเซิร์ฟเวอร์ของ คุณพร้อมสัญลักษณ์กุญแจที่ถูกต้อง — มีประโยชน์สำหรับสิ่งใดก็ตามที่ทำงาน ต่างออกไปบนออริจินที่มีชื่อ หรือในบริบทที่ปลอดภัย (คุกกี้, service workers, คอลแบ็ก OAuth)

  • โดเมนต้องลงท้ายด้วย .test หรือ .localhost — สอง TLD ที่สงวนไว้สำหรับ การพัฒนา ชื่อสำหรับพัฒนาจึงไม่มีทางบดบังไซต์จริงได้
  • ชื่อโดเมนไม่ซ้ำกันบนเซิร์ฟเวอร์ แต่หมายเลขพอร์ตไม่เป็นเช่นนั้น สองสเปซอาจใช้ 5173 ทั้งคู่ได้ แต่ทั้งคู่จะอ้าง myapp.test พร้อมกันไม่ได้
  • ใบรับรองมาจากหน่วยออกใบรับรองภายในเครื่องที่สร้างขึ้นบนเซิร์ฟเวอร์ของคุณ ในครั้งแรกที่จำเป็นต้องใช้ กุญแจของมันอยู่ในไดเรกทอรีข้อมูลของเซิร์ฟเวอร์ และไม่เคยเข้าไปในเกสต์ใด ๆ เบราว์เซอร์ที่อยู่ในเอนโคลเจอร์เชื่อถือกุญแจ นั้นเพียงหนึ่งเดียว TLS ไปยังอินเทอร์เน็ตจริงจึงยังตรวจสอบได้ตามปกติ
  • โดเมนจะ resolve ภายใน Browser (VM) เท่านั้น ส่วนเบราว์เซอร์ของคุณเอง บนโฮสต์จะใช้ localhost:<port> แทน
  • http://myapp.test แบบธรรมดาก็ใช้ได้เช่นกัน

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

พอร์ตถูกจัดคีย์ตามเวิร์กสเปซและสเปซ แผนที่พอร์ตของไฮเปอร์ไวเซอร์ถูกกำหนดไว้ ตายตัวตอนเครื่องบูต Terminal (VM) จึงวิ่งบนช่องทางแคบ ๆ สองช่องที่เซิร์ฟเวอร์ ควบคุม: เลนขาเข้าที่สร้างไว้ล่วงหน้าหนึ่งเลนเข้าไปในเกสต์ ซึ่งปฏิเสธที่จะ เชื่อมต่อกับพอร์ตใด ๆ ที่เกสต์ไม่ได้กำลังฟังอยู่จริง และทันเนลย้อนกลับที่ เซิร์ฟเวอร์เปิดค้างไว้สำหรับ Browser (VM) และ Android เชลล์ของโฮสต์ไม่เคย สแกนทั้งเครื่อง ไม่มีตัวฟังใดถูกสร้างขึ้นภายในเกสต์ที่เซิร์ฟเวอร์ไม่ได้ใส่ไว้ ที่นั่น และทุกอย่างจะถูกรื้อถอนไปพร้อมกับเทอร์มินัลหรือริก การออกแบบนี้อธิบาย ไว้ใน ริกและเอนโคลเจอร์ ส่วนพอร์ตที่สงวนไว้และกฎของโดเมนที่แน่นอนอยู่ใน ข้อมูลอ้างอิงริก