أداة إنشاء استعلامات GraphQL

كتابة عملية GraphQL يدويًا تعني الحفاظ على دقة الأقواس المعقوفة والوسائط والمسافات البادئة. تجمّع هذه الأداة المستند لك: اختر استعلامًا أو طفرة أو اشتراكًا، وسّمِ العملية، وحدد الحقل الجذري، وأضف الوسائط، واكتب الحقول التي تحتاجها. النتيجة عملية منسّقة يمكنك لصقها مباشرة في Apollo أو urql أو GraphiQL.

كيفية بناء عملية GraphQL

  1. 1

    اختر نوع العملية

    اختر استعلامًا أو طفرة أو اشتراكًا من القائمة المنسدلة. هذا يحدد نوع العملية التي ينفذها الخادم.

  2. 2

    سمِّ العملية

    أعطها اسمًا مثل GetUser حتى يتمكن الخادم من تسجيلها وتخزينها مؤقتًا. الاسم اختياري؛ تعمل الأداة بدونه أيضًا.

  3. 3

    حدد الحقل الجذري

    اكتب الحقل الذي تريد استدعاءه، مثل user أو createPost أو orderUpdated.

  4. 4

    أضف الوسائط

    أضف أزواجًا من المفتاح والقيمة مثل id: "123" أو id: $id. الصفوف ذات المفتاح الفارغ تُتجاوز.

  5. 5

    اكتب الحقول وانسخ النتيجة

    اكتب حقلاً واحدًا في كل سطر، وأنشئ الاستعلام، ثم انسخ المستند المنسّق إلى الحافظة.

العمل مع مستندات GraphQL

مستند GraphQL هو مجموعة من عملية واحدة أو أكثر، بالإضافة إلى أي أجزاء (fragments) تشير إليها. كل عملية تسمي حقلًا جذريًا من النوع Query أو Mutation أو Subscription، ويحل الخادم مجموعة الاختيار التي تطلبها. تكتب الأداة نص العملية نيابةً عنك، لكنها لا تعرف مخططك (schema)، لذا تحقق من كل اسم حقل ووسيط مع واجهة API الخاصة بك قبل تنفيذ العملية.

تشريح العملية

الجزء الغرض المثال
نوع العملية استعلام أو طفرة أو اشتراك query، mutation، subscription
اسم العملية يُستخدم للتخزين المؤقت والسجلات GetUserById
الوسائط القيم الممررة إلى الحقل الجذري user(id: "123")
مجموعة الاختيار الحقول والاختيارات المتداخلة { user(id: "123") { name posts { title } } }
المتغيرات مدخلات ذات أنواع تُعلن مع اسم العملية query GetUser($id: ID!) { user(id: $id) { name } }

الأخطاء الشائعة

  • المتغيرات المطلوبة تنتهي بـ !. إغفال ذلك على الوسائط المُعلّمة بـ NonNull في المخطط يُنتج خطأ تحقق قبل تشغيل المُحلِّل (resolver).
  • الوسائط النصية تحتاج إلى علامات اقتباس. قيمة مثل 123 هي رقم؛ أما القيمة النصية فيجب كتابتها "123" بين علامتي اقتباس داخل صف الوسيط.
  • أنواع الاتحادات والواجهات تتطلب أجزاءً مضمّنة من النوع ... on TypeName لقراءة الحقول الخاصة بكل نوع.
  • الأسماء المستعارة (Aliasing) إلزامية عندما تطلب الحقل نفسه مرتين بوسائط مختلفة، مثل today: stats(period: DAY) وweek: stats(period: WEEK).
  • الاتصالات (مواصفة Relay) تُظهر edges { node { ... } } وpageInfo { endCursor hasNextPage }؛ وإغفال أي منهما يكسر التقسيم إلى صفحات.

نصائح

  • اجعل العمليات صغيرة ومُسمّاة حتى يتمكن Apollo Client من تخزينها مؤقتًا بشكل فردي.
  • مرر القيم المتغيرة كمتغيرات بدلًا من القيم الحرفية، ليتمكن الخادم من تحليل المستند مرة واحدة وإعادة استخدامه؛ وأعلنها بجانب اسم العملية، مثل query GetUser($id: ID!).
  • إذا كان الحقل يحتاج إلى وسائط متعددة، فاكتبها في صف وسيط واحد مفصولة بفواصل، مثل filter: { status: ACTIVE } كقيمة.
  • تُخرج الأداة النص الذي تضبطه تمامًا. إذا فشلت عملية، فقارن أولًا أسماء الحقول لديك بالمخطط الحالي.

الأسئلة الشائعة

لا. إنها تنسّق النص الذي تدخله فقط؛ فلا توجد نقطة نهاية يُستدعى ولا مخطط مطلوب. املأ أجزاء العملية، وسوف تجمّع الأداة المستند لك.

نعم. استخدم القائمة المنسدلة للعملية للتبديل بين الاستعلام والطفرة والاشتراك. كل شيء آخر يعمل بالطريقة نفسها: الاسم والحقل الجذري والوسائط والحقول.

أضف صفوفًا في قسم الوسائط. المفتاح هو اسم الوسيط، والقيمة هي ما تمرره، مثل id: “123” أو id: $id. الصفوف ذات المفتاح الفارغ تُتجاهل. إذا كتبت متغيرًا مثل $id، فأعلنه بنفسك بجانب اسم العملية، مثل query GetUser($id: ID!).

تُخرج الأداة النص الذي كتبته تمامًا. الخطأ يعني عادةً أن اسم حقل أو وسيط لا يطابق مخطط خادمك: قارن الحقل الجذري وكل اسم حقل مع واجهة API الخاصة بك وصحح الإملاء.

أدوات ذات صلة

الأداة متاحة بلغات أخرى