ใน GraphQL ความหมายของ "edge" และ "node" คืออะไร?


106

ฉันใช้ปลายทาง GraphQL เฉพาะและแม้ว่าฉันจะส่งโครงสร้าง JSON ที่สะอาดเป็นแบบสอบถาม แต่เมื่อฉันได้ผลลัพธ์ฉันจะได้รับแท็ก "edge" และ "node" ดูเหมือนว่าจะทำให้ข้อมูลของฉันเป็นมลพิษโดยไม่มีประโยชน์ที่ชัดเจน เหตุใดจึงอยู่ที่นั่นและเป็นไปได้หรือไม่ที่จะกำจัดสิ่งเหล่านี้เพื่อการแยกวิเคราะห์ข้อมูลที่รวดเร็วและง่ายขึ้น


1
การเชื่อมต่อขอบและโหนดเป็นคำศัพท์ที่ใช้เป็นหลักในบริบทของรีเลย์ไคลเอ็นต์ GraphQL ดูข้อมูลเพิ่มเติมได้ในคำถามที่พบบ่อยนี้
marktani

2
เพียงเพื่อชี้แจง: การเชื่อมต่อไม่ใช่สิ่งเฉพาะของรีเลย์ สำหรับข้อมูลเชิงลึกโปรดดูบทความนี้: medium.com/p/explaining-graphql-connections-c48b7c3d6976
helfer

1
มันค่อนข้างเป็นวิธีมาตรฐานในการจัดเตรียมเพจสำหรับรายการผลลัพธ์แบบยาว ไม่ผูกติดกับการนำไปใช้งานใด ๆ
แมตต์

คำตอบ:


66

เริ่มจากการแนะนำสั้น ๆ ในคำง่ายๆ


ข้อกำหนด GraphQl Relay

  • กลไกในการปรับแต่งวัตถุ
  • คำอธิบายวิธีการเพจผ่านการเชื่อมต่อ
  • โครงสร้างรอบ ๆ การกลายพันธุ์เพื่อให้สามารถคาดเดาได้

การเชื่อมต่อ:

  • การเชื่อมต่อเป็นชุดของวัตถุที่มีเมตาดาต้าเช่นedges, pageInfo...
  • pageInfo จะมีhasNextPage, hasPreviousPage, startCursor,endCursor

    • hasNextPage จะแจ้งให้เราทราบว่ามีขอบเพิ่มเติมหรือไม่หรือเรามาถึงจุดสิ้นสุดของการเชื่อมต่อนี้แล้ว
  • อาร์เรย์ของระเบียน: ขอบ

    • edge จะให้ความยืดหยุ่นในการใช้ข้อมูลของคุณ (โหนด)
    • edge จะช่วยคุณในการแบ่งหน้ามี graphql GraphQLListแต่ไม่มีฟังก์ชันเช่นการแบ่งหน้าเฉพาะกับอาร์เรย์ของวัตถุ (ข้อมูล)
  • ขอบแต่ละด้านมี

    • a node: บันทึกหรือข้อมูล
    • a cursor: สตริงที่เข้ารหัส base64 เพื่อช่วยในการถ่ายทอดด้วยการแบ่งหน้า

https://facebook.github.io/relay/graphql/connections.htm

โหนด:

  • คุณสามารถกำหนดจำนวนโหนดที่คุณต้องการแสดงโดยใช้รีเลย์ connectionArgs(first, last, after, before)

การแบ่งหน้ารีเลย์ทำงานเป็น

  • ดึงอ็อบเจ็กต์ทั้งหมดในคอลเลกชันและส่งคืนสไลซ์ตามfirst/lastเร็กคอร์ด x ซึ่งใช้ผ่าน connectionArgs

  • after/before ใช้เพื่อระบุจำนวนสไลซ์ (ข้อมูล) ที่ต้องการไปยังเซิร์ฟเวอร์ GraphQL โดยใช้เคอร์เซอร์จากโหนด

มีสิ่งอื่น ๆ อีกมากมายที่จะต้องพิจารณาเหมือนnodeDefinitions, globalFieldId,nodeInterfaces

https://github.com/graphql/graphql-relay-js#object-identification


17
ฉันคิดว่าคำตอบนี้มีสาระสำคัญ แต่มีความเข้าใจผิดมากมาย บทความนี้อธิบายเหตุผลเบื้องหลังการเชื่อมต่อ GraphQL ได้ดี: medium.com/p/explaining-graphql-connections-c48b7c3d6976
helfer

6
คุณพบความเข้าใจผิดที่ใดเป็นเพียงข้อมูลสั้น ๆ หากคุณพบความเข้าใจผิดคุณสามารถปรับปรุงให้ดีขึ้นได้
เสมอ

ฉันสามารถทำงานกับโครงสร้างเหล่านี้ผ่านUI ของgraphql ได้หรือไม่ ตัวอย่างเช่นhasNextPageหรือมีเฉพาะผ่าน JS พร้อม Relay
สกา

ใช่คุณสามารถทำงานกับสิ่งเหล่านี้ได้จาก graphiql UI โดยใช้ graphql-relay
p0k8_

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