{"id":77108,"date":"2024-09-18T14:00:22","date_gmt":"2024-09-18T10:30:22","guid":{"rendered":"https:\/\/nabfollower.com\/blog\/leveling-up-my-graphql-skills-real-time-subscriptions-39m2\/"},"modified":"2024-09-18T14:00:22","modified_gmt":"2024-09-18T10:30:22","slug":"leveling-up-my-graphql-skills-real-time-subscriptions-39m2","status":"publish","type":"post","link":"https:\/\/nabfollower.com\/blog\/leveling-up-my-graphql-skills-real-time-subscriptions-39m2\/","title":{"rendered":"\u0627\u0631\u062a\u0642\u0627\u0621 \u0633\u0637\u062d \u0645\u0647\u0627\u0631\u062a \u0647\u0627\u06cc GraphQL \u0645\u0646: \u0627\u0634\u062a\u0631\u0627\u06a9 \u062f\u0631 \u0632\u0645\u0627\u0646 \u0648\u0627\u0642\u0639\u06cc"},"content":{"rendered":"<p>Summarize this content to 400 words in Persian Lang <\/p>\n<p>\u0686\u0646\u062f \u0633\u0627\u0644\u06cc \u0627\u0633\u062a \u06a9\u0647 \u0633\u0639\u06cc \u06a9\u0631\u062f\u0647\u200c\u0627\u0645 \u0686\u0627\u0631\u0686\u0648\u0628\u200c\u0647\u0627\u060c \u0645\u062d\u0635\u0648\u0644\u0627\u062a \u0648 \u062e\u062f\u0645\u0627\u062a\u06cc \u0631\u0627 \u0634\u0646\u0627\u0633\u0627\u06cc\u06cc \u06a9\u0646\u0645 \u06a9\u0647 \u0628\u0647 \u0641\u0646\u200c\u0622\u0648\u0631\u0627\u0646 \u0627\u062c\u0627\u0632\u0647 \u0645\u06cc\u200c\u062f\u0647\u062f \u062a\u0645\u0631\u06a9\u0632 \u062e\u0648\u062f \u0631\u0627 \u0628\u0631 \u06af\u0633\u062a\u0631\u0634 \u0627\u0631\u0632\u0634 \u0645\u0627\u0644\u06a9\u06cc\u062a \u0645\u0639\u0646\u0648\u06cc \u062e\u0648\u062f \u062d\u0641\u0638 \u06a9\u0646\u0646\u062f. \u0627\u06cc\u0646 \u0647\u0645\u0686\u0646\u0627\u0646 \u06cc\u06a9 \u0633\u0641\u0631 \u0641\u0648\u0642 \u0627\u0644\u0639\u0627\u062f\u0647 \u0628\u0631\u0627\u06cc \u0645\u0646 \u0627\u0633\u062a\u060c \u067e\u0631 \u0627\u0632 \u0641\u0631\u0635\u062a \u0647\u0627\u06cc \u06cc\u0627\u062f\u06af\u06cc\u0631\u06cc \u0645\u0646\u062d\u0635\u0631 \u0628\u0647 \u0641\u0631\u062f.<\/p>\n<p>\u0645\u0647\u0646\u062f\u0633 \u062f\u0631\u0648\u0646 \u0645\u0646 \u0627\u062e\u06cc\u0631\u0627\u064b \u0628\u0647 \u0627\u06cc\u0646 \u0641\u06a9\u0631 \u06a9\u0631\u062f \u06a9\u0647 \u0622\u06cc\u0627 \u0645\u0648\u0642\u0639\u06cc\u062a\u06cc \u0648\u062c\u0648\u062f \u062f\u0627\u0631\u062f \u06a9\u0647 \u0628\u062a\u0648\u0627\u0646\u0645 \u06cc\u06a9 \u0645\u0632\u06cc\u062a \u062b\u0627\u0646\u0648\u06cc\u0647 \u0628\u0631\u0627\u06cc \u06cc\u06a9 \u0645\u0641\u0647\u0648\u0645 \u0645\u0648\u062c\u0648\u062f \u067e\u06cc\u062f\u0627 \u06a9\u0646\u0645 \u06a9\u0647 \u0642\u0628\u0644\u0627\u064b \u062f\u0631 \u0645\u0648\u0631\u062f \u0622\u0646 \u0635\u062d\u0628\u062a \u06a9\u0631\u062f\u0647 \u0627\u0645. \u0628\u0647 \u0639\u0628\u0627\u0631\u062a \u062f\u06cc\u06af\u0631\u060c \u0622\u06cc\u0627 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u0645 \u0645\u0632\u06cc\u062a \u062f\u06cc\u06af\u0631\u06cc \u0631\u0627 \u0628\u0627 \u0647\u0645\u0627\u0646 \u0633\u0637\u062d \u062a\u0623\u062b\u06cc\u0631 \u0631\u0627\u0647\u200c\u062d\u0644 \u0627\u0635\u0644\u06cc \u06a9\u0647 \u0642\u0628\u0644\u0627\u064b \u0634\u0646\u0627\u0633\u0627\u06cc\u06cc \u0634\u062f\u0647 \u0628\u0648\u062f \u0634\u0646\u0627\u0633\u0627\u06cc\u06cc \u06a9\u0646\u0645\u061f<\/p>\n<p>\u0628\u0631\u0627\u06cc \u0627\u06cc\u0646 \u0645\u0642\u0627\u0644\u0647\u060c \u0645\u06cc\u200c\u062e\u0648\u0627\u0633\u062a\u0645 \u0639\u0645\u06cc\u0642\u200c\u062a\u0631 \u0628\u0647 GraphQL \u0628\u067e\u0631\u062f\u0627\u0632\u0645 \u062a\u0627 \u0628\u0628\u06cc\u0646\u0645 \u0686\u0647 \u0686\u06cc\u0632\u06cc \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u0645 \u067e\u06cc\u062f\u0627 \u06a9\u0646\u0645.<\/p>\n<p>\u062f\u0631 \u0645\u0642\u0627\u0644\u0647 \u062e\u0648\u062f \u0628\u0627 \u0639\u0646\u0648\u0627\u0646 \u00ab\u0648\u0642\u062a\u06cc \u0632\u0645\u0627\u0646 \u0627\u0633\u062a\u0631\u0627\u062d\u062a \u0627\u0633\u062a\u00bb\u060c \u062f\u0631 \u0645\u0648\u0631\u062f \u0627\u06cc\u0646\u06a9\u0647 \u0686\u06af\u0648\u0646\u0647 \u0633\u0646\u0627\u0631\u06cc\u0648\u0647\u0627\u06cc \u062f\u0646\u06cc\u0627\u06cc \u0648\u0627\u0642\u0639\u06cc \u0648\u062c\u0648\u062f \u062f\u0627\u0631\u062f \u06a9\u0647 GraphQL \u0628\u0647 \u06cc\u06a9 \u0633\u0631\u0648\u06cc\u0633 RESTful \u0627\u0631\u062c\u062d\u06cc\u062a \u062f\u0627\u0631\u062f\u060c \u0635\u062d\u0628\u062a \u06a9\u0631\u062f\u0645. \u0646\u062d\u0648\u0647 \u0633\u0627\u062e\u062a \u0648 \u0627\u0633\u062a\u0642\u0631\u0627\u0631 API GraphQL \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0633\u0631\u0648\u0631 \u0622\u067e\u0648\u0644\u0648 \u0631\u0627 \u0628\u0631\u0631\u0633\u06cc \u06a9\u0631\u062f\u06cc\u0645.<\/p>\n<p>\u062f\u0631 \u0627\u06cc\u0646 \u067e\u0633\u062a \u0628\u0639\u062f\u06cc\u060c \u0645\u0646 \u0642\u0635\u062f \u062f\u0627\u0631\u0645 \u062f\u0627\u0646\u0634 \u062e\u0648\u062f \u0631\u0627 \u062f\u0631 \u0645\u0648\u0631\u062f GraphQL \u0628\u0627 \u0642\u062f\u0645 \u0632\u062f\u0646 \u062f\u0631 \u0627\u0634\u062a\u0631\u0627\u06a9\u200c\u0647\u0627 \u0628\u0631\u0627\u06cc \u0628\u0627\u0632\u06cc\u0627\u0628\u06cc \u0627\u0637\u0644\u0627\u0639\u0627\u062a \u062f\u0631 \u0632\u0645\u0627\u0646 \u0648\u0627\u0642\u0639\u06cc \u0627\u0631\u062a\u0642\u0627 \u062f\u0647\u0645. \u0645\u0627 \u0647\u0645\u0686\u0646\u06cc\u0646 \u06cc\u06a9 \u0633\u0631\u0648\u06cc\u0633 WebSocket \u0628\u0631\u0627\u06cc \u0645\u0635\u0631\u0641 \u0627\u0634\u062a\u0631\u0627\u06a9 \u0647\u0627 \u0627\u06cc\u062c\u0627\u062f \u062e\u0648\u0627\u0647\u06cc\u0645 \u06a9\u0631\u062f.<\/p>\n<p>  \u062e\u0644\u0627\u0635\u0647: Customer 360 Use Case<\/p>\n<p>\u0645\u0642\u0627\u0644\u0647 \u0642\u0628\u0644\u06cc \u0645\u0646 \u062d\u0648\u0644 \u06cc\u06a9 \u0645\u0648\u0631\u062f \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 Customer 360 \u0645\u062a\u0645\u0631\u06a9\u0632 \u0628\u0648\u062f \u06a9\u0647 \u062f\u0631 \u0622\u0646 \u0645\u0634\u062a\u0631\u06cc\u0627\u0646 \u06a9\u0633\u0628 \u0648 \u06a9\u0627\u0631 \u062e\u06cc\u0627\u0644\u06cc \u0645\u0646 \u0645\u062c\u0645\u0648\u0639\u0647 \u062f\u0627\u062f\u0647 \u0647\u0627\u06cc \u0632\u06cc\u0631 \u0631\u0627 \u0646\u06af\u0647\u062f\u0627\u0631\u06cc \u0645\u06cc \u06a9\u0646\u0646\u062f:<\/p>\n<p>\u0627\u0637\u0644\u0627\u0639\u0627\u062a \u0645\u0634\u062a\u0631\u06cc<br \/>\n\u0627\u0637\u0644\u0627\u0639\u0627\u062a \u0622\u062f\u0631\u0633<br \/>\n\u0631\u0648\u0634 \u0647\u0627\u06cc \u062a\u0645\u0627\u0633<br \/>\n\u0648\u06cc\u0698\u06af\u06cc \u0647\u0627\u06cc \u0627\u0639\u062a\u0628\u0627\u0631\u06cc<\/p>\n<p>\u06cc\u06a9 \u067e\u06cc\u0631\u0648\u0632\u06cc \u0628\u0632\u0631\u06af \u062f\u0631 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 GraphQL \u0627\u06cc\u0646 \u0627\u0633\u062a \u06a9\u0647 \u06cc\u06a9 \u062f\u0631\u062e\u0648\u0627\u0633\u062a GraphQL \u0645\u06cc \u062a\u0648\u0627\u0646\u062f \u062a\u0645\u0627\u0645 \u062f\u0627\u062f\u0647 \u0647\u0627\u06cc \u0644\u0627\u0632\u0645 \u0628\u0631\u0627\u06cc \u062a\u0648\u06a9\u0646 \u0645\u0634\u062a\u0631\u06cc (\u0647\u0648\u06cc\u062a \u0645\u0646\u062d\u0635\u0631 \u0628\u0647 \u0641\u0631\u062f) \u0631\u0627 \u0628\u0627\u0632\u06cc\u0627\u0628\u06cc \u06a9\u0646\u062f.<\/p>\n<p>type Query {<br \/>\n    addresses: [Address]\n    address(customer_token: String): Address<br \/>\n    contacts: [Contact]\n    contact(customer_token: String): Contact<br \/>\n    customers: [Customer]\n    customer(token: String): Customer<br \/>\n    credits: [Credit]\n    credit(customer_token: String): Credit<br \/>\n}<\/p>\n<p>\u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u06cc\u06a9 \u0631\u0648\u06cc\u06a9\u0631\u062f RESTful \u0628\u0631\u0627\u06cc \u0628\u0627\u0632\u06cc\u0627\u0628\u06cc \u0646\u0645\u0627\u06cc \u0648\u0627\u062d\u062f (360) \u0645\u0634\u062a\u0631\u06cc \u0646\u06cc\u0627\u0632 \u0628\u0647 \u0686\u0646\u062f\u06cc\u0646 \u062f\u0631\u062e\u0648\u0627\u0633\u062a \u0648 \u067e\u0627\u0633\u062e \u062f\u0627\u0631\u062f. GraphQL \u0631\u0627\u0647 \u062d\u0644\u06cc \u0628\u0647 \u0645\u0627 \u0645\u06cc \u062f\u0647\u062f \u06a9\u0647 \u0639\u0645\u0644\u06a9\u0631\u062f \u0628\u0633\u06cc\u0627\u0631 \u0628\u0647\u062a\u0631\u06cc \u062f\u0627\u0631\u062f.<\/p>\n<p>  \u0627\u0647\u062f\u0627\u0641 \u0633\u0637\u062d \u0628\u0627\u0644\u0627<\/p>\n<p>\u0628\u0631\u0627\u06cc \u0627\u0631\u062a\u0642\u0627\u0621 \u0633\u0637\u062d \u062f\u0631 \u0647\u0631 \u062c\u0646\u0628\u0647 \u0627\u06cc \u0627\u0632 \u0632\u0646\u062f\u06af\u06cc\u060c \u0641\u0631\u062f \u0628\u0627\u06cc\u062f \u0628\u0647 \u0627\u0647\u062f\u0627\u0641 \u062c\u062f\u06cc\u062f\u06cc \u062f\u0633\u062a \u06cc\u0627\u0628\u062f. \u0628\u0631\u0627\u06cc \u0627\u0647\u062f\u0627\u0641 \u062e\u0648\u062f\u0645 \u062f\u0631 \u0627\u06cc\u0646\u062c\u0627\u060c \u0627\u06cc\u0646 \u0628\u0647 \u0627\u06cc\u0646 \u0645\u0639\u0646\u06cc \u0627\u0633\u062a:<\/p>\n<p>\u062f\u0631\u06a9 \u0648 \u067e\u06cc\u0627\u062f\u0647 \u0633\u0627\u0632\u06cc \u0627\u0631\u0632\u0634 \u067e\u06cc\u0634\u0646\u0647\u0627\u062f\u06cc \u0627\u0634\u062a\u0631\u0627\u06a9 \u0647\u0627 \u062f\u0631 GraphQL.<br \/>\n\u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u067e\u06cc\u0627\u062f\u0647 \u0633\u0627\u0632\u06cc WebSocket \u0628\u0631\u0627\u06cc \u0645\u0635\u0631\u0641 \u0627\u0634\u062a\u0631\u0627\u06a9 GraphQL.<\/p>\n<p>\u0627\u06cc\u062f\u0647 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0627\u0634\u062a\u0631\u0627\u06a9\u200c\u0647\u0627 \u0628\u0631 \u0631\u0648\u06cc \u06a9\u0648\u0626\u0631\u06cc\u200c\u0647\u0627 \u0648 \u062c\u0647\u0634\u200c\u0647\u0627 \u062f\u0631 GraphQL \u0632\u0645\u0627\u0646\u06cc \u06a9\u0647 \u0634\u0631\u0627\u06cc\u0637 \u0632\u06cc\u0631 \u0628\u0631\u0622\u0648\u0631\u062f\u0647 \u0634\u0648\u062f\u060c \u0631\u0648\u0634 \u062a\u0631\u062c\u06cc\u062d\u06cc \u0627\u0633\u062a:<\/p>\n<p>\u062a\u063a\u06cc\u06cc\u0631\u0627\u062a \u06a9\u0648\u0686\u06a9 \u0648 \u062a\u062f\u0631\u06cc\u062c\u06cc \u062f\u0631 \u0627\u062c\u0633\u0627\u0645 \u0628\u0632\u0631\u06af<br \/>\n\u0628\u0647\u200c\u0631\u0648\u0632\u0631\u0633\u0627\u0646\u06cc\u200c\u0647\u0627\u06cc \u0628\u06cc\u200c\u062f\u0631\u0646\u06af \u0648 \u0628\u0627 \u062a\u0623\u062e\u06cc\u0631 \u06a9\u0645 (\u0645\u0627\u0646\u0646\u062f \u0628\u0631\u0646\u0627\u0645\u0647 \u0686\u062a)<\/p>\n<p>\u0627\u06cc\u0646 \u0645\u0647\u0645 \u0627\u0633\u062a\u060c \u0632\u06cc\u0631\u0627 \u067e\u06cc\u0627\u062f\u0647\u200c\u0633\u0627\u0632\u06cc \u0627\u0634\u062a\u0631\u0627\u06a9\u200c\u0647\u0627 \u062f\u0631 GraphQL \u0628\u06cc\u200c\u0627\u0647\u0645\u06cc\u062a \u0646\u06cc\u0633\u062a. \u0646\u0647 \u062a\u0646\u0647\u0627 \u0633\u0631\u0648\u0631 \u0627\u0635\u0644\u06cc \u0646\u06cc\u0627\u0632 \u0628\u0647 \u0628\u0647 \u0631\u0648\u0632 \u0631\u0633\u0627\u0646\u06cc \u062f\u0627\u0631\u062f\u060c \u0628\u0644\u06a9\u0647 \u0628\u0631\u0646\u0627\u0645\u0647 \u0645\u0635\u0631\u0641 \u06a9\u0646\u0646\u062f\u0647 \u0646\u06cc\u0632 \u0646\u06cc\u0627\u0632 \u0628\u0647 \u0637\u0631\u0627\u062d\u06cc \u0645\u062c\u062f\u062f \u062f\u0627\u0631\u062f.<\/p>\n<p>\u062e\u0648\u0634\u0628\u062e\u062a\u0627\u0646\u0647\u060c \u0645\u0648\u0631\u062f\u06cc \u06a9\u0647 \u0645\u0627 \u0628\u0627 \u0646\u0645\u0648\u0646\u0647 \u0645\u0634\u062a\u0631\u06cc 360 \u062f\u0646\u0628\u0627\u0644 \u0645\u06cc \u06a9\u0646\u06cc\u0645\u060c \u0628\u0631\u0627\u06cc \u0627\u0634\u062a\u0631\u0627\u06a9 \u0647\u0627 \u0645\u0646\u0627\u0633\u0628 \u0627\u0633\u062a. \u0647\u0645\u0686\u0646\u06cc\u0646\u060c \u0645\u0627 \u06cc\u06a9 \u0631\u0648\u06cc\u06a9\u0631\u062f WebSocket \u0631\u0627 \u0628\u0631\u0627\u06cc \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0627\u06cc\u0646 \u0627\u0634\u062a\u0631\u0627\u06a9 \u0647\u0627 \u067e\u06cc\u0627\u062f\u0647 \u0633\u0627\u0632\u06cc \u062e\u0648\u0627\u0647\u06cc\u0645 \u06a9\u0631\u062f.<\/p>\n<p>\u0645\u0627\u0646\u0646\u062f \u0642\u0628\u0644\u060c \u0628\u0647 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0622\u067e\u0648\u0644\u0648 \u0627\u062f\u0627\u0645\u0647 \u062e\u0648\u0627\u0647\u0645 \u062f\u0627\u062f.<\/p>\n<p>  \u0627\u0631\u062a\u0642\u0627\u0621 \u0633\u0637\u062d \u0628\u0627 \u0627\u0639\u062a\u0628\u0627\u0631 \u0627\u0634\u062a\u0631\u0627\u06a9<\/p>\n<p>\u0627\u0628\u062a\u062f\u0627 \u0628\u0627\u06cc\u062f \u06a9\u062a\u0627\u0628\u062e\u0627\u0646\u0647 \u0647\u0627\u06cc \u0644\u0627\u0632\u0645 \u0631\u0627 \u0628\u0631\u0627\u06cc \u067e\u0634\u062a\u06cc\u0628\u0627\u0646\u06cc \u0627\u0632 \u0627\u0634\u062a\u0631\u0627\u06a9 \u0628\u0627 \u0633\u0631\u0648\u0631 \u0622\u067e\u0648\u0644\u0648 GraphQL \u062e\u0648\u062f \u0646\u0635\u0628 \u06a9\u0646\u06cc\u0645:<\/p>\n<p>npm install ws<br \/>\nnpm install graphql-ws @graphql-tools\/schema<br \/>\nnpm install graphql-subscriptions <\/p>\n<p>\u0628\u0627 \u0646\u0635\u0628 \u0622\u0646 \u0645\u0648\u0627\u0631\u062f\u060c \u0631\u0648\u06cc \u0628\u0647 \u0631\u0648\u0632 \u0631\u0633\u0627\u0646\u06cc \u0622\u0646 \u062a\u0645\u0631\u06a9\u0632 \u06a9\u0631\u062f\u0645 index.ts \u0627\u0632 \u0645\u062e\u0632\u0646 \u0627\u0635\u0644\u06cc \u0645\u0646 \u0628\u0631\u0627\u06cc \u06af\u0633\u062a\u0631\u0634 typedefs \u062b\u0627\u0628\u062a \u0628\u0627 \u0645\u0648\u0627\u0631\u062f \u0632\u06cc\u0631:<\/p>\n<p>type Subscription {<br \/>\n    creditUpdated: Credit<br \/>\n}<\/p>\n<p>\u0645\u0646 \u0647\u0645\u0686\u0646\u06cc\u0646 \u06cc\u06a9 \u062b\u0627\u0628\u062a \u0628\u0631\u0627\u06cc \u062e\u0627\u0646\u0647 \u062c\u062f\u06cc\u062f \u062a\u0627\u0633\u06cc\u0633 \u06a9\u0631\u062f\u0645 PubSub \u0646\u0645\u0648\u0646\u0647 \u0648 \u06cc\u06a9 \u0646\u0645\u0648\u0646\u0647 \u0627\u0634\u062a\u0631\u0627\u06a9 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0631\u062f\u06cc\u0645 \u06a9\u0647 \u0628\u0639\u062f\u0627\u064b \u0627\u0632 \u0622\u0646 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u062e\u0648\u0627\u0647\u06cc\u0645 \u06a9\u0631\u062f:<\/p>\n<p>const pubsub = new PubSub();<\/p>\n<p>pubsub.publish(&#8216;CREDIT_BALANCE_UPDATED&#8217;, {<br \/>\n    creditUpdated: {<br \/>\n    }<br \/>\n});<\/p>\n<p>\u0645\u0646 \u062d\u0644 \u06a9\u0646\u0646\u062f\u0647 \u0647\u0627\u06cc \u0645\u0648\u062c\u0648\u062f \u0631\u0627 \u067e\u0627\u06a9 \u06a9\u0631\u062f\u0645 \u0648 \u06cc\u06a9 \u062c\u062f\u06cc\u062f \u0627\u0636\u0627\u0641\u0647 \u06a9\u0631\u062f\u0645 Subscription \u0628\u0631\u0627\u06cc \u0627\u06cc\u0646 \u0645\u0648\u0631\u062f \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u062c\u062f\u06cc\u062f:<\/p>\n<p>const resolvers = {<br \/>\n    Query: {<br \/>\n        addresses: () =&gt; addresses,<br \/>\n        address: (parent, args) =&gt; {<br \/>\n            const customer_token = args.customer_token;<br \/>\n            return addresses.find(address =&gt; address.customer_token === customer_token);<br \/>\n        },<br \/>\n        contacts: () =&gt; contacts,<br \/>\n        contact: (parent, args) =&gt; {<br \/>\n            const customer_token = args.customer_token;<br \/>\n            return contacts.find(contact =&gt; contact.customer_token === customer_token);<br \/>\n        },<br \/>\n        customers: () =&gt; customers,<br \/>\n        customer: (parent, args) =&gt; {<br \/>\n            const token = args.token;<br \/>\n            return customers.find(customer =&gt; customer.token === token);<br \/>\n        },<br \/>\n        credits: () =&gt; credits,<br \/>\n        credit: (parent, args) =&gt; {<br \/>\n            const customer_token = args.customer_token;<br \/>\n            return credits.find(credit =&gt; credit.customer_token === customer_token);<br \/>\n        }<br \/>\n    },<br \/>\n    Subscription: {<br \/>\n        creditUpdated: {<br \/>\n            subscribe: () =&gt; pubsub.asyncIterator([&#8216;CREDIT_BALANCE_UPDATED&#8217;]),<br \/>\n        }<br \/>\n    }<br \/>\n};<\/p>\n<p>\u0633\u067e\u0633 \u067e\u06cc\u06a9\u0631\u0628\u0646\u062f\u06cc \u0633\u0631\u0648\u0631 \u0631\u0627 \u0628\u0627\u0632\u0633\u0627\u0632\u06cc \u06a9\u0631\u062f\u0645 \u0648 \u0637\u0631\u062d \u0627\u0634\u062a\u0631\u0627\u06a9 \u0631\u0627 \u0645\u0639\u0631\u0641\u06cc \u06a9\u0631\u062f\u0645:<\/p>\n<p>const app = express();<br \/>\nconst httpServer = createServer(app);<br \/>\nconst wsServer = new WebSocketServer({<br \/>\n    server: httpServer,<br \/>\n    path: &#8216;\/graphql&#8217;<br \/>\n});<\/p>\n<p>const schema = makeExecutableSchema({ typeDefs, resolvers });<br \/>\nconst serverCleanup = useServer({ schema }, wsServer);<\/p>\n<p>const server = new ApolloServer({<br \/>\n    schema,<br \/>\n    plugins: [<br \/>\n        ApolloServerPluginDrainHttpServer({ httpServer }),<br \/>\n        {<br \/>\n            async serverWillStart() {<br \/>\n                return {<br \/>\n                    async drainServer() {<br \/>\n                        serverCleanup.dispose();<br \/>\n                    }<br \/>\n                };<br \/>\n            }<br \/>\n        }<br \/>\n    ],<br \/>\n});<\/p>\n<p>await server.start();<\/p>\n<p>app.use(&#8216;\/graphql&#8217;, cors(), express.json(), expressMiddleware(server, {<br \/>\n    context: async () =&gt; ({ pubsub })<br \/>\n}));<\/p>\n<p>const PORT = Number.parseInt(process.env.PORT) || 4000;<br \/>\nhttpServer.listen(PORT, () =&gt; {<br \/>\n    console.log(`Server is now running on http:\/\/localhost:${PORT}\/graphql`);<br \/>\n    console.log(`Subscription is now running on ws:\/\/localhost:${PORT}\/graphql`);<br \/>\n});<\/p>\n<p>\u0628\u0631\u0627\u06cc \u0634\u0628\u06cc\u0647\u200c\u0633\u0627\u0632\u06cc \u0628\u0647\u200c\u0631\u0648\u0632\u0631\u0633\u0627\u0646\u06cc\u200c\u0647\u0627\u06cc \u0645\u0628\u062a\u0646\u06cc \u0628\u0631 \u0645\u0634\u062a\u0631\u06cc\u060c \u0631\u0648\u0634 \u0632\u06cc\u0631 \u0631\u0627 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0631\u062f\u0645 \u062a\u0627 \u0645\u0648\u062c\u0648\u062f\u06cc \u0627\u0639\u062a\u0628\u0627\u0631 \u0631\u0627 \u0647\u0631 \u067e\u0646\u062c \u062b\u0627\u0646\u06cc\u0647 \u0628\u0647 \u0645\u06cc\u0632\u0627\u0646 50 \u062f\u0644\u0627\u0631 \u0627\u0641\u0632\u0627\u06cc\u0634 \u062f\u0647\u0645 \u062f\u0631 \u062d\u0627\u0644\u06cc \u06a9\u0647 \u0633\u0631\u0648\u06cc\u0633 \u062f\u0631 \u062d\u0627\u0644 \u0627\u062c\u0631\u0627 \u0627\u0633\u062a. \u0647\u0646\u06af\u0627\u0645\u06cc \u06a9\u0647 \u0645\u0648\u062c\u0648\u062f\u06cc \u0628\u0647 \u0633\u0642\u0641 \u0627\u0639\u062a\u0628\u0627\u0631\u06cc 10000 \u062f\u0644\u0627\u0631 \u0631\u0633\u06cc\u062f (\u06cc\u0627 \u0627\u0632 \u0622\u0646 \u0641\u0631\u0627\u062a\u0631 \u0631\u0641\u062a\u060c \u0645\u0648\u062c\u0648\u062f\u06cc \u0631\u0627 \u0628\u0647 2500 \u062f\u0644\u0627\u0631 \u0628\u0627\u0632\u0646\u0634\u0627\u0646\u06cc \u06a9\u0631\u062f\u0645 \u0648 \u067e\u0631\u062f\u0627\u062e\u062a \u0645\u0648\u062c\u0648\u062f\u06cc \u0631\u0627 \u0634\u0628\u06cc\u0647 \u0633\u0627\u0632\u06cc \u06a9\u0631\u062f\u0645.<\/p>\n<p>function incrementCreditBalance() {<br \/>\n    if (credits[0].balance &gt;= credits[0].credit_limit) {<br \/>\n        credits[0].balance = 0.00;<br \/>\n        console.log(`Credit balance reset to ${credits[0].balance}`);<\/p>\n<p>    } else {<br \/>\n        credits[0].balance += 50.00;<br \/>\n        console.log(`Credit balance updated to ${credits[0].balance}`);<br \/>\n    }<\/p>\n<p>    pubsub.publish(&#8216;CREDIT_BALANCE_UPDATED&#8217;, { creditUpdated: credits[0] });<br \/>\n    setTimeout(incrementCreditBalance, 5000);<br \/>\n}<\/p>\n<p>incrementCreditBalance();<\/p>\n<p>\u06a9\u0627\u0645\u0644 index.ts \u0641\u0627\u06cc\u0644 \u0631\u0627 \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u062f \u062f\u0631 \u0627\u06cc\u0646\u062c\u0627 \u067e\u06cc\u062f\u0627 \u06a9\u0646\u06cc\u062f.<\/p>\n<p>  \u0628\u0647 \u0647\u0631\u0648\u06a9\u0648 \u0645\u0633\u062a\u0642\u0631 \u0634\u0648\u06cc\u062f<\/p>\n<p>\u0628\u0627 \u0622\u0645\u0627\u062f\u0647 \u0628\u0648\u062f\u0646 \u0633\u0631\u0648\u06cc\u0633\u060c \u0632\u0645\u0627\u0646 \u0622\u0646 \u0641\u0631\u0627 \u0631\u0633\u06cc\u062f\u0647 \u0627\u0633\u062a \u06a9\u0647 \u0633\u0631\u0648\u06cc\u0633 \u0631\u0627 \u0645\u0633\u062a\u0642\u0631 \u06a9\u0646\u06cc\u0645 \u062a\u0627 \u0628\u062a\u0648\u0627\u0646\u06cc\u0645 \u0628\u0627 \u0622\u0646 \u062a\u0639\u0627\u0645\u0644 \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u06cc\u0645. \u0627\u0632 \u0622\u0646\u062c\u0627\u06cc\u06cc \u06a9\u0647 Heroku \u062f\u0641\u0639\u0647 \u0642\u0628\u0644 \u0639\u0627\u0644\u06cc \u0639\u0645\u0644 \u06a9\u0631\u062f (\u0648 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0622\u0646 \u0628\u0631\u0627\u06cc \u0645\u0646 \u0622\u0633\u0627\u0646 \u0627\u0633\u062a)\u060c \u0628\u06cc\u0627\u06cc\u06cc\u062f \u0628\u0647 \u0627\u06cc\u0646 \u0631\u0648\u06cc\u06a9\u0631\u062f \u0628\u0645\u0627\u0646\u06cc\u0645.<\/p>\n<p>\u0628\u0631\u0627\u06cc \u0634\u0631\u0648\u0639\u060c \u0645\u0646 \u0628\u0627\u06cc\u062f \u062f\u0633\u062a\u0648\u0631\u0627\u062a Heroku CLI \u0632\u06cc\u0631 \u0631\u0627 \u0627\u062c\u0631\u0627 \u06a9\u0646\u0645:<\/p>\n<p>$ heroku login<br \/>\n$ heroku create jvc-graphql-server-sub<\/p>\n<p>Creating \u2b22 jvc-graphql-server-sub&#8230; done<br \/>\nhttps:\/\/jvc-graphql-server-sub-1ec2e6406a82.herokuapp.com\/ | https:\/\/git.heroku.com\/jvc-graphql-server-sub.git<\/p>\n<p>\u0627\u06cc\u0646 \u062f\u0633\u062a\u0648\u0631 \u0647\u0645\u0686\u0646\u06cc\u0646 \u0628\u0647 \u0637\u0648\u0631 \u062e\u0648\u062f\u06a9\u0627\u0631 \u0645\u062e\u0632\u0646 \u0645\u0648\u0631\u062f \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u062a\u0648\u0633\u0637 Heroku \u0631\u0627 \u0628\u0647 \u0639\u0646\u0648\u0627\u0646 \u06cc\u06a9 \u06a9\u0646\u062a\u0631\u0644 \u0627\u0632 \u0631\u0627\u0647 \u062f\u0648\u0631 \u0627\u0636\u0627\u0641\u0647 \u0645\u06cc \u06a9\u0646\u062f:<\/p>\n<p>$ git remote<br \/>\nheroku<br \/>\norigin<\/p>\n<p>\u0647\u0645\u0627\u0646\u0637\u0648\u0631 \u06a9\u0647 \u062f\u0631 \u0645\u0642\u0627\u0644\u0647 \u0642\u0628\u0644\u06cc \u062e\u0648\u062f \u0627\u0634\u0627\u0631\u0647 \u06a9\u0631\u062f\u0645\u060c \u0622\u067e\u0648\u0644\u0648 \u0633\u0631\u0648\u0631 \u0622\u067e\u0648\u0644\u0648 \u0627\u06a9\u0633\u067e\u0644\u0648\u0631\u0631 \u0631\u0627 \u062f\u0631 \u0645\u062d\u06cc\u0637 \u0647\u0627\u06cc \u062a\u0648\u0644\u06cc\u062f \u063a\u06cc\u0631\u0641\u0639\u0627\u0644 \u0645\u06cc \u06a9\u0646\u062f. \u0628\u0631\u0627\u06cc \u0627\u06cc\u0646\u06a9\u0647 \u0622\u067e\u0648\u0644\u0648 \u0627\u06a9\u0633\u067e\u0644\u0648\u0631\u0631 \u0631\u0627 \u0628\u0631\u0627\u06cc \u0646\u06cc\u0627\u0632\u0647\u0627\u06cc\u0645\u0627\u0646 \u062f\u0631 \u062f\u0633\u062a\u0631\u0633 \u0646\u06af\u0647 \u062f\u0627\u0631\u0645\u060c \u0628\u0627\u06cc\u062f \u0622\u0646 \u0631\u0627 \u062a\u0646\u0638\u06cc\u0645 \u06a9\u0646\u0645 NODE_ENV \u0645\u062a\u063a\u06cc\u0631 \u0645\u062d\u06cc\u0637\u06cc \u0628\u0631\u0627\u06cc \u062a\u0648\u0633\u0639\u0647 \u0645\u0646 \u0622\u0646 \u0631\u0627 \u0628\u0627 \u062f\u0633\u062a\u0648\u0631 CLI \u0632\u06cc\u0631 \u062a\u0646\u0638\u06cc\u0645 \u06a9\u0631\u062f\u0645:<\/p>\n<p>$ heroku config:set NODE_ENV=development<\/p>\n<p>Setting NODE_ENV and restarting \u2b22 jvc-graphql-server-sub&#8230; done, v3<br \/>\nNODE_ENV: development<\/p>\n<p>\u0645\u0646 \u0622\u0645\u0627\u062f\u0647 \u0628\u0648\u062f\u0645 \u062a\u0627 \u06a9\u062f \u062e\u0648\u062f \u0631\u0627 \u062f\u0631 Heroku \u0645\u0633\u062a\u0642\u0631 \u06a9\u0646\u0645:<\/p>\n<p>$ git commit &#8211;allow-empty -m &#8216;Deploy to Heroku&#8217;<br \/>\n$ git push heroku<\/p>\n<p>\u06cc\u06a9 \u0646\u0645\u0627\u06cc \u0633\u0631\u06cc\u0639 \u0627\u0632 \u062f\u0627\u0634\u0628\u0648\u0631\u062f Heroku \u0646\u0634\u0627\u0646 \u062f\u0627\u062f \u06a9\u0647 \u0633\u0631\u0648\u0631 \u0622\u067e\u0648\u0644\u0648 \u0645\u0646 \u0628\u062f\u0648\u0646 \u0647\u06cc\u0686 \u0645\u0634\u06a9\u0644\u06cc \u062f\u0631 \u062d\u0627\u0644 \u0627\u062c\u0631\u0627 \u0627\u0633\u062a:<\/p>\n<p>\u062f\u0631 \u0628\u062e\u0634 \u062a\u0646\u0638\u06cc\u0645\u0627\u062a\u060c URL \u0628\u0631\u0646\u0627\u0645\u0647 Heroku \u0631\u0627 \u0628\u0631\u0627\u06cc \u0627\u06cc\u0646 \u0646\u0645\u0648\u0646\u0647 \u0633\u0631\u0648\u06cc\u0633 \u067e\u06cc\u062f\u0627 \u06a9\u0631\u062f\u0645:<\/p>\n<p>https:\/\/jvc-graphql-server-sub-1ec2e6406a82.herokuapp.com\/<\/p>\n<p>\u0644\u0637\u0641\u0627\u064b \u062a\u0648\u062c\u0647 \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u06cc\u062f &#8211; \u0627\u06cc\u0646 \u067e\u06cc\u0648\u0646\u062f \u062a\u0627 \u0632\u0645\u0627\u0646 \u0627\u0646\u062a\u0634\u0627\u0631 \u0627\u06cc\u0646 \u0645\u0642\u0627\u0644\u0647 \u062f\u06cc\u06af\u0631 \u062f\u0631 \u062e\u062f\u0645\u062a \u0646\u062e\u0648\u0627\u0647\u062f \u0628\u0648\u062f.<\/p>\n<p>\u0641\u0639\u0644\u0627\u064b \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u0645 graphql \u0631\u0627 \u0628\u0647 \u0627\u06cc\u0646 URL \u0627\u0636\u0627\u0641\u0647 \u06a9\u0646\u0645 \u062a\u0627 Apollo Server Studio \u0631\u0627 \u0631\u0627\u0647\u200c\u0627\u0646\u062f\u0627\u0632\u06cc \u06a9\u0646\u0645. \u0627\u06cc\u0646 \u0628\u0647 \u0645\u0646 \u0627\u062c\u0627\u0632\u0647 \u0645\u06cc \u062f\u0647\u062f \u062a\u0627 \u0628\u0628\u06cc\u0646\u0645 \u0627\u0634\u062a\u0631\u0627\u06a9 \u0647\u0627 \u0647\u0645\u0627\u0646\u0637\u0648\u0631 \u06a9\u0647 \u0627\u0646\u062a\u0638\u0627\u0631 \u0645\u06cc \u0631\u0648\u062f \u06a9\u0627\u0631 \u0645\u06cc \u06a9\u0646\u0646\u062f:<\/p>\n<p>\u0628\u0647 \u067e\u0627\u0633\u062e \u0647\u0627\u06cc \u0627\u0634\u062a\u0631\u0627\u06a9 \u062f\u0631 \u0627\u0646\u062f\u0627\u0632\u0647 \u0633\u0645\u062a \u0631\u0627\u0633\u062a \u0635\u0641\u062d\u0647 \u062a\u0648\u062c\u0647 \u06a9\u0646\u06cc\u062f.<\/p>\n<p>  \u0627\u0631\u062a\u0642\u0627\u0621 \u0633\u0637\u062d \u0628\u0627 WebSocket Skillz<\/p>\n<p>\u0645\u0627 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u0645 \u0627\u0632 \u067e\u0634\u062a\u06cc\u0628\u0627\u0646\u06cc WebSocket \u0648 \u0642\u0627\u0628\u0644\u06cc\u062a\u200c\u0647\u0627\u06cc Heroku \u0628\u0631\u0627\u06cc \u0627\u06cc\u062c\u0627\u062f \u067e\u06cc\u0627\u062f\u0647\u200c\u0633\u0627\u0632\u06cc \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u0645 \u06a9\u0647 \u0627\u0634\u062a\u0631\u0627\u06a9\u06cc \u0631\u0627 \u06a9\u0647 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0631\u062f\u0647\u200c\u0627\u06cc\u0645 \u0645\u0635\u0631\u0641 \u06a9\u0646\u062f.<\/p>\n<p>\u062f\u0631 \u0645\u0648\u0631\u062f \u0645\u0646\u060c \u0645\u0646 \u06cc\u06a9 \u0641\u0627\u06cc\u0644 index.js \u0628\u0627 \u0645\u062d\u062a\u0648\u06cc\u0627\u062a \u0632\u06cc\u0631 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0631\u062f\u0645. \u0627\u0633\u0627\u0633\u0627\u060c \u0627\u06cc\u0646 \u06cc\u06a9 \u0633\u0631\u0648\u06cc\u0633 \u06af\u06cc\u0631\u0646\u062f\u0647 WebSocket \u0627\u06cc\u062c\u0627\u062f \u06a9\u0631\u062f \u0648 \u0647\u0645\u0686\u0646\u06cc\u0646 \u06cc\u06a9 \u0633\u0631\u0648\u06cc\u0633 HTTP \u0633\u0627\u062e\u062a\u06af\u06cc \u0627\u06cc\u062c\u0627\u062f \u06a9\u0631\u062f \u06a9\u0647 \u0645\u06cc \u062a\u0648\u0627\u0646\u0633\u062a\u0645 \u0628\u0631\u0627\u06cc \u062a\u0623\u06cc\u06cc\u062f \u0627\u0639\u062a\u0628\u0627\u0631 \u06a9\u0644\u0627\u06cc\u0646\u062a \u062f\u0631 \u062d\u0627\u0644 \u0627\u062c\u0631\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u0645:<\/p>\n<p>import { createClient } from &#8220;graphql-ws&#8221;;<br \/>\nimport { WebSocket } from &#8220;ws&#8221;;<br \/>\nimport http from &#8220;http&#8221;;<\/p>\n<p>\/\/ Create a dummy HTTP server to bind to Heroku&#8217;s $PORT<br \/>\nconst PORT = process.env.PORT || 3000;<br \/>\nhttp.createServer((req, res) =&gt; res.end(&#8216;Server is running&#8217;)).listen(PORT, () =&gt; {<br \/>\n  console.log(`HTTP server running on port ${PORT}`);<br \/>\n});<\/p>\n<p>const host_url = process.env.GRAPHQL_SUBSCRIPTION_HOST || &#8216;ws:\/\/localhost:4000\/graphql&#8217;;<\/p>\n<p>const client = createClient({<br \/>\n  url: host_url,<br \/>\n  webSocketImpl: WebSocket<br \/>\n});<\/p>\n<p>const query = `subscription {<br \/>\n  creditUpdated {<br \/>\n    token<br \/>\n    customer_token<br \/>\n    credit_limit<br \/>\n    balance<br \/>\n    credit_score<br \/>\n  }<br \/>\n}`;<\/p>\n<p>function handleCreditUpdated(data) {<br \/>\n  console.log(&#8216;Received credit update:&#8217;, data);<br \/>\n}<\/p>\n<p>\/\/ Subscribe to the creditUpdated subscription<br \/>\nclient.subscribe(<br \/>\n  {<br \/>\n    query,<br \/>\n  },<br \/>\n  {<br \/>\n    next: (data) =&gt; handleCreditUpdated(data.data.creditUpdated),<br \/>\n    error: (err) =&gt; console.error(&#8216;Subscription error:&#8217;, err),<br \/>\n    complete: () =&gt; console.log(&#8216;Subscription complete&#8217;),<br \/>\n  }<br \/>\n);<\/p>\n<p>\u06a9\u0627\u0645\u0644 index.js \u0641\u0627\u06cc\u0644 \u0631\u0627 \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u062f \u062f\u0631 \u0627\u06cc\u0646\u062c\u0627 \u067e\u06cc\u062f\u0627 \u06a9\u0646\u06cc\u062f.<\/p>\n<p>\u0645\u0627 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u0645 \u0627\u06cc\u0646 \u0628\u0631\u0646\u0627\u0645\u0647 \u0633\u0627\u062f\u0647 Node.js \u0631\u0627 \u062f\u0631 Heroku \u0646\u06cc\u0632 \u0645\u0633\u062a\u0642\u0631 \u06a9\u0646\u06cc\u0645 \u0648 \u0645\u0637\u0645\u0626\u0646 \u0634\u0648\u06cc\u0645 \u06a9\u0647 \u0622\u0646 \u0631\u0627 \u062a\u0646\u0638\u06cc\u0645 \u06a9\u0631\u062f\u0647\u200c\u0627\u06cc\u0645 GRAPHQL_SUBSCRIPTION_HOST \u0645\u062a\u063a\u06cc\u0631 \u0645\u062d\u06cc\u0637\u06cc \u0628\u0647 URL \u0628\u0631\u0646\u0627\u0645\u0647 Heroku \u06a9\u0647 \u0642\u0628\u0644\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0631\u062f\u06cc\u0645. <\/p>\n<p>\u0645\u0648\u0627\u0631\u062f \u0632\u06cc\u0631 \u0631\u0627 \u0646\u06cc\u0632 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0631\u062f\u0645 Procfile \u0628\u0631\u0627\u06cc \u0627\u06cc\u0646\u06a9\u0647 \u0628\u0647 Heroku \u0628\u06af\u0648\u06cc\u0645 \u0686\u06af\u0648\u0646\u0647 \u0628\u0631\u0646\u0627\u0645\u0647 \u0645\u0646 \u0631\u0627 \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u06a9\u0646\u062f:<\/p>\n<p>web: node src\/index.js<\/p>\n<p>\u0628\u0639\u062f \u0645\u0646 \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 \u062c\u062f\u06cc\u062f Heroku \u0627\u06cc\u062c\u0627\u062f \u06a9\u0631\u062f\u0645:<\/p>\n<p>$ heroku create jvc-websocket-example<\/p>\n<p>Creating \u2b22 jvc-websocket-example&#8230; done<br \/>\nhttps:\/\/jvc-websocket-example-62824c0b1df4.herokuapp.com\/ | https:\/\/git.heroku.com\/jvc-websocket-example.git<\/p>\n<p>\u0633\u067e\u0633\u060c \u0645\u0646 \u0631\u0627 \u062a\u0646\u0638\u06cc\u0645 \u06a9\u0631\u062f\u0645 GRAPHQL_SUBSCRIPTION_HOST \u0645\u062a\u063a\u06cc\u0631 \u0645\u062d\u06cc\u0637\u06cc \u0628\u0631\u0627\u06cc \u0627\u0634\u0627\u0631\u0647 \u0628\u0647 \u0633\u0631\u0648\u0631 GraphQL \u062f\u0631 \u062d\u0627\u0644 \u0627\u062c\u0631\u0627 \u0645\u0646:<\/p>\n<p>$ heroku &#8211;app jvc-websocket-example \\<br \/>\n    config:set \\<br \/>\nGRAPHQL_SUBSCRIPTION_HOST=ws:\/\/jvc-graphql-server-sub-1ec2e6406a82.herokuapp.com\/graphql<\/p>\n<p>\u062f\u0631 \u0627\u06cc\u0646 \u0645\u0631\u062d\u0644\u0647\u060c \u0645\u0627 \u0622\u0645\u0627\u062f\u0647 \u0647\u0633\u062a\u06cc\u0645 \u062a\u0627 \u06a9\u062f \u062e\u0648\u062f \u0631\u0627 \u062f\u0631 Heroku \u0645\u0633\u062a\u0642\u0631 \u06a9\u0646\u06cc\u0645:<\/p>\n<p>$ git commit &#8211;allow-empty -m &#8216;Deploy to Heroku&#8217;<br \/>\n$ git push heroku<\/p>\n<p>\u0647\u0646\u06af\u0627\u0645\u06cc \u06a9\u0647 \u0633\u0631\u0648\u06cc\u0633 \u06af\u06cc\u0631\u0646\u062f\u0647 WebSocket \u0634\u0631\u0648\u0639 \u0628\u0647 \u06a9\u0627\u0631 \u06a9\u0631\u062f\u060c \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u0645 \u0648\u0636\u0639\u06cc\u062a \u0622\u0646 \u0631\u0627 \u062f\u0631 \u062f\u0627\u0634\u0628\u0648\u0631\u062f Heroku \u0645\u0634\u0627\u0647\u062f\u0647 \u06a9\u0646\u06cc\u0645:<\/p>\n<p>\u0628\u0627 \u0645\u0634\u0627\u0647\u062f\u0647 \u0633\u06cc\u0627\u0647\u0647\u0647\u0627\u06cc \u0645\u0631\u0628\u0648\u0637 \u0628\u0647 \u062f\u0627\u0634\u0628\u0648\u0631\u062f Heroku \u0628\u0631\u0627\u06cc jvc-websocket-example \u0628\u0647 \u0639\u0646\u0648\u0627\u0646 \u0645\u062b\u0627\u0644\u060c \u0645\u0627 \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u0645 \u0628\u0647 \u0631\u0648\u0632 \u0631\u0633\u0627\u0646\u06cc \u0647\u0627\u06cc \u0645\u062a\u0639\u062f\u062f \u0631\u0627 \u0645\u0634\u0627\u0647\u062f\u0647 \u06a9\u0646\u06cc\u0645 balance \u062f\u0627\u0631\u0627\u06cc\u06cc \u0627\u0632 jvc-graphql-server-sub \u062e\u062f\u0645\u0627\u062a \u062f\u0631 \u0646\u0633\u062e\u0647 \u06cc \u0646\u0645\u0627\u06cc\u0634\u06cc \u062e\u0648\u062f\u060c \u0645\u0646 \u062d\u062a\u06cc \u062a\u0648\u0627\u0646\u0633\u062a\u0645 \u0645\u0648\u0631\u062f \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0631\u0627 \u0636\u0628\u0637 \u06a9\u0646\u0645 \u06a9\u0647 \u062f\u0631 \u0622\u0646 \u0645\u0648\u062c\u0648\u062f\u06cc \u0628\u0647 \u0635\u0641\u0631 \u0631\u0633\u06cc\u062f\u0647 \u0627\u0633\u062a\u060c \u0648 \u0634\u0628\u06cc\u0647 \u0633\u0627\u0632\u06cc \u067e\u0631\u062f\u0627\u062e\u062a \u0627\u0646\u062c\u0627\u0645 \u0634\u062f\u0647 \u0627\u0633\u062a:<\/p>\n<p>\u062f\u0631 \u062a\u0631\u0645\u06cc\u0646\u0627\u0644\u060c \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u0645 \u0628\u0627 \u062f\u0633\u062a\u0648\u0631 CLI\u060c \u0628\u0647 \u0647\u0645\u0627\u0646 \u0644\u0627\u06af\u200c\u0647\u0627 \u062f\u0633\u062a\u0631\u0633\u06cc \u067e\u06cc\u062f\u0627 \u06a9\u0646\u06cc\u0645.<\/p>\n<p>2024-08-28T12:14:48.463846+00:00 app[web.1]: Received credit update: {<br \/>\n2024-08-28T12:14:48.463874+00:00 app[web.1]:   token: &#8216;credit-token-1&#8217;,<br \/>\n2024-08-28T12:14:48.463875+00:00 app[web.1]:   customer_token: &#8216;customer-token-1&#8217;,<br \/>\n2024-08-28T12:14:48.463875+00:00 app[web.1]:   credit_limit: 10000,<br \/>\n2024-08-28T12:14:48.463875+00:00 app[web.1]:   balance: 9950,<br \/>\n2024-08-28T12:14:48.463876+00:00 app[web.1]:   credit_score: 750<br \/>\n2024-08-28T12:14:48.463876+00:00 app[web.1]: }<\/p>\n<p>\u0645\u0627 \u0646\u0647 \u062a\u0646\u0647\u0627 \u06cc\u06a9 \u0633\u0631\u0648\u06cc\u0633 GraphQL \u0628\u0627 \u0627\u062c\u0631\u0627\u06cc \u0627\u0634\u062a\u0631\u0627\u06a9 \u062f\u0627\u0631\u06cc\u0645\u060c \u0628\u0644\u06a9\u0647 \u0627\u06a9\u0646\u0648\u0646 \u06cc\u06a9 \u0633\u0631\u0648\u06cc\u0633 \u06af\u06cc\u0631\u0646\u062f\u0647 WebSocket \u062f\u0627\u0631\u06cc\u0645 \u06a9\u0647 \u0627\u06cc\u0646 \u0628\u0647 \u0631\u0648\u0632 \u0631\u0633\u0627\u0646\u06cc \u0647\u0627 \u0631\u0627 \u0645\u0635\u0631\u0641 \u0645\u06cc \u06a9\u0646\u062f.<\/p>\n<p>  \u0646\u062a\u06cc\u062c\u0647 \u06af\u06cc\u0631\u06cc<\/p>\n<p>\u062e\u0648\u0627\u0646\u0646\u062f\u06af\u0627\u0646 \u0645\u0646 \u0645\u0645\u06a9\u0646 \u0627\u0633\u062a \u0628\u06cc\u0627\u0646\u06cc\u0647 \u0645\u0627\u0645\u0648\u0631\u06cc\u062a \u0634\u062e\u0635\u06cc \u0645\u0646 \u0631\u0627 \u0628\u0647 \u06cc\u0627\u062f \u0628\u06cc\u0627\u0648\u0631\u0646\u062f\u060c \u06a9\u0647 \u0645\u0646 \u0627\u062d\u0633\u0627\u0633 \u0645\u06cc \u06a9\u0646\u0645 \u0645\u06cc \u062a\u0648\u0627\u0646\u062f \u0628\u0631\u0627\u06cc \u0647\u0631 \u0645\u062a\u062e\u0635\u0635 \u0641\u0646\u0627\u0648\u0631\u06cc \u0627\u0637\u0644\u0627\u0639\u0627\u062a \u0627\u0639\u0645\u0627\u0644 \u0634\u0648\u062f:<\/p>\n<p>\u00ab\u0632\u0645\u0627\u0646 \u062e\u0648\u062f \u0631\u0627 \u0631\u0648\u06cc \u0627\u0631\u0627\u0626\u0647 \u0648\u06cc\u0698\u06af\u06cc\u200c\u0647\u0627\/\u0639\u0645\u0644\u06a9\u0631\u062f\u0647\u0627\u06cc\u06cc \u0645\u062a\u0645\u0631\u06a9\u0632 \u06a9\u0646\u06cc\u062f \u06a9\u0647 \u0627\u0631\u0632\u0634 \u0645\u0627\u0644\u06a9\u06cc\u062a \u0645\u0639\u0646\u0648\u06cc \u0634\u0645\u0627 \u0631\u0627 \u0627\u0641\u0632\u0627\u06cc\u0634 \u0645\u06cc\u200c\u062f\u0647\u062f. \u0627\u0632 \u0686\u0627\u0631\u0686\u0648\u0628 \u0647\u0627\u060c \u0645\u062d\u0635\u0648\u0644\u0627\u062a \u0648 \u062e\u062f\u0645\u0627\u062a \u0628\u0631\u0627\u06cc \u0647\u0631 \u0686\u06cc\u0632 \u062f\u06cc\u06af\u0631\u06cc \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u062f.&#8221;<\/p>\n<p>&#8211; \u062c\u06cc. \u0648\u0633\u062a\u0631<\/p>\n<p>\u062f\u0631 \u0627\u06cc\u0646 \u0628\u0631\u0631\u0633\u06cc \u0639\u0645\u06cc\u0642 \u062f\u0631 \u0627\u0634\u062a\u0631\u0627\u06a9\u200c\u0647\u0627\u06cc GraphQL\u060c \u0645\u0627 \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0633\u0631\u0648\u06cc\u0633 \u062f\u06cc\u06af\u0631\u06cc \u06a9\u0647 \u0628\u0631 \u0631\u0648\u06cc Heroku \u0627\u062c\u0631\u0627 \u0645\u06cc\u200c\u0634\u0648\u062f &#8211; \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 \u0645\u0628\u062a\u0646\u06cc \u0628\u0631 Node.js \u06a9\u0647 \u0627\u0632 WebSockets \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0645\u06cc\u200c\u06a9\u0646\u062f\u060c \u0628\u0647\u200c\u0631\u0648\u0632\u0631\u0633\u0627\u0646\u06cc\u200c\u0647\u0627\u06cc \u0633\u0631\u0648\u0631 \u0622\u067e\u0648\u0644\u0648 \u0631\u0627 \u06a9\u0647 \u0631\u0648\u06cc Heroku \u0627\u062c\u0631\u0627 \u0645\u06cc\u200c\u0634\u0648\u062f\u060c \u0628\u0627 \u0645\u0648\u0641\u0642\u06cc\u062a \u0645\u0635\u0631\u0641 \u06a9\u0631\u062f\u06cc\u0645. \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0627\u0634\u062a\u0631\u0627\u06a9\u200c\u0647\u0627\u06cc \u0633\u0628\u06a9 \u0648\u0632\u0646\u060c \u0627\u0632 \u0627\u0631\u0633\u0627\u0644 \u062f\u0631\u062e\u0648\u0627\u0633\u062a \u0628\u0631\u0627\u06cc \u062f\u0627\u062f\u0647\u200c\u0647\u0627\u06cc \u0628\u062f\u0648\u0646 \u062a\u063a\u06cc\u06cc\u0631 \u0627\u062c\u062a\u0646\u0627\u0628 \u06a9\u0631\u062f\u06cc\u0645\u060c \u0627\u0645\u0627 \u0635\u0631\u0641\u0627\u064b \u0645\u0634\u062a\u0631\u06a9 \u0634\u062f\u06cc\u0645 \u062a\u0627 \u0628\u0647\u200c\u0631\u0648\u0632\u0631\u0633\u0627\u0646\u06cc\u200c\u0647\u0627\u06cc \u0645\u0648\u062c\u0648\u062f\u06cc \u0627\u0639\u062a\u0628\u0627\u0631 \u0631\u0627 \u062f\u0631 \u0635\u0648\u0631\u062a \u0648\u0642\u0648\u0639 \u062f\u0631\u06cc\u0627\u0641\u062a \u06a9\u0646\u06cc\u0645.<\/p>\n<p>\u062f\u0631 \u0645\u0642\u062f\u0645\u0647\u060c \u0628\u0647 \u062f\u0646\u0628\u0627\u0644 \u06cc\u06a9 \u0627\u0635\u0644 \u0627\u0631\u0632\u0634 \u0627\u0636\u0627\u0641\u06cc \u062f\u0631 \u0645\u0648\u0636\u0648\u0639\u06cc \u06a9\u0647 \u0642\u0628\u0644\u0627\u064b \u062f\u0631 \u0645\u0648\u0631\u062f \u0622\u0646 \u0646\u0648\u0634\u062a\u0647\u200c\u0627\u0645\u060c \u0627\u0634\u0627\u0631\u0647 \u06a9\u0631\u062f\u0645. \u0627\u0634\u062a\u0631\u0627\u06a9\u200c\u0647\u0627\u06cc GraphQL \u0646\u0645\u0648\u0646\u0647\u200c\u0627\u06cc \u0639\u0627\u0644\u06cc \u0627\u0632 \u0686\u06cc\u0632\u06cc \u0627\u0633\u062a \u06a9\u0647 \u0645\u0646 \u062f\u0631 \u0630\u0647\u0646 \u062f\u0627\u0634\u062a\u0645\u060c \u0632\u06cc\u0631\u0627 \u0628\u0647 \u0645\u0635\u0631\u0641\u200c\u06a9\u0646\u0646\u062f\u06af\u0627\u0646 \u0627\u062c\u0627\u0632\u0647 \u0645\u06cc\u200c\u062f\u0647\u062f \u0641\u0648\u0631\u0627\u064b \u0628\u0647\u200c\u0631\u0648\u0632\u0631\u0633\u0627\u0646\u06cc\u200c\u0647\u0627 \u0631\u0627 \u062f\u0631\u06cc\u0627\u0641\u062a \u06a9\u0646\u0646\u062f\u060c \u0628\u062f\u0648\u0646 \u0627\u06cc\u0646\u06a9\u0647 \u0646\u06cc\u0627\u0632\u06cc \u0628\u0647 \u067e\u0631\u0633 \u0648 \u062c\u0648 \u062f\u0631 \u0645\u0648\u0631\u062f \u062f\u0627\u062f\u0647\u200c\u0647\u0627\u06cc \u0645\u0646\u0628\u0639 \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u0646\u062f. \u0627\u06cc\u0646 \u0628\u0627\u0639\u062b \u0645\u06cc\u200c\u0634\u0648\u062f \u0645\u0635\u0631\u0641\u200c\u06a9\u0646\u0646\u062f\u06af\u0627\u0646 \u062f\u0627\u062f\u0647\u200c\u0647\u0627\u06cc Customer 360 \u0628\u0633\u06cc\u0627\u0631 \u0647\u06cc\u062c\u0627\u0646\u200c\u0632\u062f\u0647 \u0634\u0648\u0646\u062f\u060c \u0632\u06cc\u0631\u0627 \u0645\u06cc\u200c\u062f\u0627\u0646\u0646\u062f \u06a9\u0647 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u0646\u062f \u0628\u0647\u200c\u0631\u0648\u0632\u0631\u0633\u0627\u0646\u06cc\u200c\u0647\u0627\u06cc \u0632\u0646\u062f\u0647 \u0631\u0627 \u062f\u0631 \u0647\u0645\u0627\u0646 \u0632\u0645\u0627\u0646 \u0627\u0646\u062c\u0627\u0645 \u062f\u0647\u0646\u062f.<\/p>\n<p>Heroku \u0646\u0645\u0648\u0646\u0647 \u062f\u06cc\u06af\u0631\u06cc \u0627\u0633\u062a \u06a9\u0647 \u0628\u0627 \u0627\u0631\u0627\u0626\u0647 \u067e\u0644\u062a\u0641\u0631\u0645\u06cc \u06a9\u0647 \u0628\u0647 \u0645\u0646 \u0627\u0645\u06a9\u0627\u0646 \u0645\u06cc\u200c\u062f\u0647\u062f \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u06cc\u06a9 CLI \u0648 \u062f\u0633\u062a\u0648\u0631\u0627\u062a \u0627\u0633\u062a\u0627\u0646\u062f\u0627\u0631\u062f Git \u0628\u0647 \u0633\u0631\u0639\u062a \u0631\u0627\u0647\u200c\u062d\u0644\u200c\u0647\u0627 \u0631\u0627 \u0646\u0645\u0648\u0646\u0647\u200c\u0633\u0627\u0632\u06cc \u06a9\u0646\u0645\u060c \u0628\u0647 \u0628\u06cc\u0627\u0646\u06cc\u0647 \u0645\u0627\u0645\u0648\u0631\u06cc\u062a \u0645\u0646 \u067e\u0627\u06cc\u0628\u0646\u062f \u0627\u0633\u062a. \u0627\u06cc\u0646 \u0646\u0647 \u062a\u0646\u0647\u0627 \u0628\u0647 \u0645\u0646 \u06cc\u06a9 \u0631\u0627\u0647 \u0622\u0633\u0627\u0646 \u0628\u0631\u0627\u06cc \u0646\u0645\u0627\u06cc\u0634 \u0645\u0648\u0627\u0631\u062f \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0627\u0634\u062a\u0631\u0627\u06a9\u200c\u0647\u0627\u06cc\u0645 \u0645\u06cc\u200c\u062f\u0647\u062f\u060c \u0628\u0644\u06a9\u0647 \u0628\u0631\u0627\u06cc \u067e\u06cc\u0627\u062f\u0647\u200c\u0633\u0627\u0632\u06cc \u06cc\u06a9 \u0645\u0635\u0631\u0641\u200c\u06a9\u0646\u0646\u062f\u0647 \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 WebSockets \u0646\u06cc\u0632.<\/p>\n<p>\u0627\u06af\u0631 \u0628\u0647 \u06a9\u062f \u0645\u0646\u0628\u0639 \u0627\u06cc\u0646 \u0645\u0642\u0627\u0644\u0647 \u0639\u0644\u0627\u0642\u0647 \u0645\u0646\u062f \u0647\u0633\u062a\u06cc\u062f\u060c \u0645\u062e\u0627\u0632\u0646 \u0645\u0646 \u062f\u0631 GitLab \u0631\u0627 \u0628\u0631\u0631\u0633\u06cc \u06a9\u0646\u06cc\u062f:<\/p>\n<p>\u0627\u0634\u062a\u0631\u0627\u06a9 graphql-server-customer<br \/>\nwebsocket-example<\/p>\n<p>\u0648\u0642\u062a\u06cc \u0645\u06cc \u06af\u0648\u06cc\u0645 \u0628\u0627 \u0627\u06cc\u0646 \u062a\u0644\u0627\u0634 \u0645\u0647\u0627\u0631\u062a \u0647\u0627\u06cc GraphQL \u062e\u0648\u062f \u0631\u0627 \u0628\u0627 \u0645\u0648\u0641\u0642\u06cc\u062a \u0627\u0631\u062a\u0642\u0627 \u062f\u0627\u062f\u0647 \u0627\u0645\u060c \u0627\u062d\u0633\u0627\u0633 \u0627\u0637\u0645\u06cc\u0646\u0627\u0646 \u0645\u06cc \u06a9\u0646\u0645. \u0627\u06cc\u0646 \u0633\u0641\u0631 \u0628\u0631\u0627\u06cc \u0645\u0646 \u062c\u062f\u06cc\u062f \u0648 \u0686\u0627\u0644\u0634 \u0628\u0631\u0627\u0646\u06af\u06cc\u0632 \u0628\u0648\u062f &#8230; \u0648 \u0647\u0645\u0686\u0646\u06cc\u0646 \u0628\u0633\u06cc\u0627\u0631 \u0633\u0631\u06af\u0631\u0645 \u06a9\u0646\u0646\u062f\u0647!<\/p>\n<p>\u0645\u0646 \u0642\u0635\u062f \u062f\u0627\u0631\u0645 \u062f\u0631 \u0645\u0631\u062d\u0644\u0647 \u0628\u0639\u062f\u06cc \u0628\u0647 \u0627\u062d\u0631\u0627\u0632 \u0647\u0648\u06cc\u062a \u0628\u067e\u0631\u062f\u0627\u0632\u0645\u060c \u06a9\u0647 \u0627\u0645\u06cc\u062f\u0648\u0627\u0631\u0645 \u0641\u0631\u0635\u062a \u062f\u06cc\u06af\u0631\u06cc \u0628\u0631\u0627\u06cc \u0627\u0631\u062a\u0642\u0627\u0621 \u0633\u0637\u062d \u0628\u0627 GraphQL \u0648 Apollo Server \u0641\u0631\u0627\u0647\u0645 \u06a9\u0646\u062f. \u0628\u0627 \u0645\u0627 \u0647\u0645\u0631\u0627\u0647 \u0628\u0627\u0634\u06cc\u062f!<\/p>\n<p>\u06cc\u06a9 \u0631\u0648\u0632 \u0648\u0627\u0642\u0639\u0627 \u0639\u0627\u0644\u06cc \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u06cc\u062f!<\/p>\n<p><\/p>\n<p>\u0686\u0646\u062f \u0633\u0627\u0644\u06cc \u0627\u0633\u062a \u06a9\u0647 \u0633\u0639\u06cc \u06a9\u0631\u062f\u0647\u200c\u0627\u0645 \u0686\u0627\u0631\u0686\u0648\u0628\u200c\u0647\u0627\u060c \u0645\u062d\u0635\u0648\u0644\u0627\u062a \u0648 \u062e\u062f\u0645\u0627\u062a\u06cc \u0631\u0627 \u0634\u0646\u0627\u0633\u0627\u06cc\u06cc \u06a9\u0646\u0645 \u06a9\u0647 \u0628\u0647 \u0641\u0646\u200c\u0622\u0648\u0631\u0627\u0646 \u0627\u062c\u0627\u0632\u0647 \u0645\u06cc\u200c\u062f\u0647\u062f \u062a\u0645\u0631\u06a9\u0632 \u062e\u0648\u062f \u0631\u0627 \u0628\u0631 \u06af\u0633\u062a\u0631\u0634 \u0627\u0631\u0632\u0634 \u0645\u0627\u0644\u06a9\u06cc\u062a \u0645\u0639\u0646\u0648\u06cc \u062e\u0648\u062f \u062d\u0641\u0638 \u06a9\u0646\u0646\u062f. \u0627\u06cc\u0646 \u0647\u0645\u0686\u0646\u0627\u0646 \u06cc\u06a9 \u0633\u0641\u0631 \u0641\u0648\u0642 \u0627\u0644\u0639\u0627\u062f\u0647 \u0628\u0631\u0627\u06cc \u0645\u0646 \u0627\u0633\u062a\u060c \u067e\u0631 \u0627\u0632 \u0641\u0631\u0635\u062a \u0647\u0627\u06cc \u06cc\u0627\u062f\u06af\u06cc\u0631\u06cc \u0645\u0646\u062d\u0635\u0631 \u0628\u0647 \u0641\u0631\u062f.<\/p>\n<p>\u0645\u0647\u0646\u062f\u0633 \u062f\u0631\u0648\u0646 \u0645\u0646 \u0627\u062e\u06cc\u0631\u0627\u064b \u0628\u0647 \u0627\u06cc\u0646 \u0641\u06a9\u0631 \u06a9\u0631\u062f \u06a9\u0647 \u0622\u06cc\u0627 \u0645\u0648\u0642\u0639\u06cc\u062a\u06cc \u0648\u062c\u0648\u062f \u062f\u0627\u0631\u062f \u06a9\u0647 \u0628\u062a\u0648\u0627\u0646\u0645 \u06cc\u06a9 \u0645\u0632\u06cc\u062a \u062b\u0627\u0646\u0648\u06cc\u0647 \u0628\u0631\u0627\u06cc \u06cc\u06a9 \u0645\u0641\u0647\u0648\u0645 \u0645\u0648\u062c\u0648\u062f \u067e\u06cc\u062f\u0627 \u06a9\u0646\u0645 \u06a9\u0647 \u0642\u0628\u0644\u0627\u064b \u062f\u0631 \u0645\u0648\u0631\u062f \u0622\u0646 \u0635\u062d\u0628\u062a \u06a9\u0631\u062f\u0647 \u0627\u0645. \u0628\u0647 \u0639\u0628\u0627\u0631\u062a \u062f\u06cc\u06af\u0631\u060c \u0622\u06cc\u0627 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u0645 \u0645\u0632\u06cc\u062a \u062f\u06cc\u06af\u0631\u06cc \u0631\u0627 \u0628\u0627 \u0647\u0645\u0627\u0646 \u0633\u0637\u062d \u062a\u0623\u062b\u06cc\u0631 \u0631\u0627\u0647\u200c\u062d\u0644 \u0627\u0635\u0644\u06cc \u06a9\u0647 \u0642\u0628\u0644\u0627\u064b \u0634\u0646\u0627\u0633\u0627\u06cc\u06cc \u0634\u062f\u0647 \u0628\u0648\u062f \u0634\u0646\u0627\u0633\u0627\u06cc\u06cc \u06a9\u0646\u0645\u061f<\/p>\n<p>\u0628\u0631\u0627\u06cc \u0627\u06cc\u0646 \u0645\u0642\u0627\u0644\u0647\u060c \u0645\u06cc\u200c\u062e\u0648\u0627\u0633\u062a\u0645 \u0639\u0645\u06cc\u0642\u200c\u062a\u0631 \u0628\u0647 GraphQL \u0628\u067e\u0631\u062f\u0627\u0632\u0645 \u062a\u0627 \u0628\u0628\u06cc\u0646\u0645 \u0686\u0647 \u0686\u06cc\u0632\u06cc \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u0645 \u067e\u06cc\u062f\u0627 \u06a9\u0646\u0645.<\/p>\n<p>\u062f\u0631 \u0645\u0642\u0627\u0644\u0647 \u062e\u0648\u062f \u0628\u0627 \u0639\u0646\u0648\u0627\u0646 \u00ab\u0648\u0642\u062a\u06cc \u0632\u0645\u0627\u0646 \u0627\u0633\u062a\u0631\u0627\u062d\u062a \u0627\u0633\u062a\u00bb\u060c \u062f\u0631 \u0645\u0648\u0631\u062f \u0627\u06cc\u0646\u06a9\u0647 \u0686\u06af\u0648\u0646\u0647 \u0633\u0646\u0627\u0631\u06cc\u0648\u0647\u0627\u06cc \u062f\u0646\u06cc\u0627\u06cc \u0648\u0627\u0642\u0639\u06cc \u0648\u062c\u0648\u062f \u062f\u0627\u0631\u062f \u06a9\u0647 GraphQL \u0628\u0647 \u06cc\u06a9 \u0633\u0631\u0648\u06cc\u0633 RESTful \u0627\u0631\u062c\u062d\u06cc\u062a \u062f\u0627\u0631\u062f\u060c \u0635\u062d\u0628\u062a \u06a9\u0631\u062f\u0645. \u0646\u062d\u0648\u0647 \u0633\u0627\u062e\u062a \u0648 \u0627\u0633\u062a\u0642\u0631\u0627\u0631 API GraphQL \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0633\u0631\u0648\u0631 \u0622\u067e\u0648\u0644\u0648 \u0631\u0627 \u0628\u0631\u0631\u0633\u06cc \u06a9\u0631\u062f\u06cc\u0645.<\/p>\n<p>\u062f\u0631 \u0627\u06cc\u0646 \u067e\u0633\u062a \u0628\u0639\u062f\u06cc\u060c \u0645\u0646 \u0642\u0635\u062f \u062f\u0627\u0631\u0645 \u062f\u0627\u0646\u0634 \u062e\u0648\u062f \u0631\u0627 \u062f\u0631 \u0645\u0648\u0631\u062f GraphQL \u0628\u0627 \u0642\u062f\u0645 \u0632\u062f\u0646 \u062f\u0631 \u0627\u0634\u062a\u0631\u0627\u06a9\u200c\u0647\u0627 \u0628\u0631\u0627\u06cc \u0628\u0627\u0632\u06cc\u0627\u0628\u06cc \u0627\u0637\u0644\u0627\u0639\u0627\u062a \u062f\u0631 \u0632\u0645\u0627\u0646 \u0648\u0627\u0642\u0639\u06cc \u0627\u0631\u062a\u0642\u0627 \u062f\u0647\u0645. \u0645\u0627 \u0647\u0645\u0686\u0646\u06cc\u0646 \u06cc\u06a9 \u0633\u0631\u0648\u06cc\u0633 WebSocket \u0628\u0631\u0627\u06cc \u0645\u0635\u0631\u0641 \u0627\u0634\u062a\u0631\u0627\u06a9 \u0647\u0627 \u0627\u06cc\u062c\u0627\u062f \u062e\u0648\u0627\u0647\u06cc\u0645 \u06a9\u0631\u062f.<\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_84 counter-hierarchy ez-toc-counter-rtl ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">\u0641\u0647\u0631\u0633\u062a \u0645\u0637\u0627\u0644\u0628<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/nabfollower.com\/blog\/leveling-up-my-graphql-skills-real-time-subscriptions-39m2\/#%D8%AE%D9%84%D8%A7%D8%B5%D9%87_Customer_360_Use_Case\" >\u062e\u0644\u0627\u0635\u0647: Customer 360 Use Case<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/nabfollower.com\/blog\/leveling-up-my-graphql-skills-real-time-subscriptions-39m2\/#%D8%A7%D9%87%D8%AF%D8%A7%D9%81_%D8%B3%D8%B7%D8%AD_%D8%A8%D8%A7%D9%84%D8%A7\" >\u0627\u0647\u062f\u0627\u0641 \u0633\u0637\u062d \u0628\u0627\u0644\u0627<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/nabfollower.com\/blog\/leveling-up-my-graphql-skills-real-time-subscriptions-39m2\/#%D8%A7%D8%B1%D8%AA%D9%82%D8%A7%D8%A1_%D8%B3%D8%B7%D8%AD_%D8%A8%D8%A7_%D8%A7%D8%B9%D8%AA%D8%A8%D8%A7%D8%B1_%D8%A7%D8%B4%D8%AA%D8%B1%D8%A7%DA%A9\" >\u0627\u0631\u062a\u0642\u0627\u0621 \u0633\u0637\u062d \u0628\u0627 \u0627\u0639\u062a\u0628\u0627\u0631 \u0627\u0634\u062a\u0631\u0627\u06a9<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/nabfollower.com\/blog\/leveling-up-my-graphql-skills-real-time-subscriptions-39m2\/#%D8%A8%D9%87_%D9%87%D8%B1%D9%88%DA%A9%D9%88_%D9%85%D8%B3%D8%AA%D9%82%D8%B1_%D8%B4%D9%88%DB%8C%D8%AF\" >\u0628\u0647 \u0647\u0631\u0648\u06a9\u0648 \u0645\u0633\u062a\u0642\u0631 \u0634\u0648\u06cc\u062f<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/nabfollower.com\/blog\/leveling-up-my-graphql-skills-real-time-subscriptions-39m2\/#%D8%A7%D8%B1%D8%AA%D9%82%D8%A7%D8%A1_%D8%B3%D8%B7%D8%AD_%D8%A8%D8%A7_WebSocket_Skillz\" >\u0627\u0631\u062a\u0642\u0627\u0621 \u0633\u0637\u062d \u0628\u0627 WebSocket Skillz<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/nabfollower.com\/blog\/leveling-up-my-graphql-skills-real-time-subscriptions-39m2\/#%D9%86%D8%AA%DB%8C%D8%AC%D9%87_%DA%AF%DB%8C%D8%B1%DB%8C\" >\u0646\u062a\u06cc\u062c\u0647 \u06af\u06cc\u0631\u06cc<\/a><\/li><\/ul><\/nav><\/div>\n<h2><span class=\"ez-toc-section\" id=\"%D8%AE%D9%84%D8%A7%D8%B5%D9%87_Customer_360_Use_Case\"><\/span>\n<p>  <strong>\u062e\u0644\u0627\u0635\u0647: Customer 360 Use Case<\/strong><br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0645\u0642\u0627\u0644\u0647 \u0642\u0628\u0644\u06cc \u0645\u0646 \u062d\u0648\u0644 \u06cc\u06a9 \u0645\u0648\u0631\u062f \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 Customer 360 \u0645\u062a\u0645\u0631\u06a9\u0632 \u0628\u0648\u062f \u06a9\u0647 \u062f\u0631 \u0622\u0646 \u0645\u0634\u062a\u0631\u06cc\u0627\u0646 \u06a9\u0633\u0628 \u0648 \u06a9\u0627\u0631 \u062e\u06cc\u0627\u0644\u06cc \u0645\u0646 \u0645\u062c\u0645\u0648\u0639\u0647 \u062f\u0627\u062f\u0647 \u0647\u0627\u06cc \u0632\u06cc\u0631 \u0631\u0627 \u0646\u06af\u0647\u062f\u0627\u0631\u06cc \u0645\u06cc \u06a9\u0646\u0646\u062f:<\/p>\n<ul>\n<li>\n<p>\u0627\u0637\u0644\u0627\u0639\u0627\u062a \u0645\u0634\u062a\u0631\u06cc<\/p>\n<\/li>\n<li>\n<p>\u0627\u0637\u0644\u0627\u0639\u0627\u062a \u0622\u062f\u0631\u0633<\/p>\n<\/li>\n<li>\n<p>\u0631\u0648\u0634 \u0647\u0627\u06cc \u062a\u0645\u0627\u0633<\/p>\n<\/li>\n<li>\n<p>\u0648\u06cc\u0698\u06af\u06cc \u0647\u0627\u06cc \u0627\u0639\u062a\u0628\u0627\u0631\u06cc<\/p>\n<\/li>\n<\/ul>\n<p>\u06cc\u06a9 \u067e\u06cc\u0631\u0648\u0632\u06cc \u0628\u0632\u0631\u06af \u062f\u0631 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 GraphQL \u0627\u06cc\u0646 \u0627\u0633\u062a \u06a9\u0647 \u06cc\u06a9 \u062f\u0631\u062e\u0648\u0627\u0633\u062a GraphQL \u0645\u06cc \u062a\u0648\u0627\u0646\u062f \u062a\u0645\u0627\u0645 \u062f\u0627\u062f\u0647 \u0647\u0627\u06cc \u0644\u0627\u0632\u0645 \u0628\u0631\u0627\u06cc \u062a\u0648\u06a9\u0646 \u0645\u0634\u062a\u0631\u06cc (\u0647\u0648\u06cc\u062a \u0645\u0646\u062d\u0635\u0631 \u0628\u0647 \u0641\u0631\u062f) \u0631\u0627 \u0628\u0627\u0632\u06cc\u0627\u0628\u06cc \u06a9\u0646\u062f.\n<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight graphql\"><code><span class=\"k\">type<\/span><span class=\"w\"> <\/span><span class=\"n\">Query<\/span><span class=\"w\"> <\/span><span class=\"p\">{<\/span><span class=\"w\">\n    <\/span><span class=\"n\">addresses<\/span><span class=\"p\">:<\/span><span class=\"w\"> <\/span><span class=\"p\">[<\/span><span class=\"n\">Address<\/span><span class=\"p\">]<\/span><span class=\"w\">\n    <\/span><span class=\"n\">address<\/span><span class=\"p\">(<\/span><span class=\"n\">customer_token<\/span><span class=\"p\">:<\/span><span class=\"w\"> <\/span><span class=\"nb\">String<\/span><span class=\"p\">):<\/span><span class=\"w\"> <\/span><span class=\"n\">Address<\/span><span class=\"w\">\n    <\/span><span class=\"n\">contacts<\/span><span class=\"p\">:<\/span><span class=\"w\"> <\/span><span class=\"p\">[<\/span><span class=\"n\">Contact<\/span><span class=\"p\">]<\/span><span class=\"w\">\n    <\/span><span class=\"n\">contact<\/span><span class=\"p\">(<\/span><span class=\"n\">customer_token<\/span><span class=\"p\">:<\/span><span class=\"w\"> <\/span><span class=\"nb\">String<\/span><span class=\"p\">):<\/span><span class=\"w\"> <\/span><span class=\"n\">Contact<\/span><span class=\"w\">\n    <\/span><span class=\"n\">customers<\/span><span class=\"p\">:<\/span><span class=\"w\"> <\/span><span class=\"p\">[<\/span><span class=\"n\">Customer<\/span><span class=\"p\">]<\/span><span class=\"w\">\n    <\/span><span class=\"n\">customer<\/span><span class=\"p\">(<\/span><span class=\"n\">token<\/span><span class=\"p\">:<\/span><span class=\"w\"> <\/span><span class=\"nb\">String<\/span><span class=\"p\">):<\/span><span class=\"w\"> <\/span><span class=\"n\">Customer<\/span><span class=\"w\">\n    <\/span><span class=\"n\">credits<\/span><span class=\"p\">:<\/span><span class=\"w\"> <\/span><span class=\"p\">[<\/span><span class=\"n\">Credit<\/span><span class=\"p\">]<\/span><span class=\"w\">\n    <\/span><span class=\"n\">credit<\/span><span class=\"p\">(<\/span><span class=\"n\">customer_token<\/span><span class=\"p\">:<\/span><span class=\"w\"> <\/span><span class=\"nb\">String<\/span><span class=\"p\">):<\/span><span class=\"w\"> <\/span><span class=\"n\">Credit<\/span><span class=\"w\">\n<\/span><span class=\"p\">}<\/span><span class=\"w\">\n<\/span><\/code><\/pre>\n<\/div>\n<p>\u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u06cc\u06a9 \u0631\u0648\u06cc\u06a9\u0631\u062f RESTful \u0628\u0631\u0627\u06cc \u0628\u0627\u0632\u06cc\u0627\u0628\u06cc \u0646\u0645\u0627\u06cc \u0648\u0627\u062d\u062f (360) \u0645\u0634\u062a\u0631\u06cc \u0646\u06cc\u0627\u0632 \u0628\u0647 \u0686\u0646\u062f\u06cc\u0646 \u062f\u0631\u062e\u0648\u0627\u0633\u062a \u0648 \u067e\u0627\u0633\u062e \u062f\u0627\u0631\u062f. GraphQL \u0631\u0627\u0647 \u062d\u0644\u06cc \u0628\u0647 \u0645\u0627 \u0645\u06cc \u062f\u0647\u062f \u06a9\u0647 \u0639\u0645\u0644\u06a9\u0631\u062f \u0628\u0633\u06cc\u0627\u0631 \u0628\u0647\u062a\u0631\u06cc \u062f\u0627\u0631\u062f.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D8%A7%D9%87%D8%AF%D8%A7%D9%81_%D8%B3%D8%B7%D8%AD_%D8%A8%D8%A7%D9%84%D8%A7\"><\/span>\n<p>  <strong>\u0627\u0647\u062f\u0627\u0641 \u0633\u0637\u062d \u0628\u0627\u0644\u0627<\/strong><br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0628\u0631\u0627\u06cc \u0627\u0631\u062a\u0642\u0627\u0621 \u0633\u0637\u062d \u062f\u0631 \u0647\u0631 \u062c\u0646\u0628\u0647 \u0627\u06cc \u0627\u0632 \u0632\u0646\u062f\u06af\u06cc\u060c \u0641\u0631\u062f \u0628\u0627\u06cc\u062f \u0628\u0647 \u0627\u0647\u062f\u0627\u0641 \u062c\u062f\u06cc\u062f\u06cc \u062f\u0633\u062a \u06cc\u0627\u0628\u062f. \u0628\u0631\u0627\u06cc \u0627\u0647\u062f\u0627\u0641 \u062e\u0648\u062f\u0645 \u062f\u0631 \u0627\u06cc\u0646\u062c\u0627\u060c \u0627\u06cc\u0646 \u0628\u0647 \u0627\u06cc\u0646 \u0645\u0639\u0646\u06cc \u0627\u0633\u062a:<\/p>\n<ul>\n<li>\n<p>\u062f\u0631\u06a9 \u0648 \u067e\u06cc\u0627\u062f\u0647 \u0633\u0627\u0632\u06cc \u0627\u0631\u0632\u0634 \u067e\u06cc\u0634\u0646\u0647\u0627\u062f\u06cc \u0627\u0634\u062a\u0631\u0627\u06a9 \u0647\u0627 \u062f\u0631 GraphQL.<\/p>\n<\/li>\n<li>\n<p>\u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u067e\u06cc\u0627\u062f\u0647 \u0633\u0627\u0632\u06cc WebSocket \u0628\u0631\u0627\u06cc \u0645\u0635\u0631\u0641 \u0627\u0634\u062a\u0631\u0627\u06a9 GraphQL.<\/p>\n<\/li>\n<\/ul>\n<p>\u0627\u06cc\u062f\u0647 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0627\u0634\u062a\u0631\u0627\u06a9\u200c\u0647\u0627 \u0628\u0631 \u0631\u0648\u06cc \u06a9\u0648\u0626\u0631\u06cc\u200c\u0647\u0627 \u0648 \u062c\u0647\u0634\u200c\u0647\u0627 \u062f\u0631 GraphQL \u0632\u0645\u0627\u0646\u06cc \u06a9\u0647 \u0634\u0631\u0627\u06cc\u0637 \u0632\u06cc\u0631 \u0628\u0631\u0622\u0648\u0631\u062f\u0647 \u0634\u0648\u062f\u060c \u0631\u0648\u0634 \u062a\u0631\u062c\u06cc\u062d\u06cc \u0627\u0633\u062a:<\/p>\n<ul>\n<li>\n<p>\u062a\u063a\u06cc\u06cc\u0631\u0627\u062a \u06a9\u0648\u0686\u06a9 \u0648 \u062a\u062f\u0631\u06cc\u062c\u06cc \u062f\u0631 \u0627\u062c\u0633\u0627\u0645 \u0628\u0632\u0631\u06af<\/p>\n<\/li>\n<li>\n<p>\u0628\u0647\u200c\u0631\u0648\u0632\u0631\u0633\u0627\u0646\u06cc\u200c\u0647\u0627\u06cc \u0628\u06cc\u200c\u062f\u0631\u0646\u06af \u0648 \u0628\u0627 \u062a\u0623\u062e\u06cc\u0631 \u06a9\u0645 (\u0645\u0627\u0646\u0646\u062f \u0628\u0631\u0646\u0627\u0645\u0647 \u0686\u062a)<\/p>\n<\/li>\n<\/ul>\n<p>\u0627\u06cc\u0646 \u0645\u0647\u0645 \u0627\u0633\u062a\u060c \u0632\u06cc\u0631\u0627 \u067e\u06cc\u0627\u062f\u0647\u200c\u0633\u0627\u0632\u06cc \u0627\u0634\u062a\u0631\u0627\u06a9\u200c\u0647\u0627 \u062f\u0631 GraphQL \u0628\u06cc\u200c\u0627\u0647\u0645\u06cc\u062a \u0646\u06cc\u0633\u062a. \u0646\u0647 \u062a\u0646\u0647\u0627 \u0633\u0631\u0648\u0631 \u0627\u0635\u0644\u06cc \u0646\u06cc\u0627\u0632 \u0628\u0647 \u0628\u0647 \u0631\u0648\u0632 \u0631\u0633\u0627\u0646\u06cc \u062f\u0627\u0631\u062f\u060c \u0628\u0644\u06a9\u0647 \u0628\u0631\u0646\u0627\u0645\u0647 \u0645\u0635\u0631\u0641 \u06a9\u0646\u0646\u062f\u0647 \u0646\u06cc\u0632 \u0646\u06cc\u0627\u0632 \u0628\u0647 \u0637\u0631\u0627\u062d\u06cc \u0645\u062c\u062f\u062f \u062f\u0627\u0631\u062f.<\/p>\n<p>\u062e\u0648\u0634\u0628\u062e\u062a\u0627\u0646\u0647\u060c \u0645\u0648\u0631\u062f\u06cc \u06a9\u0647 \u0645\u0627 \u0628\u0627 \u0646\u0645\u0648\u0646\u0647 \u0645\u0634\u062a\u0631\u06cc 360 \u062f\u0646\u0628\u0627\u0644 \u0645\u06cc \u06a9\u0646\u06cc\u0645\u060c \u0628\u0631\u0627\u06cc \u0627\u0634\u062a\u0631\u0627\u06a9 \u0647\u0627 \u0645\u0646\u0627\u0633\u0628 \u0627\u0633\u062a. \u0647\u0645\u0686\u0646\u06cc\u0646\u060c \u0645\u0627 \u06cc\u06a9 \u0631\u0648\u06cc\u06a9\u0631\u062f WebSocket \u0631\u0627 \u0628\u0631\u0627\u06cc \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0627\u06cc\u0646 \u0627\u0634\u062a\u0631\u0627\u06a9 \u0647\u0627 \u067e\u06cc\u0627\u062f\u0647 \u0633\u0627\u0632\u06cc \u062e\u0648\u0627\u0647\u06cc\u0645 \u06a9\u0631\u062f.<\/p>\n<p>\u0645\u0627\u0646\u0646\u062f \u0642\u0628\u0644\u060c \u0628\u0647 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0622\u067e\u0648\u0644\u0648 \u0627\u062f\u0627\u0645\u0647 \u062e\u0648\u0627\u0647\u0645 \u062f\u0627\u062f.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D8%A7%D8%B1%D8%AA%D9%82%D8%A7%D8%A1_%D8%B3%D8%B7%D8%AD_%D8%A8%D8%A7_%D8%A7%D8%B9%D8%AA%D8%A8%D8%A7%D8%B1_%D8%A7%D8%B4%D8%AA%D8%B1%D8%A7%DA%A9\"><\/span>\n<p>  <strong>\u0627\u0631\u062a\u0642\u0627\u0621 \u0633\u0637\u062d \u0628\u0627 \u0627\u0639\u062a\u0628\u0627\u0631 \u0627\u0634\u062a\u0631\u0627\u06a9<\/strong><br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0627\u0628\u062a\u062f\u0627 \u0628\u0627\u06cc\u062f \u06a9\u062a\u0627\u0628\u062e\u0627\u0646\u0647 \u0647\u0627\u06cc \u0644\u0627\u0632\u0645 \u0631\u0627 \u0628\u0631\u0627\u06cc \u067e\u0634\u062a\u06cc\u0628\u0627\u0646\u06cc \u0627\u0632 \u0627\u0634\u062a\u0631\u0627\u06a9 \u0628\u0627 \u0633\u0631\u0648\u0631 \u0622\u067e\u0648\u0644\u0648 GraphQL \u062e\u0648\u062f \u0646\u0635\u0628 \u06a9\u0646\u06cc\u0645:\n<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight shell\"><code>npm <span class=\"nb\">install <\/span>ws\nnpm <span class=\"nb\">install <\/span>graphql-ws @graphql-tools\/schema\nnpm <span class=\"nb\">install <\/span>graphql-subscriptions \n<\/code><\/pre>\n<\/div>\n<p>\u0628\u0627 \u0646\u0635\u0628 \u0622\u0646 \u0645\u0648\u0627\u0631\u062f\u060c \u0631\u0648\u06cc \u0628\u0647 \u0631\u0648\u0632 \u0631\u0633\u0627\u0646\u06cc \u0622\u0646 \u062a\u0645\u0631\u06a9\u0632 \u06a9\u0631\u062f\u0645 <code>index.ts<\/code> \u0627\u0632 \u0645\u062e\u0632\u0646 \u0627\u0635\u0644\u06cc \u0645\u0646 \u0628\u0631\u0627\u06cc \u06af\u0633\u062a\u0631\u0634 <code>typedefs<\/code> \u062b\u0627\u0628\u062a \u0628\u0627 \u0645\u0648\u0627\u0631\u062f \u0632\u06cc\u0631:\n<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight graphql\"><code><span class=\"k\">type<\/span><span class=\"w\"> <\/span><span class=\"n\">Subscription<\/span><span class=\"w\"> <\/span><span class=\"p\">{<\/span><span class=\"w\">\n    <\/span><span class=\"n\">creditUpdated<\/span><span class=\"p\">:<\/span><span class=\"w\"> <\/span><span class=\"n\">Credit<\/span><span class=\"w\">\n<\/span><span class=\"p\">}<\/span><span class=\"w\">\n<\/span><\/code><\/pre>\n<\/div>\n<p>\u0645\u0646 \u0647\u0645\u0686\u0646\u06cc\u0646 \u06cc\u06a9 \u062b\u0627\u0628\u062a \u0628\u0631\u0627\u06cc \u062e\u0627\u0646\u0647 \u062c\u062f\u06cc\u062f \u062a\u0627\u0633\u06cc\u0633 \u06a9\u0631\u062f\u0645 <code>PubSub<\/code> \u0646\u0645\u0648\u0646\u0647 \u0648 \u06cc\u06a9 \u0646\u0645\u0648\u0646\u0647 \u0627\u0634\u062a\u0631\u0627\u06a9 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0631\u062f\u06cc\u0645 \u06a9\u0647 \u0628\u0639\u062f\u0627\u064b \u0627\u0632 \u0622\u0646 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u062e\u0648\u0627\u0647\u06cc\u0645 \u06a9\u0631\u062f:\n<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight javascript\"><code><span class=\"kd\">const<\/span> <span class=\"nx\">pubsub<\/span> <span class=\"o\">=<\/span> <span class=\"k\">new<\/span> <span class=\"nc\">PubSub<\/span><span class=\"p\">();<\/span>\n\n<span class=\"nx\">pubsub<\/span><span class=\"p\">.<\/span><span class=\"nf\">publish<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">CREDIT_BALANCE_UPDATED<\/span><span class=\"dl\">'<\/span><span class=\"p\">,<\/span> <span class=\"p\">{<\/span>\n    <span class=\"na\">creditUpdated<\/span><span class=\"p\">:<\/span> <span class=\"p\">{<\/span>\n    <span class=\"p\">}<\/span>\n<span class=\"p\">});<\/span>\n<\/code><\/pre>\n<\/div>\n<p>\u0645\u0646 \u062d\u0644 \u06a9\u0646\u0646\u062f\u0647 \u0647\u0627\u06cc \u0645\u0648\u062c\u0648\u062f \u0631\u0627 \u067e\u0627\u06a9 \u06a9\u0631\u062f\u0645 \u0648 \u06cc\u06a9 \u062c\u062f\u06cc\u062f \u0627\u0636\u0627\u0641\u0647 \u06a9\u0631\u062f\u0645 <code>Subscription<\/code> \u0628\u0631\u0627\u06cc \u0627\u06cc\u0646 \u0645\u0648\u0631\u062f \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u062c\u062f\u06cc\u062f:\n<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight javascript\"><code><span class=\"kd\">const<\/span> <span class=\"nx\">resolvers<\/span> <span class=\"o\">=<\/span> <span class=\"p\">{<\/span>\n    <span class=\"na\">Query<\/span><span class=\"p\">:<\/span> <span class=\"p\">{<\/span>\n        <span class=\"na\">addresses<\/span><span class=\"p\">:<\/span> <span class=\"p\">()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nx\">addresses<\/span><span class=\"p\">,<\/span>\n        <span class=\"na\">address<\/span><span class=\"p\">:<\/span> <span class=\"p\">(<\/span><span class=\"nx\">parent<\/span><span class=\"p\">,<\/span> <span class=\"nx\">args<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n            <span class=\"kd\">const<\/span> <span class=\"nx\">customer_token<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">args<\/span><span class=\"p\">.<\/span><span class=\"nx\">customer_token<\/span><span class=\"p\">;<\/span>\n            <span class=\"k\">return<\/span> <span class=\"nx\">addresses<\/span><span class=\"p\">.<\/span><span class=\"nf\">find<\/span><span class=\"p\">(<\/span><span class=\"nx\">address<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nx\">address<\/span><span class=\"p\">.<\/span><span class=\"nx\">customer_token<\/span> <span class=\"o\">===<\/span> <span class=\"nx\">customer_token<\/span><span class=\"p\">);<\/span>\n        <span class=\"p\">},<\/span>\n        <span class=\"na\">contacts<\/span><span class=\"p\">:<\/span> <span class=\"p\">()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nx\">contacts<\/span><span class=\"p\">,<\/span>\n        <span class=\"na\">contact<\/span><span class=\"p\">:<\/span> <span class=\"p\">(<\/span><span class=\"nx\">parent<\/span><span class=\"p\">,<\/span> <span class=\"nx\">args<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n            <span class=\"kd\">const<\/span> <span class=\"nx\">customer_token<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">args<\/span><span class=\"p\">.<\/span><span class=\"nx\">customer_token<\/span><span class=\"p\">;<\/span>\n            <span class=\"k\">return<\/span> <span class=\"nx\">contacts<\/span><span class=\"p\">.<\/span><span class=\"nf\">find<\/span><span class=\"p\">(<\/span><span class=\"nx\">contact<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nx\">contact<\/span><span class=\"p\">.<\/span><span class=\"nx\">customer_token<\/span> <span class=\"o\">===<\/span> <span class=\"nx\">customer_token<\/span><span class=\"p\">);<\/span>\n        <span class=\"p\">},<\/span>\n        <span class=\"na\">customers<\/span><span class=\"p\">:<\/span> <span class=\"p\">()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nx\">customers<\/span><span class=\"p\">,<\/span>\n        <span class=\"na\">customer<\/span><span class=\"p\">:<\/span> <span class=\"p\">(<\/span><span class=\"nx\">parent<\/span><span class=\"p\">,<\/span> <span class=\"nx\">args<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n            <span class=\"kd\">const<\/span> <span class=\"nx\">token<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">args<\/span><span class=\"p\">.<\/span><span class=\"nx\">token<\/span><span class=\"p\">;<\/span>\n            <span class=\"k\">return<\/span> <span class=\"nx\">customers<\/span><span class=\"p\">.<\/span><span class=\"nf\">find<\/span><span class=\"p\">(<\/span><span class=\"nx\">customer<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nx\">customer<\/span><span class=\"p\">.<\/span><span class=\"nx\">token<\/span> <span class=\"o\">===<\/span> <span class=\"nx\">token<\/span><span class=\"p\">);<\/span>\n        <span class=\"p\">},<\/span>\n        <span class=\"na\">credits<\/span><span class=\"p\">:<\/span> <span class=\"p\">()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nx\">credits<\/span><span class=\"p\">,<\/span>\n        <span class=\"na\">credit<\/span><span class=\"p\">:<\/span> <span class=\"p\">(<\/span><span class=\"nx\">parent<\/span><span class=\"p\">,<\/span> <span class=\"nx\">args<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n            <span class=\"kd\">const<\/span> <span class=\"nx\">customer_token<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">args<\/span><span class=\"p\">.<\/span><span class=\"nx\">customer_token<\/span><span class=\"p\">;<\/span>\n            <span class=\"k\">return<\/span> <span class=\"nx\">credits<\/span><span class=\"p\">.<\/span><span class=\"nf\">find<\/span><span class=\"p\">(<\/span><span class=\"nx\">credit<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nx\">credit<\/span><span class=\"p\">.<\/span><span class=\"nx\">customer_token<\/span> <span class=\"o\">===<\/span> <span class=\"nx\">customer_token<\/span><span class=\"p\">);<\/span>\n        <span class=\"p\">}<\/span>\n    <span class=\"p\">},<\/span>\n    <span class=\"na\">Subscription<\/span><span class=\"p\">:<\/span> <span class=\"p\">{<\/span>\n        <span class=\"na\">creditUpdated<\/span><span class=\"p\">:<\/span> <span class=\"p\">{<\/span>\n            <span class=\"na\">subscribe<\/span><span class=\"p\">:<\/span> <span class=\"p\">()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nx\">pubsub<\/span><span class=\"p\">.<\/span><span class=\"nf\">asyncIterator<\/span><span class=\"p\">([<\/span><span class=\"dl\">'<\/span><span class=\"s1\">CREDIT_BALANCE_UPDATED<\/span><span class=\"dl\">'<\/span><span class=\"p\">]),<\/span>\n        <span class=\"p\">}<\/span>\n    <span class=\"p\">}<\/span>\n<span class=\"p\">};<\/span>\n<\/code><\/pre>\n<\/div>\n<p>\u0633\u067e\u0633 \u067e\u06cc\u06a9\u0631\u0628\u0646\u062f\u06cc \u0633\u0631\u0648\u0631 \u0631\u0627 \u0628\u0627\u0632\u0633\u0627\u0632\u06cc \u06a9\u0631\u062f\u0645 \u0648 \u0637\u0631\u062d \u0627\u0634\u062a\u0631\u0627\u06a9 \u0631\u0627 \u0645\u0639\u0631\u0641\u06cc \u06a9\u0631\u062f\u0645:\n<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight javascript\"><code><span class=\"kd\">const<\/span> <span class=\"nx\">app<\/span> <span class=\"o\">=<\/span> <span class=\"nf\">express<\/span><span class=\"p\">();<\/span>\n<span class=\"kd\">const<\/span> <span class=\"nx\">httpServer<\/span> <span class=\"o\">=<\/span> <span class=\"nf\">createServer<\/span><span class=\"p\">(<\/span><span class=\"nx\">app<\/span><span class=\"p\">);<\/span>\n<span class=\"kd\">const<\/span> <span class=\"nx\">wsServer<\/span> <span class=\"o\">=<\/span> <span class=\"k\">new<\/span> <span class=\"nc\">WebSocketServer<\/span><span class=\"p\">({<\/span>\n    <span class=\"na\">server<\/span><span class=\"p\">:<\/span> <span class=\"nx\">httpServer<\/span><span class=\"p\">,<\/span>\n    <span class=\"na\">path<\/span><span class=\"p\">:<\/span> <span class=\"dl\">'<\/span><span class=\"s1\">\/graphql<\/span><span class=\"dl\">'<\/span>\n<span class=\"p\">});<\/span>\n\n<span class=\"kd\">const<\/span> <span class=\"nx\">schema<\/span> <span class=\"o\">=<\/span> <span class=\"nf\">makeExecutableSchema<\/span><span class=\"p\">({<\/span> <span class=\"nx\">typeDefs<\/span><span class=\"p\">,<\/span> <span class=\"nx\">resolvers<\/span> <span class=\"p\">});<\/span>\n<span class=\"kd\">const<\/span> <span class=\"nx\">serverCleanup<\/span> <span class=\"o\">=<\/span> <span class=\"nf\">useServer<\/span><span class=\"p\">({<\/span> <span class=\"nx\">schema<\/span> <span class=\"p\">},<\/span> <span class=\"nx\">wsServer<\/span><span class=\"p\">);<\/span>\n\n<span class=\"kd\">const<\/span> <span class=\"nx\">server<\/span> <span class=\"o\">=<\/span> <span class=\"k\">new<\/span> <span class=\"nc\">ApolloServer<\/span><span class=\"p\">({<\/span>\n    <span class=\"nx\">schema<\/span><span class=\"p\">,<\/span>\n    <span class=\"na\">plugins<\/span><span class=\"p\">:<\/span> <span class=\"p\">[<\/span>\n        <span class=\"nc\">ApolloServerPluginDrainHttpServer<\/span><span class=\"p\">({<\/span> <span class=\"nx\">httpServer<\/span> <span class=\"p\">}),<\/span>\n        <span class=\"p\">{<\/span>\n            <span class=\"k\">async<\/span> <span class=\"nf\">serverWillStart<\/span><span class=\"p\">()<\/span> <span class=\"p\">{<\/span>\n                <span class=\"k\">return<\/span> <span class=\"p\">{<\/span>\n                    <span class=\"k\">async<\/span> <span class=\"nf\">drainServer<\/span><span class=\"p\">()<\/span> <span class=\"p\">{<\/span>\n                        <span class=\"nx\">serverCleanup<\/span><span class=\"p\">.<\/span><span class=\"nf\">dispose<\/span><span class=\"p\">();<\/span>\n                    <span class=\"p\">}<\/span>\n                <span class=\"p\">};<\/span>\n            <span class=\"p\">}<\/span>\n        <span class=\"p\">}<\/span>\n    <span class=\"p\">],<\/span>\n<span class=\"p\">});<\/span>\n\n<span class=\"k\">await<\/span> <span class=\"nx\">server<\/span><span class=\"p\">.<\/span><span class=\"nf\">start<\/span><span class=\"p\">();<\/span>\n\n<span class=\"nx\">app<\/span><span class=\"p\">.<\/span><span class=\"nf\">use<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">\/graphql<\/span><span class=\"dl\">'<\/span><span class=\"p\">,<\/span> <span class=\"nf\">cors<\/span><span class=\"p\">(),<\/span> <span class=\"nx\">express<\/span><span class=\"p\">.<\/span><span class=\"nf\">json<\/span><span class=\"p\">(),<\/span> <span class=\"nf\">expressMiddleware<\/span><span class=\"p\">(<\/span><span class=\"nx\">server<\/span><span class=\"p\">,<\/span> <span class=\"p\">{<\/span>\n    <span class=\"na\">context<\/span><span class=\"p\">:<\/span> <span class=\"k\">async <\/span><span class=\"p\">()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">({<\/span> <span class=\"nx\">pubsub<\/span> <span class=\"p\">})<\/span>\n<span class=\"p\">}));<\/span>\n\n<span class=\"kd\">const<\/span> <span class=\"nx\">PORT<\/span> <span class=\"o\">=<\/span> <span class=\"nb\">Number<\/span><span class=\"p\">.<\/span><span class=\"nf\">parseInt<\/span><span class=\"p\">(<\/span><span class=\"nx\">process<\/span><span class=\"p\">.<\/span><span class=\"nx\">env<\/span><span class=\"p\">.<\/span><span class=\"nx\">PORT<\/span><span class=\"p\">)<\/span> <span class=\"o\">||<\/span> <span class=\"mi\">4000<\/span><span class=\"p\">;<\/span>\n<span class=\"nx\">httpServer<\/span><span class=\"p\">.<\/span><span class=\"nf\">listen<\/span><span class=\"p\">(<\/span><span class=\"nx\">PORT<\/span><span class=\"p\">,<\/span> <span class=\"p\">()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n    <span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nf\">log<\/span><span class=\"p\">(<\/span><span class=\"s2\">`Server is now running on http:\/\/localhost:<\/span><span class=\"p\">${<\/span><span class=\"nx\">PORT<\/span><span class=\"p\">}<\/span><span class=\"s2\">\/graphql`<\/span><span class=\"p\">);<\/span>\n    <span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nf\">log<\/span><span class=\"p\">(<\/span><span class=\"s2\">`Subscription is now running on ws:\/\/localhost:<\/span><span class=\"p\">${<\/span><span class=\"nx\">PORT<\/span><span class=\"p\">}<\/span><span class=\"s2\">\/graphql`<\/span><span class=\"p\">);<\/span>\n<span class=\"p\">});<\/span>\n<\/code><\/pre>\n<\/div>\n<p>\u0628\u0631\u0627\u06cc \u0634\u0628\u06cc\u0647\u200c\u0633\u0627\u0632\u06cc \u0628\u0647\u200c\u0631\u0648\u0632\u0631\u0633\u0627\u0646\u06cc\u200c\u0647\u0627\u06cc \u0645\u0628\u062a\u0646\u06cc \u0628\u0631 \u0645\u0634\u062a\u0631\u06cc\u060c \u0631\u0648\u0634 \u0632\u06cc\u0631 \u0631\u0627 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0631\u062f\u0645 \u062a\u0627 \u0645\u0648\u062c\u0648\u062f\u06cc \u0627\u0639\u062a\u0628\u0627\u0631 \u0631\u0627 \u0647\u0631 \u067e\u0646\u062c \u062b\u0627\u0646\u06cc\u0647 \u0628\u0647 \u0645\u06cc\u0632\u0627\u0646 50 \u062f\u0644\u0627\u0631 \u0627\u0641\u0632\u0627\u06cc\u0634 \u062f\u0647\u0645 \u062f\u0631 \u062d\u0627\u0644\u06cc \u06a9\u0647 \u0633\u0631\u0648\u06cc\u0633 \u062f\u0631 \u062d\u0627\u0644 \u0627\u062c\u0631\u0627 \u0627\u0633\u062a. \u0647\u0646\u06af\u0627\u0645\u06cc \u06a9\u0647 \u0645\u0648\u062c\u0648\u062f\u06cc \u0628\u0647 \u0633\u0642\u0641 \u0627\u0639\u062a\u0628\u0627\u0631\u06cc 10000 \u062f\u0644\u0627\u0631 \u0631\u0633\u06cc\u062f (\u06cc\u0627 \u0627\u0632 \u0622\u0646 \u0641\u0631\u0627\u062a\u0631 \u0631\u0641\u062a\u060c \u0645\u0648\u062c\u0648\u062f\u06cc \u0631\u0627 \u0628\u0647 2500 \u062f\u0644\u0627\u0631 \u0628\u0627\u0632\u0646\u0634\u0627\u0646\u06cc \u06a9\u0631\u062f\u0645 \u0648 \u067e\u0631\u062f\u0627\u062e\u062a \u0645\u0648\u062c\u0648\u062f\u06cc \u0631\u0627 \u0634\u0628\u06cc\u0647 \u0633\u0627\u0632\u06cc \u06a9\u0631\u062f\u0645.\n<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight javascript\"><code><span class=\"kd\">function<\/span> <span class=\"nf\">incrementCreditBalance<\/span><span class=\"p\">()<\/span> <span class=\"p\">{<\/span>\n    <span class=\"k\">if <\/span><span class=\"p\">(<\/span><span class=\"nx\">credits<\/span><span class=\"p\">[<\/span><span class=\"mi\">0<\/span><span class=\"p\">].<\/span><span class=\"nx\">balance<\/span> <span class=\"o\">&gt;=<\/span> <span class=\"nx\">credits<\/span><span class=\"p\">[<\/span><span class=\"mi\">0<\/span><span class=\"p\">].<\/span><span class=\"nx\">credit_limit<\/span><span class=\"p\">)<\/span> <span class=\"p\">{<\/span>\n        <span class=\"nx\">credits<\/span><span class=\"p\">[<\/span><span class=\"mi\">0<\/span><span class=\"p\">].<\/span><span class=\"nx\">balance<\/span> <span class=\"o\">=<\/span> <span class=\"mf\">0.00<\/span><span class=\"p\">;<\/span>\n        <span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nf\">log<\/span><span class=\"p\">(<\/span><span class=\"s2\">`Credit balance reset to <\/span><span class=\"p\">${<\/span><span class=\"nx\">credits<\/span><span class=\"p\">[<\/span><span class=\"mi\">0<\/span><span class=\"p\">].<\/span><span class=\"nx\">balance<\/span><span class=\"p\">}<\/span><span class=\"s2\">`<\/span><span class=\"p\">);<\/span>\n\n    <span class=\"p\">}<\/span> <span class=\"k\">else<\/span> <span class=\"p\">{<\/span>\n        <span class=\"nx\">credits<\/span><span class=\"p\">[<\/span><span class=\"mi\">0<\/span><span class=\"p\">].<\/span><span class=\"nx\">balance<\/span> <span class=\"o\">+=<\/span> <span class=\"mf\">50.00<\/span><span class=\"p\">;<\/span>\n        <span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nf\">log<\/span><span class=\"p\">(<\/span><span class=\"s2\">`Credit balance updated to <\/span><span class=\"p\">${<\/span><span class=\"nx\">credits<\/span><span class=\"p\">[<\/span><span class=\"mi\">0<\/span><span class=\"p\">].<\/span><span class=\"nx\">balance<\/span><span class=\"p\">}<\/span><span class=\"s2\">`<\/span><span class=\"p\">);<\/span>\n    <span class=\"p\">}<\/span>\n\n    <span class=\"nx\">pubsub<\/span><span class=\"p\">.<\/span><span class=\"nf\">publish<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">CREDIT_BALANCE_UPDATED<\/span><span class=\"dl\">'<\/span><span class=\"p\">,<\/span> <span class=\"p\">{<\/span> <span class=\"na\">creditUpdated<\/span><span class=\"p\">:<\/span> <span class=\"nx\">credits<\/span><span class=\"p\">[<\/span><span class=\"mi\">0<\/span><span class=\"p\">]<\/span> <span class=\"p\">});<\/span>\n    <span class=\"nf\">setTimeout<\/span><span class=\"p\">(<\/span><span class=\"nx\">incrementCreditBalance<\/span><span class=\"p\">,<\/span> <span class=\"mi\">5000<\/span><span class=\"p\">);<\/span>\n<span class=\"p\">}<\/span>\n\n<span class=\"nf\">incrementCreditBalance<\/span><span class=\"p\">();<\/span>\n<\/code><\/pre>\n<\/div>\n<p>\u06a9\u0627\u0645\u0644 <code>index.ts<\/code> \u0641\u0627\u06cc\u0644 \u0631\u0627 \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u062f \u062f\u0631 \u0627\u06cc\u0646\u062c\u0627 \u067e\u06cc\u062f\u0627 \u06a9\u0646\u06cc\u062f.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D8%A8%D9%87_%D9%87%D8%B1%D9%88%DA%A9%D9%88_%D9%85%D8%B3%D8%AA%D9%82%D8%B1_%D8%B4%D9%88%DB%8C%D8%AF\"><\/span>\n<p>  <strong>\u0628\u0647 \u0647\u0631\u0648\u06a9\u0648 \u0645\u0633\u062a\u0642\u0631 \u0634\u0648\u06cc\u062f<\/strong><br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0628\u0627 \u0622\u0645\u0627\u062f\u0647 \u0628\u0648\u062f\u0646 \u0633\u0631\u0648\u06cc\u0633\u060c \u0632\u0645\u0627\u0646 \u0622\u0646 \u0641\u0631\u0627 \u0631\u0633\u06cc\u062f\u0647 \u0627\u0633\u062a \u06a9\u0647 \u0633\u0631\u0648\u06cc\u0633 \u0631\u0627 \u0645\u0633\u062a\u0642\u0631 \u06a9\u0646\u06cc\u0645 \u062a\u0627 \u0628\u062a\u0648\u0627\u0646\u06cc\u0645 \u0628\u0627 \u0622\u0646 \u062a\u0639\u0627\u0645\u0644 \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u06cc\u0645. \u0627\u0632 \u0622\u0646\u062c\u0627\u06cc\u06cc \u06a9\u0647 Heroku \u062f\u0641\u0639\u0647 \u0642\u0628\u0644 \u0639\u0627\u0644\u06cc \u0639\u0645\u0644 \u06a9\u0631\u062f (\u0648 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0622\u0646 \u0628\u0631\u0627\u06cc \u0645\u0646 \u0622\u0633\u0627\u0646 \u0627\u0633\u062a)\u060c \u0628\u06cc\u0627\u06cc\u06cc\u062f \u0628\u0647 \u0627\u06cc\u0646 \u0631\u0648\u06cc\u06a9\u0631\u062f \u0628\u0645\u0627\u0646\u06cc\u0645.<\/p>\n<p>\u0628\u0631\u0627\u06cc \u0634\u0631\u0648\u0639\u060c \u0645\u0646 \u0628\u0627\u06cc\u062f \u062f\u0633\u062a\u0648\u0631\u0627\u062a Heroku CLI \u0632\u06cc\u0631 \u0631\u0627 \u0627\u062c\u0631\u0627 \u06a9\u0646\u0645:\n<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight shell\"><code><span class=\"nv\">$ <\/span>heroku login\n<span class=\"nv\">$ <\/span>heroku create jvc-graphql-server-sub\n\nCreating \u2b22 jvc-graphql-server-sub... <span class=\"k\">done\n<\/span>https:\/\/jvc-graphql-server-sub-1ec2e6406a82.herokuapp.com\/ | https:\/\/git.heroku.com\/jvc-graphql-server-sub.git\n<\/code><\/pre>\n<\/div>\n<p>\u0627\u06cc\u0646 \u062f\u0633\u062a\u0648\u0631 \u0647\u0645\u0686\u0646\u06cc\u0646 \u0628\u0647 \u0637\u0648\u0631 \u062e\u0648\u062f\u06a9\u0627\u0631 \u0645\u062e\u0632\u0646 \u0645\u0648\u0631\u062f \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u062a\u0648\u0633\u0637 Heroku \u0631\u0627 \u0628\u0647 \u0639\u0646\u0648\u0627\u0646 \u06cc\u06a9 \u06a9\u0646\u062a\u0631\u0644 \u0627\u0632 \u0631\u0627\u0647 \u062f\u0648\u0631 \u0627\u0636\u0627\u0641\u0647 \u0645\u06cc \u06a9\u0646\u062f:\n<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight shell\"><code><span class=\"nv\">$ <\/span>git remote\nheroku\norigin\n<\/code><\/pre>\n<\/div>\n<p>\u0647\u0645\u0627\u0646\u0637\u0648\u0631 \u06a9\u0647 \u062f\u0631 \u0645\u0642\u0627\u0644\u0647 \u0642\u0628\u0644\u06cc \u062e\u0648\u062f \u0627\u0634\u0627\u0631\u0647 \u06a9\u0631\u062f\u0645\u060c \u0622\u067e\u0648\u0644\u0648 \u0633\u0631\u0648\u0631 \u0622\u067e\u0648\u0644\u0648 \u0627\u06a9\u0633\u067e\u0644\u0648\u0631\u0631 \u0631\u0627 \u062f\u0631 \u0645\u062d\u06cc\u0637 \u0647\u0627\u06cc \u062a\u0648\u0644\u06cc\u062f \u063a\u06cc\u0631\u0641\u0639\u0627\u0644 \u0645\u06cc \u06a9\u0646\u062f. \u0628\u0631\u0627\u06cc \u0627\u06cc\u0646\u06a9\u0647 \u0622\u067e\u0648\u0644\u0648 \u0627\u06a9\u0633\u067e\u0644\u0648\u0631\u0631 \u0631\u0627 \u0628\u0631\u0627\u06cc \u0646\u06cc\u0627\u0632\u0647\u0627\u06cc\u0645\u0627\u0646 \u062f\u0631 \u062f\u0633\u062a\u0631\u0633 \u0646\u06af\u0647 \u062f\u0627\u0631\u0645\u060c \u0628\u0627\u06cc\u062f \u0622\u0646 \u0631\u0627 \u062a\u0646\u0638\u06cc\u0645 \u06a9\u0646\u0645 <code>NODE_ENV<\/code> \u0645\u062a\u063a\u06cc\u0631 \u0645\u062d\u06cc\u0637\u06cc \u0628\u0631\u0627\u06cc \u062a\u0648\u0633\u0639\u0647 \u0645\u0646 \u0622\u0646 \u0631\u0627 \u0628\u0627 \u062f\u0633\u062a\u0648\u0631 CLI \u0632\u06cc\u0631 \u062a\u0646\u0638\u06cc\u0645 \u06a9\u0631\u062f\u0645:\n<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight shell\"><code><span class=\"nv\">$ <\/span>heroku config:set <span class=\"nv\">NODE_ENV<\/span><span class=\"o\">=<\/span>development\n\nSetting NODE_ENV and restarting \u2b22 jvc-graphql-server-sub... <span class=\"k\">done<\/span>, v3\nNODE_ENV: development\n<\/code><\/pre>\n<\/div>\n<p>\u0645\u0646 \u0622\u0645\u0627\u062f\u0647 \u0628\u0648\u062f\u0645 \u062a\u0627 \u06a9\u062f \u062e\u0648\u062f \u0631\u0627 \u062f\u0631 Heroku \u0645\u0633\u062a\u0642\u0631 \u06a9\u0646\u0645:\n<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight shell\"><code><span class=\"nv\">$ <\/span>git commit <span class=\"nt\">--allow-empty<\/span> <span class=\"nt\">-m<\/span> <span class=\"s1\">'Deploy to Heroku'<\/span>\n<span class=\"nv\">$ <\/span>git push heroku\n<\/code><\/pre>\n<\/div>\n<p>\u06cc\u06a9 \u0646\u0645\u0627\u06cc \u0633\u0631\u06cc\u0639 \u0627\u0632 \u062f\u0627\u0634\u0628\u0648\u0631\u062f Heroku \u0646\u0634\u0627\u0646 \u062f\u0627\u062f \u06a9\u0647 \u0633\u0631\u0648\u0631 \u0622\u067e\u0648\u0644\u0648 \u0645\u0646 \u0628\u062f\u0648\u0646 \u0647\u06cc\u0686 \u0645\u0634\u06a9\u0644\u06cc \u062f\u0631 \u062d\u0627\u0644 \u0627\u062c\u0631\u0627 \u0627\u0633\u062a:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/media.dev.to\/cdn-cgi\/image\/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto\/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fr46m5w1vbpsauxapbrfw.png\" alt=\"\u062a\u0635\u0648\u06cc\u0631 1\" width=\"800\" height=\"441\" title=\"\"><\/p>\n<p>\u062f\u0631 \u0628\u062e\u0634 \u062a\u0646\u0638\u06cc\u0645\u0627\u062a\u060c URL \u0628\u0631\u0646\u0627\u0645\u0647 Heroku \u0631\u0627 \u0628\u0631\u0627\u06cc \u0627\u06cc\u0646 \u0646\u0645\u0648\u0646\u0647 \u0633\u0631\u0648\u06cc\u0633 \u067e\u06cc\u062f\u0627 \u06a9\u0631\u062f\u0645:<\/p>\n<p><code>https:\/\/jvc-graphql-server-sub-1ec2e6406a82.herokuapp.com\/<\/code><\/p>\n<p><em>\u0644\u0637\u0641\u0627\u064b \u062a\u0648\u062c\u0647 \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u06cc\u062f &#8211; \u0627\u06cc\u0646 \u067e\u06cc\u0648\u0646\u062f \u062a\u0627 \u0632\u0645\u0627\u0646 \u0627\u0646\u062a\u0634\u0627\u0631 \u0627\u06cc\u0646 \u0645\u0642\u0627\u0644\u0647 \u062f\u06cc\u06af\u0631 \u062f\u0631 \u062e\u062f\u0645\u062a \u0646\u062e\u0648\u0627\u0647\u062f \u0628\u0648\u062f.<\/em><\/p>\n<p>\u0641\u0639\u0644\u0627\u064b \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u0645 graphql \u0631\u0627 \u0628\u0647 \u0627\u06cc\u0646 URL \u0627\u0636\u0627\u0641\u0647 \u06a9\u0646\u0645 \u062a\u0627 Apollo Server Studio \u0631\u0627 \u0631\u0627\u0647\u200c\u0627\u0646\u062f\u0627\u0632\u06cc \u06a9\u0646\u0645. \u0627\u06cc\u0646 \u0628\u0647 \u0645\u0646 \u0627\u062c\u0627\u0632\u0647 \u0645\u06cc \u062f\u0647\u062f \u062a\u0627 \u0628\u0628\u06cc\u0646\u0645 \u0627\u0634\u062a\u0631\u0627\u06a9 \u0647\u0627 \u0647\u0645\u0627\u0646\u0637\u0648\u0631 \u06a9\u0647 \u0627\u0646\u062a\u0638\u0627\u0631 \u0645\u06cc \u0631\u0648\u062f \u06a9\u0627\u0631 \u0645\u06cc \u06a9\u0646\u0646\u062f:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/media.dev.to\/cdn-cgi\/image\/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto\/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F7hmhxro98nwmhpvq57jh.png\" alt=\"\u062a\u0635\u0648\u06cc\u0631 2\" width=\"800\" height=\"385\" title=\"\"><\/p>\n<p><em>\u0628\u0647 \u067e\u0627\u0633\u062e \u0647\u0627\u06cc \u0627\u0634\u062a\u0631\u0627\u06a9 \u062f\u0631 \u0627\u0646\u062f\u0627\u0632\u0647 \u0633\u0645\u062a \u0631\u0627\u0633\u062a \u0635\u0641\u062d\u0647 \u062a\u0648\u062c\u0647 \u06a9\u0646\u06cc\u062f.<\/em><\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D8%A7%D8%B1%D8%AA%D9%82%D8%A7%D8%A1_%D8%B3%D8%B7%D8%AD_%D8%A8%D8%A7_WebSocket_Skillz\"><\/span>\n<p>  <strong>\u0627\u0631\u062a\u0642\u0627\u0621 \u0633\u0637\u062d \u0628\u0627 WebSocket Skillz<\/strong><br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0645\u0627 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u0645 \u0627\u0632 \u067e\u0634\u062a\u06cc\u0628\u0627\u0646\u06cc WebSocket \u0648 \u0642\u0627\u0628\u0644\u06cc\u062a\u200c\u0647\u0627\u06cc Heroku \u0628\u0631\u0627\u06cc \u0627\u06cc\u062c\u0627\u062f \u067e\u06cc\u0627\u062f\u0647\u200c\u0633\u0627\u0632\u06cc \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u0645 \u06a9\u0647 \u0627\u0634\u062a\u0631\u0627\u06a9\u06cc \u0631\u0627 \u06a9\u0647 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0631\u062f\u0647\u200c\u0627\u06cc\u0645 \u0645\u0635\u0631\u0641 \u06a9\u0646\u062f.<\/p>\n<p>\u062f\u0631 \u0645\u0648\u0631\u062f \u0645\u0646\u060c \u0645\u0646 \u06cc\u06a9 \u0641\u0627\u06cc\u0644 index.js \u0628\u0627 \u0645\u062d\u062a\u0648\u06cc\u0627\u062a \u0632\u06cc\u0631 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0631\u062f\u0645. \u0627\u0633\u0627\u0633\u0627\u060c \u0627\u06cc\u0646 \u06cc\u06a9 \u0633\u0631\u0648\u06cc\u0633 \u06af\u06cc\u0631\u0646\u062f\u0647 WebSocket \u0627\u06cc\u062c\u0627\u062f \u06a9\u0631\u062f \u0648 \u0647\u0645\u0686\u0646\u06cc\u0646 \u06cc\u06a9 \u0633\u0631\u0648\u06cc\u0633 HTTP \u0633\u0627\u062e\u062a\u06af\u06cc \u0627\u06cc\u062c\u0627\u062f \u06a9\u0631\u062f \u06a9\u0647 \u0645\u06cc \u062a\u0648\u0627\u0646\u0633\u062a\u0645 \u0628\u0631\u0627\u06cc \u062a\u0623\u06cc\u06cc\u062f \u0627\u0639\u062a\u0628\u0627\u0631 \u06a9\u0644\u0627\u06cc\u0646\u062a \u062f\u0631 \u062d\u0627\u0644 \u0627\u062c\u0631\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u0645:\n<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight javascript\"><code><span class=\"k\">import<\/span> <span class=\"p\">{<\/span> <span class=\"nx\">createClient<\/span> <span class=\"p\">}<\/span> <span class=\"k\">from<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">graphql-ws<\/span><span class=\"dl\">\"<\/span><span class=\"p\">;<\/span>\n<span class=\"k\">import<\/span> <span class=\"p\">{<\/span> <span class=\"nx\">WebSocket<\/span> <span class=\"p\">}<\/span> <span class=\"k\">from<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">ws<\/span><span class=\"dl\">\"<\/span><span class=\"p\">;<\/span>\n<span class=\"k\">import<\/span> <span class=\"nx\">http<\/span> <span class=\"k\">from<\/span> <span class=\"dl\">\"<\/span><span class=\"s2\">http<\/span><span class=\"dl\">\"<\/span><span class=\"p\">;<\/span>\n\n<span class=\"c1\">\/\/ Create a dummy HTTP server to bind to Heroku's $PORT<\/span>\n<span class=\"kd\">const<\/span> <span class=\"nx\">PORT<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">process<\/span><span class=\"p\">.<\/span><span class=\"nx\">env<\/span><span class=\"p\">.<\/span><span class=\"nx\">PORT<\/span> <span class=\"o\">||<\/span> <span class=\"mi\">3000<\/span><span class=\"p\">;<\/span>\n<span class=\"nx\">http<\/span><span class=\"p\">.<\/span><span class=\"nf\">createServer<\/span><span class=\"p\">((<\/span><span class=\"nx\">req<\/span><span class=\"p\">,<\/span> <span class=\"nx\">res<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nx\">res<\/span><span class=\"p\">.<\/span><span class=\"nf\">end<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">Server is running<\/span><span class=\"dl\">'<\/span><span class=\"p\">)).<\/span><span class=\"nf\">listen<\/span><span class=\"p\">(<\/span><span class=\"nx\">PORT<\/span><span class=\"p\">,<\/span> <span class=\"p\">()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"p\">{<\/span>\n  <span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nf\">log<\/span><span class=\"p\">(<\/span><span class=\"s2\">`HTTP server running on port <\/span><span class=\"p\">${<\/span><span class=\"nx\">PORT<\/span><span class=\"p\">}<\/span><span class=\"s2\">`<\/span><span class=\"p\">);<\/span>\n<span class=\"p\">});<\/span>\n\n<span class=\"kd\">const<\/span> <span class=\"nx\">host_url<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">process<\/span><span class=\"p\">.<\/span><span class=\"nx\">env<\/span><span class=\"p\">.<\/span><span class=\"nx\">GRAPHQL_SUBSCRIPTION_HOST<\/span> <span class=\"o\">||<\/span> <span class=\"dl\">'<\/span><span class=\"s1\">ws:\/\/localhost:4000\/graphql<\/span><span class=\"dl\">'<\/span><span class=\"p\">;<\/span>\n\n<span class=\"kd\">const<\/span> <span class=\"nx\">client<\/span> <span class=\"o\">=<\/span> <span class=\"nf\">createClient<\/span><span class=\"p\">({<\/span>\n  <span class=\"na\">url<\/span><span class=\"p\">:<\/span> <span class=\"nx\">host_url<\/span><span class=\"p\">,<\/span>\n  <span class=\"na\">webSocketImpl<\/span><span class=\"p\">:<\/span> <span class=\"nx\">WebSocket<\/span>\n<span class=\"p\">});<\/span>\n\n<span class=\"kd\">const<\/span> <span class=\"nx\">query<\/span> <span class=\"o\">=<\/span> <span class=\"s2\">`subscription {\n  creditUpdated {\n    token\n    customer_token\n    credit_limit\n    balance\n    credit_score\n  }\n}`<\/span><span class=\"p\">;<\/span>\n\n<span class=\"kd\">function<\/span> <span class=\"nf\">handleCreditUpdated<\/span><span class=\"p\">(<\/span><span class=\"nx\">data<\/span><span class=\"p\">)<\/span> <span class=\"p\">{<\/span>\n  <span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nf\">log<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">Received credit update:<\/span><span class=\"dl\">'<\/span><span class=\"p\">,<\/span> <span class=\"nx\">data<\/span><span class=\"p\">);<\/span>\n<span class=\"p\">}<\/span>\n\n<span class=\"c1\">\/\/ Subscribe to the creditUpdated subscription<\/span>\n<span class=\"nx\">client<\/span><span class=\"p\">.<\/span><span class=\"nf\">subscribe<\/span><span class=\"p\">(<\/span>\n  <span class=\"p\">{<\/span>\n    <span class=\"nx\">query<\/span><span class=\"p\">,<\/span>\n  <span class=\"p\">},<\/span>\n  <span class=\"p\">{<\/span>\n    <span class=\"na\">next<\/span><span class=\"p\">:<\/span> <span class=\"p\">(<\/span><span class=\"nx\">data<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nf\">handleCreditUpdated<\/span><span class=\"p\">(<\/span><span class=\"nx\">data<\/span><span class=\"p\">.<\/span><span class=\"nx\">data<\/span><span class=\"p\">.<\/span><span class=\"nx\">creditUpdated<\/span><span class=\"p\">),<\/span>\n    <span class=\"na\">error<\/span><span class=\"p\">:<\/span> <span class=\"p\">(<\/span><span class=\"nx\">err<\/span><span class=\"p\">)<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nf\">error<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">Subscription error:<\/span><span class=\"dl\">'<\/span><span class=\"p\">,<\/span> <span class=\"nx\">err<\/span><span class=\"p\">),<\/span>\n    <span class=\"na\">complete<\/span><span class=\"p\">:<\/span> <span class=\"p\">()<\/span> <span class=\"o\">=&gt;<\/span> <span class=\"nx\">console<\/span><span class=\"p\">.<\/span><span class=\"nf\">log<\/span><span class=\"p\">(<\/span><span class=\"dl\">'<\/span><span class=\"s1\">Subscription complete<\/span><span class=\"dl\">'<\/span><span class=\"p\">),<\/span>\n  <span class=\"p\">}<\/span>\n<span class=\"p\">);<\/span>\n<\/code><\/pre>\n<\/div>\n<p>\u06a9\u0627\u0645\u0644 <code>index.js<\/code> \u0641\u0627\u06cc\u0644 \u0631\u0627 \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u062f \u062f\u0631 \u0627\u06cc\u0646\u062c\u0627 \u067e\u06cc\u062f\u0627 \u06a9\u0646\u06cc\u062f.<\/p>\n<p>\u0645\u0627 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u0645 \u0627\u06cc\u0646 \u0628\u0631\u0646\u0627\u0645\u0647 \u0633\u0627\u062f\u0647 Node.js \u0631\u0627 \u062f\u0631 Heroku \u0646\u06cc\u0632 \u0645\u0633\u062a\u0642\u0631 \u06a9\u0646\u06cc\u0645 \u0648 \u0645\u0637\u0645\u0626\u0646 \u0634\u0648\u06cc\u0645 \u06a9\u0647 \u0622\u0646 \u0631\u0627 \u062a\u0646\u0638\u06cc\u0645 \u06a9\u0631\u062f\u0647\u200c\u0627\u06cc\u0645 <code>GRAPHQL_SUBSCRIPTION_HOST<\/code> \u0645\u062a\u063a\u06cc\u0631 \u0645\u062d\u06cc\u0637\u06cc \u0628\u0647 URL \u0628\u0631\u0646\u0627\u0645\u0647 Heroku \u06a9\u0647 \u0642\u0628\u0644\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0631\u062f\u06cc\u0645. <\/p>\n<p>\u0645\u0648\u0627\u0631\u062f \u0632\u06cc\u0631 \u0631\u0627 \u0646\u06cc\u0632 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0631\u062f\u0645 <code>Procfile<\/code> \u0628\u0631\u0627\u06cc \u0627\u06cc\u0646\u06a9\u0647 \u0628\u0647 Heroku \u0628\u06af\u0648\u06cc\u0645 \u0686\u06af\u0648\u0646\u0647 \u0628\u0631\u0646\u0627\u0645\u0647 \u0645\u0646 \u0631\u0627 \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u06a9\u0646\u062f:\n<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight shell\"><code>web: node src\/index.js\n<\/code><\/pre>\n<\/div>\n<p>\u0628\u0639\u062f \u0645\u0646 \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 \u062c\u062f\u06cc\u062f Heroku \u0627\u06cc\u062c\u0627\u062f \u06a9\u0631\u062f\u0645:\n<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight shell\"><code><span class=\"nv\">$ <\/span>heroku create jvc-websocket-example\n\nCreating \u2b22 jvc-websocket-example... <span class=\"k\">done\n<\/span>https:\/\/jvc-websocket-example-62824c0b1df4.herokuapp.com\/ | https:\/\/git.heroku.com\/jvc-websocket-example.git\n<\/code><\/pre>\n<\/div>\n<p>\u0633\u067e\u0633\u060c \u0645\u0646 \u0631\u0627 \u062a\u0646\u0638\u06cc\u0645 \u06a9\u0631\u062f\u0645 <code>GRAPHQL_SUBSCRIPTION_HOST<\/code> \u0645\u062a\u063a\u06cc\u0631 \u0645\u062d\u06cc\u0637\u06cc \u0628\u0631\u0627\u06cc \u0627\u0634\u0627\u0631\u0647 \u0628\u0647 \u0633\u0631\u0648\u0631 GraphQL \u062f\u0631 \u062d\u0627\u0644 \u0627\u062c\u0631\u0627 \u0645\u0646:\n<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight shell\"><code><span class=\"nv\">$ <\/span>heroku <span class=\"nt\">--app<\/span> jvc-websocket-example <span class=\"se\">\\<\/span>\n    config:set <span class=\"se\">\\<\/span>\n<span class=\"nv\">GRAPHQL_SUBSCRIPTION_HOST<\/span><span class=\"o\">=<\/span>ws:\/\/jvc-graphql-server-sub-1ec2e6406a82.herokuapp.com\/graphql\n<\/code><\/pre>\n<\/div>\n<p>\u062f\u0631 \u0627\u06cc\u0646 \u0645\u0631\u062d\u0644\u0647\u060c \u0645\u0627 \u0622\u0645\u0627\u062f\u0647 \u0647\u0633\u062a\u06cc\u0645 \u062a\u0627 \u06a9\u062f \u062e\u0648\u062f \u0631\u0627 \u062f\u0631 Heroku \u0645\u0633\u062a\u0642\u0631 \u06a9\u0646\u06cc\u0645:\n<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight shell\"><code><span class=\"nv\">$ <\/span>git commit <span class=\"nt\">--allow-empty<\/span> <span class=\"nt\">-m<\/span> <span class=\"s1\">'Deploy to Heroku'<\/span>\n<span class=\"nv\">$ <\/span>git push heroku\n<\/code><\/pre>\n<\/div>\n<p>\u0647\u0646\u06af\u0627\u0645\u06cc \u06a9\u0647 \u0633\u0631\u0648\u06cc\u0633 \u06af\u06cc\u0631\u0646\u062f\u0647 WebSocket \u0634\u0631\u0648\u0639 \u0628\u0647 \u06a9\u0627\u0631 \u06a9\u0631\u062f\u060c \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u0645 \u0648\u0636\u0639\u06cc\u062a \u0622\u0646 \u0631\u0627 \u062f\u0631 \u062f\u0627\u0634\u0628\u0648\u0631\u062f Heroku \u0645\u0634\u0627\u0647\u062f\u0647 \u06a9\u0646\u06cc\u0645:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/media.dev.to\/cdn-cgi\/image\/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto\/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fi9vbt76st0qpa2w5e3sm.png\" alt=\"\u062a\u0635\u0648\u06cc\u0631 3\" width=\"800\" height=\"469\" title=\"\"><\/p>\n<p>\u0628\u0627 \u0645\u0634\u0627\u0647\u062f\u0647 \u0633\u06cc\u0627\u0647\u0647\u0647\u0627\u06cc \u0645\u0631\u0628\u0648\u0637 \u0628\u0647 \u062f\u0627\u0634\u0628\u0648\u0631\u062f Heroku \u0628\u0631\u0627\u06cc <code>jvc-websocket-example<\/code> \u0628\u0647 \u0639\u0646\u0648\u0627\u0646 \u0645\u062b\u0627\u0644\u060c \u0645\u0627 \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u0645 \u0628\u0647 \u0631\u0648\u0632 \u0631\u0633\u0627\u0646\u06cc \u0647\u0627\u06cc \u0645\u062a\u0639\u062f\u062f \u0631\u0627 \u0645\u0634\u0627\u0647\u062f\u0647 \u06a9\u0646\u06cc\u0645 <code>balance<\/code> \u062f\u0627\u0631\u0627\u06cc\u06cc \u0627\u0632 <code>jvc-graphql-server-sub<\/code> \u062e\u062f\u0645\u0627\u062a \u062f\u0631 \u0646\u0633\u062e\u0647 \u06cc \u0646\u0645\u0627\u06cc\u0634\u06cc \u062e\u0648\u062f\u060c \u0645\u0646 \u062d\u062a\u06cc \u062a\u0648\u0627\u0646\u0633\u062a\u0645 \u0645\u0648\u0631\u062f \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0631\u0627 \u0636\u0628\u0637 \u06a9\u0646\u0645 \u06a9\u0647 \u062f\u0631 \u0622\u0646 \u0645\u0648\u062c\u0648\u062f\u06cc \u0628\u0647 \u0635\u0641\u0631 \u0631\u0633\u06cc\u062f\u0647 \u0627\u0633\u062a\u060c \u0648 \u0634\u0628\u06cc\u0647 \u0633\u0627\u0632\u06cc \u067e\u0631\u062f\u0627\u062e\u062a \u0627\u0646\u062c\u0627\u0645 \u0634\u062f\u0647 \u0627\u0633\u062a:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/media.dev.to\/cdn-cgi\/image\/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto\/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fdpvei42wvbwohocnbt0w.png\" alt=\"\u062a\u0635\u0648\u06cc\u0631 4\" width=\"800\" height=\"458\" title=\"\"><\/p>\n<p>\u062f\u0631 \u062a\u0631\u0645\u06cc\u0646\u0627\u0644\u060c \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u06cc\u0645 \u0628\u0627 \u062f\u0633\u062a\u0648\u0631 CLI\u060c \u0628\u0647 \u0647\u0645\u0627\u0646 \u0644\u0627\u06af\u200c\u0647\u0627 \u062f\u0633\u062a\u0631\u0633\u06cc \u067e\u06cc\u062f\u0627 \u06a9\u0646\u06cc\u0645.\n<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight shell\"><code>2024-08-28T12:14:48.463846+00:00 app[web.1]: Received credit update: <span class=\"o\">{<\/span>\n2024-08-28T12:14:48.463874+00:00 app[web.1]:   token: <span class=\"s1\">'credit-token-1'<\/span>,\n2024-08-28T12:14:48.463875+00:00 app[web.1]:   customer_token: <span class=\"s1\">'customer-token-1'<\/span>,\n2024-08-28T12:14:48.463875+00:00 app[web.1]:   credit_limit: 10000,\n2024-08-28T12:14:48.463875+00:00 app[web.1]:   balance: 9950,\n2024-08-28T12:14:48.463876+00:00 app[web.1]:   credit_score: 750\n2024-08-28T12:14:48.463876+00:00 app[web.1]: <span class=\"o\">}<\/span>\n<\/code><\/pre>\n<\/div>\n<p>\u0645\u0627 \u0646\u0647 \u062a\u0646\u0647\u0627 \u06cc\u06a9 \u0633\u0631\u0648\u06cc\u0633 GraphQL \u0628\u0627 \u0627\u062c\u0631\u0627\u06cc \u0627\u0634\u062a\u0631\u0627\u06a9 \u062f\u0627\u0631\u06cc\u0645\u060c \u0628\u0644\u06a9\u0647 \u0627\u06a9\u0646\u0648\u0646 \u06cc\u06a9 \u0633\u0631\u0648\u06cc\u0633 \u06af\u06cc\u0631\u0646\u062f\u0647 WebSocket \u062f\u0627\u0631\u06cc\u0645 \u06a9\u0647 \u0627\u06cc\u0646 \u0628\u0647 \u0631\u0648\u0632 \u0631\u0633\u0627\u0646\u06cc \u0647\u0627 \u0631\u0627 \u0645\u0635\u0631\u0641 \u0645\u06cc \u06a9\u0646\u062f.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"%D9%86%D8%AA%DB%8C%D8%AC%D9%87_%DA%AF%DB%8C%D8%B1%DB%8C\"><\/span>\n<p>  <strong>\u0646\u062a\u06cc\u062c\u0647 \u06af\u06cc\u0631\u06cc<\/strong><br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u062e\u0648\u0627\u0646\u0646\u062f\u06af\u0627\u0646 \u0645\u0646 \u0645\u0645\u06a9\u0646 \u0627\u0633\u062a \u0628\u06cc\u0627\u0646\u06cc\u0647 \u0645\u0627\u0645\u0648\u0631\u06cc\u062a \u0634\u062e\u0635\u06cc \u0645\u0646 \u0631\u0627 \u0628\u0647 \u06cc\u0627\u062f \u0628\u06cc\u0627\u0648\u0631\u0646\u062f\u060c \u06a9\u0647 \u0645\u0646 \u0627\u062d\u0633\u0627\u0633 \u0645\u06cc \u06a9\u0646\u0645 \u0645\u06cc \u062a\u0648\u0627\u0646\u062f \u0628\u0631\u0627\u06cc \u0647\u0631 \u0645\u062a\u062e\u0635\u0635 \u0641\u0646\u0627\u0648\u0631\u06cc \u0627\u0637\u0644\u0627\u0639\u0627\u062a \u0627\u0639\u0645\u0627\u0644 \u0634\u0648\u062f:<\/p>\n<blockquote>\n<p><strong>\u00ab\u0632\u0645\u0627\u0646 \u062e\u0648\u062f \u0631\u0627 \u0631\u0648\u06cc \u0627\u0631\u0627\u0626\u0647 \u0648\u06cc\u0698\u06af\u06cc\u200c\u0647\u0627\/\u0639\u0645\u0644\u06a9\u0631\u062f\u0647\u0627\u06cc\u06cc \u0645\u062a\u0645\u0631\u06a9\u0632 \u06a9\u0646\u06cc\u062f \u06a9\u0647 \u0627\u0631\u0632\u0634 \u0645\u0627\u0644\u06a9\u06cc\u062a \u0645\u0639\u0646\u0648\u06cc \u0634\u0645\u0627 \u0631\u0627 \u0627\u0641\u0632\u0627\u06cc\u0634 \u0645\u06cc\u200c\u062f\u0647\u062f. \u0627\u0632 \u0686\u0627\u0631\u0686\u0648\u0628 \u0647\u0627\u060c \u0645\u062d\u0635\u0648\u0644\u0627\u062a \u0648 \u062e\u062f\u0645\u0627\u062a \u0628\u0631\u0627\u06cc \u0647\u0631 \u0686\u06cc\u0632 \u062f\u06cc\u06af\u0631\u06cc \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u06a9\u0646\u06cc\u062f.&#8221;<\/strong><\/p>\n<p><strong>&#8211; \u062c\u06cc. \u0648\u0633\u062a\u0631<\/strong><\/p>\n<\/blockquote>\n<p>\u062f\u0631 \u0627\u06cc\u0646 \u0628\u0631\u0631\u0633\u06cc \u0639\u0645\u06cc\u0642 \u062f\u0631 \u0627\u0634\u062a\u0631\u0627\u06a9\u200c\u0647\u0627\u06cc GraphQL\u060c \u0645\u0627 \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0633\u0631\u0648\u06cc\u0633 \u062f\u06cc\u06af\u0631\u06cc \u06a9\u0647 \u0628\u0631 \u0631\u0648\u06cc Heroku \u0627\u062c\u0631\u0627 \u0645\u06cc\u200c\u0634\u0648\u062f &#8211; \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 \u0645\u0628\u062a\u0646\u06cc \u0628\u0631 Node.js \u06a9\u0647 \u0627\u0632 WebSockets \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0645\u06cc\u200c\u06a9\u0646\u062f\u060c \u0628\u0647\u200c\u0631\u0648\u0632\u0631\u0633\u0627\u0646\u06cc\u200c\u0647\u0627\u06cc \u0633\u0631\u0648\u0631 \u0622\u067e\u0648\u0644\u0648 \u0631\u0627 \u06a9\u0647 \u0631\u0648\u06cc Heroku \u0627\u062c\u0631\u0627 \u0645\u06cc\u200c\u0634\u0648\u062f\u060c \u0628\u0627 \u0645\u0648\u0641\u0642\u06cc\u062a \u0645\u0635\u0631\u0641 \u06a9\u0631\u062f\u06cc\u0645. \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0627\u0634\u062a\u0631\u0627\u06a9\u200c\u0647\u0627\u06cc \u0633\u0628\u06a9 \u0648\u0632\u0646\u060c \u0627\u0632 \u0627\u0631\u0633\u0627\u0644 \u062f\u0631\u062e\u0648\u0627\u0633\u062a \u0628\u0631\u0627\u06cc \u062f\u0627\u062f\u0647\u200c\u0647\u0627\u06cc \u0628\u062f\u0648\u0646 \u062a\u063a\u06cc\u06cc\u0631 \u0627\u062c\u062a\u0646\u0627\u0628 \u06a9\u0631\u062f\u06cc\u0645\u060c \u0627\u0645\u0627 \u0635\u0631\u0641\u0627\u064b \u0645\u0634\u062a\u0631\u06a9 \u0634\u062f\u06cc\u0645 \u062a\u0627 \u0628\u0647\u200c\u0631\u0648\u0632\u0631\u0633\u0627\u0646\u06cc\u200c\u0647\u0627\u06cc \u0645\u0648\u062c\u0648\u062f\u06cc \u0627\u0639\u062a\u0628\u0627\u0631 \u0631\u0627 \u062f\u0631 \u0635\u0648\u0631\u062a \u0648\u0642\u0648\u0639 \u062f\u0631\u06cc\u0627\u0641\u062a \u06a9\u0646\u06cc\u0645.<\/p>\n<p>\u062f\u0631 \u0645\u0642\u062f\u0645\u0647\u060c \u0628\u0647 \u062f\u0646\u0628\u0627\u0644 \u06cc\u06a9 \u0627\u0635\u0644 \u0627\u0631\u0632\u0634 \u0627\u0636\u0627\u0641\u06cc \u062f\u0631 \u0645\u0648\u0636\u0648\u0639\u06cc \u06a9\u0647 \u0642\u0628\u0644\u0627\u064b \u062f\u0631 \u0645\u0648\u0631\u062f \u0622\u0646 \u0646\u0648\u0634\u062a\u0647\u200c\u0627\u0645\u060c \u0627\u0634\u0627\u0631\u0647 \u06a9\u0631\u062f\u0645. \u0627\u0634\u062a\u0631\u0627\u06a9\u200c\u0647\u0627\u06cc GraphQL \u0646\u0645\u0648\u0646\u0647\u200c\u0627\u06cc \u0639\u0627\u0644\u06cc \u0627\u0632 \u0686\u06cc\u0632\u06cc \u0627\u0633\u062a \u06a9\u0647 \u0645\u0646 \u062f\u0631 \u0630\u0647\u0646 \u062f\u0627\u0634\u062a\u0645\u060c \u0632\u06cc\u0631\u0627 \u0628\u0647 \u0645\u0635\u0631\u0641\u200c\u06a9\u0646\u0646\u062f\u06af\u0627\u0646 \u0627\u062c\u0627\u0632\u0647 \u0645\u06cc\u200c\u062f\u0647\u062f \u0641\u0648\u0631\u0627\u064b \u0628\u0647\u200c\u0631\u0648\u0632\u0631\u0633\u0627\u0646\u06cc\u200c\u0647\u0627 \u0631\u0627 \u062f\u0631\u06cc\u0627\u0641\u062a \u06a9\u0646\u0646\u062f\u060c \u0628\u062f\u0648\u0646 \u0627\u06cc\u0646\u06a9\u0647 \u0646\u06cc\u0627\u0632\u06cc \u0628\u0647 \u067e\u0631\u0633 \u0648 \u062c\u0648 \u062f\u0631 \u0645\u0648\u0631\u062f \u062f\u0627\u062f\u0647\u200c\u0647\u0627\u06cc \u0645\u0646\u0628\u0639 \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u0646\u062f. \u0627\u06cc\u0646 \u0628\u0627\u0639\u062b \u0645\u06cc\u200c\u0634\u0648\u062f \u0645\u0635\u0631\u0641\u200c\u06a9\u0646\u0646\u062f\u06af\u0627\u0646 \u062f\u0627\u062f\u0647\u200c\u0647\u0627\u06cc Customer 360 \u0628\u0633\u06cc\u0627\u0631 \u0647\u06cc\u062c\u0627\u0646\u200c\u0632\u062f\u0647 \u0634\u0648\u0646\u062f\u060c \u0632\u06cc\u0631\u0627 \u0645\u06cc\u200c\u062f\u0627\u0646\u0646\u062f \u06a9\u0647 \u0645\u06cc\u200c\u062a\u0648\u0627\u0646\u0646\u062f \u0628\u0647\u200c\u0631\u0648\u0632\u0631\u0633\u0627\u0646\u06cc\u200c\u0647\u0627\u06cc \u0632\u0646\u062f\u0647 \u0631\u0627 \u062f\u0631 \u0647\u0645\u0627\u0646 \u0632\u0645\u0627\u0646 \u0627\u0646\u062c\u0627\u0645 \u062f\u0647\u0646\u062f.<\/p>\n<p>Heroku \u0646\u0645\u0648\u0646\u0647 \u062f\u06cc\u06af\u0631\u06cc \u0627\u0633\u062a \u06a9\u0647 \u0628\u0627 \u0627\u0631\u0627\u0626\u0647 \u067e\u0644\u062a\u0641\u0631\u0645\u06cc \u06a9\u0647 \u0628\u0647 \u0645\u0646 \u0627\u0645\u06a9\u0627\u0646 \u0645\u06cc\u200c\u062f\u0647\u062f \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u06cc\u06a9 CLI \u0648 \u062f\u0633\u062a\u0648\u0631\u0627\u062a \u0627\u0633\u062a\u0627\u0646\u062f\u0627\u0631\u062f Git \u0628\u0647 \u0633\u0631\u0639\u062a \u0631\u0627\u0647\u200c\u062d\u0644\u200c\u0647\u0627 \u0631\u0627 \u0646\u0645\u0648\u0646\u0647\u200c\u0633\u0627\u0632\u06cc \u06a9\u0646\u0645\u060c \u0628\u0647 \u0628\u06cc\u0627\u0646\u06cc\u0647 \u0645\u0627\u0645\u0648\u0631\u06cc\u062a \u0645\u0646 \u067e\u0627\u06cc\u0628\u0646\u062f \u0627\u0633\u062a. \u0627\u06cc\u0646 \u0646\u0647 \u062a\u0646\u0647\u0627 \u0628\u0647 \u0645\u0646 \u06cc\u06a9 \u0631\u0627\u0647 \u0622\u0633\u0627\u0646 \u0628\u0631\u0627\u06cc \u0646\u0645\u0627\u06cc\u0634 \u0645\u0648\u0627\u0631\u062f \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0627\u0634\u062a\u0631\u0627\u06a9\u200c\u0647\u0627\u06cc\u0645 \u0645\u06cc\u200c\u062f\u0647\u062f\u060c \u0628\u0644\u06a9\u0647 \u0628\u0631\u0627\u06cc \u067e\u06cc\u0627\u062f\u0647\u200c\u0633\u0627\u0632\u06cc \u06cc\u06a9 \u0645\u0635\u0631\u0641\u200c\u06a9\u0646\u0646\u062f\u0647 \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 WebSockets \u0646\u06cc\u0632.<\/p>\n<p>\u0627\u06af\u0631 \u0628\u0647 \u06a9\u062f \u0645\u0646\u0628\u0639 \u0627\u06cc\u0646 \u0645\u0642\u0627\u0644\u0647 \u0639\u0644\u0627\u0642\u0647 \u0645\u0646\u062f \u0647\u0633\u062a\u06cc\u062f\u060c \u0645\u062e\u0627\u0632\u0646 \u0645\u0646 \u062f\u0631 GitLab \u0631\u0627 \u0628\u0631\u0631\u0633\u06cc \u06a9\u0646\u06cc\u062f:<\/p>\n<ul>\n<li>\n<p>\u0627\u0634\u062a\u0631\u0627\u06a9 graphql-server-customer <\/p>\n<\/li>\n<li>\n<p>websocket-example<\/p>\n<\/li>\n<\/ul>\n<p>\u0648\u0642\u062a\u06cc \u0645\u06cc \u06af\u0648\u06cc\u0645 \u0628\u0627 \u0627\u06cc\u0646 \u062a\u0644\u0627\u0634 \u0645\u0647\u0627\u0631\u062a \u0647\u0627\u06cc GraphQL \u062e\u0648\u062f \u0631\u0627 \u0628\u0627 \u0645\u0648\u0641\u0642\u06cc\u062a \u0627\u0631\u062a\u0642\u0627 \u062f\u0627\u062f\u0647 \u0627\u0645\u060c \u0627\u062d\u0633\u0627\u0633 \u0627\u0637\u0645\u06cc\u0646\u0627\u0646 \u0645\u06cc \u06a9\u0646\u0645. \u0627\u06cc\u0646 \u0633\u0641\u0631 \u0628\u0631\u0627\u06cc \u0645\u0646 \u062c\u062f\u06cc\u062f \u0648 \u0686\u0627\u0644\u0634 \u0628\u0631\u0627\u0646\u06af\u06cc\u0632 \u0628\u0648\u062f &#8230; \u0648 \u0647\u0645\u0686\u0646\u06cc\u0646 \u0628\u0633\u06cc\u0627\u0631 \u0633\u0631\u06af\u0631\u0645 \u06a9\u0646\u0646\u062f\u0647!<\/p>\n<p>\u0645\u0646 \u0642\u0635\u062f \u062f\u0627\u0631\u0645 \u062f\u0631 \u0645\u0631\u062d\u0644\u0647 \u0628\u0639\u062f\u06cc \u0628\u0647 \u0627\u062d\u0631\u0627\u0632 \u0647\u0648\u06cc\u062a \u0628\u067e\u0631\u062f\u0627\u0632\u0645\u060c \u06a9\u0647 \u0627\u0645\u06cc\u062f\u0648\u0627\u0631\u0645 \u0641\u0631\u0635\u062a \u062f\u06cc\u06af\u0631\u06cc \u0628\u0631\u0627\u06cc \u0627\u0631\u062a\u0642\u0627\u0621 \u0633\u0637\u062d \u0628\u0627 GraphQL \u0648 Apollo Server \u0641\u0631\u0627\u0647\u0645 \u06a9\u0646\u062f. \u0628\u0627 \u0645\u0627 \u0647\u0645\u0631\u0627\u0647 \u0628\u0627\u0634\u06cc\u062f!<\/p>\n<p>\u06cc\u06a9 \u0631\u0648\u0632 \u0648\u0627\u0642\u0639\u0627 \u0639\u0627\u0644\u06cc \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u06cc\u062f!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Summarize this content to 400 words in Persian Lang \u0686\u0646\u062f \u0633\u0627\u0644\u06cc \u0627\u0633\u062a \u06a9\u0647 \u0633\u0639\u06cc \u06a9\u0631\u062f\u0647\u200c\u0627\u0645 \u0686\u0627\u0631\u0686\u0648\u0628\u200c\u0647\u0627\u060c \u0645\u062d\u0635\u0648\u0644\u0627\u062a \u0648 \u062e\u062f\u0645\u0627\u062a\u06cc \u0631\u0627 \u0634\u0646\u0627\u0633\u0627\u06cc\u06cc \u06a9\u0646\u0645 \u06a9\u0647 \u0628\u0647 \u0641\u0646\u200c\u0622\u0648\u0631\u0627\u0646 \u0627\u062c\u0627\u0632\u0647 \u0645\u06cc\u200c\u062f\u0647\u062f \u062a\u0645\u0631\u06a9\u0632 \u062e\u0648\u062f \u0631\u0627 \u0628\u0631 \u06af\u0633\u062a\u0631\u0634 \u0627\u0631\u0632\u0634 \u0645\u0627\u0644\u06a9\u06cc\u062a \u0645\u0639\u0646\u0648\u06cc \u062e\u0648\u062f \u062d\u0641\u0638 \u06a9\u0646\u0646\u062f. \u0627\u06cc\u0646 \u0647\u0645\u0686\u0646\u0627\u0646 \u06cc\u06a9 \u0633\u0641\u0631 \u0641\u0648\u0642 \u0627\u0644\u0639\u0627\u062f\u0647 \u0628\u0631\u0627\u06cc \u0645\u0646 \u0627\u0633\u062a\u060c \u067e\u0631 \u0627\u0632 \u0641\u0631\u0635\u062a \u0647\u0627\u06cc \u06cc\u0627\u062f\u06af\u06cc\u0631\u06cc \u0645\u0646\u062d\u0635\u0631 \u0628\u0647 \u0641\u0631\u062f. &hellip;<\/p>\n","protected":false},"author":2,"featured_media":77110,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"fifu_image_url":"","fifu_image_alt":"","footnotes":""},"categories":[339],"tags":[],"class_list":["post-77108","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-dev"],"_links":{"self":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts\/77108","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/comments?post=77108"}],"version-history":[{"count":0,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts\/77108\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/media\/77110"}],"wp:attachment":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/media?parent=77108"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/categories?post=77108"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/tags?post=77108"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}