<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	xmlns:series="https://publishpress.com/"
	>

<channel>
	<title>GraphQL Archives - Tomoshare</title>
	<atom:link href="https://blog.tomosia.com.vn/tag/graphql/feed/" rel="self" type="application/rss+xml" />
	<link>https://blog.tomosia.com.vn/tag/graphql/</link>
	<description>Kênh chia sẻ kiến thức Tomosia Việt Nam</description>
	<lastBuildDate>Wed, 29 Nov 2023 02:55:16 +0000</lastBuildDate>
	<language>en-US</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=7.0</generator>

<image>
	<url>https://blog.tomosia.com.vn/wp-content/uploads/2023/09/cropped-icon-32x32.png</url>
	<title>GraphQL Archives - Tomoshare</title>
	<link>https://blog.tomosia.com.vn/tag/graphql/</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>Building a GraphQL API in Rails</title>
		<link>https://blog.tomosia.com.vn/building-a-graphql-api-in-rails/</link>
					<comments>https://blog.tomosia.com.vn/building-a-graphql-api-in-rails/#comments</comments>
		
		<dc:creator><![CDATA[Hổ Nguyễn]]></dc:creator>
		<pubDate>Wed, 29 Nov 2023 02:55:14 +0000</pubDate>
				<category><![CDATA[Ruby]]></category>
		<category><![CDATA[Ruby On Rails]]></category>
		<category><![CDATA[GraphQL]]></category>
		<guid isPermaLink="false">https://blog.tomosia.com.vn/?p=2050</guid>

					<description><![CDATA[<p>Trong thế giới phát triển web, API (Giao diện Lập trình Ứng dụng) đóng vai trò quan trọng&#8230;</p>
<p>The post <a href="https://blog.tomosia.com.vn/building-a-graphql-api-in-rails/">Building a GraphQL API in Rails</a> appeared first on <a href="https://blog.tomosia.com.vn">Tomoshare</a>.</p>
]]></description>
										<content:encoded><![CDATA[
<p class="wp-block-paragraph">Trong thế giới phát triển web, API (Giao diện Lập trình Ứng dụng) đóng vai trò quan trọng trong việc kích thích sự giao tiếp giữa các hệ thống phần mềm khác nhau. GraphQL, một ngôn ngữ truy vấn dành cho API, đã thu hút sự chú ý lớn với tính linh hoạt và hiệu suất cao trong việc truy xuất dữ liệu.</p>



<p class="wp-block-paragraph">Trong bài đăng blog này, chúng ta sẽ khám phá quá trình xây dựng một GraphQL API trong Ruby on Rails, một framework mạnh mẽ và thân thiện với nhà phát triển.</p>



<h2 id="graphql-la-gi" class="wp-block-heading">GraphQL là gì?</h2>



<p class="wp-block-paragraph">GraphQL là một ngôn ngữ truy vấn dành cho API và là một runtime để thực hiện những truy vấn đó đối với dữ liệu của bạn. Khác với các API REST truyền thống, nơi máy khách có kiểm soát hạn chế về dữ liệu mà nó nhận được, GraphQL cho phép máy khách yêu cầu chỉ những dữ liệu cần thiết. Điều này dẫn đến quá trình truy xuất dữ liệu hiệu quả và chính xác hơn.</p>



<h2 id="thiet-lap-du-an-rails" class="wp-block-heading">Thiết Lập Dự Án Rails</h2>



<p class="wp-block-paragraph">Trước khi đào sâu vào GraphQL, hãy thiết lập một dự án Rails mới. Mở terminal và chạy các lệnh sau:</p>



<div class="wp-block-kevinbatdorf-code-block-pro cbp-has-line-numbers" data-code-block-pro-font-family="Code-Pro-JetBrains-Mono" style="font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#f6f6f4;--cbp-line-number-width:8.4296875px;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)"><span style="display:flex;align-items:center;padding:10px 0px 10px 16px;margin-bottom:-2px;width:100%;text-align:left;background-color:#333545;color:#ebebe6">Bash</span><span role="button" tabindex="0" data-code="rails new graphql_api 
cd graphql_api" style="color:#f6f6f4;display:none" aria-label="Copy" class="code-block-pro-copy-button"><svg xmlns="http://www.w3.org/2000/svg" style="width:24px;height:24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path class="with-check" stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5"></path><path class="without-check" stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></span><pre class="shiki dracula-soft" style="background-color: #282A36" tabindex="0"><code><span class="line"><span style="color: #62E884">rails</span><span style="color: #F6F6F4"> </span><span style="color: #E7EE98">new</span><span style="color: #F6F6F4"> </span><span style="color: #E7EE98">graphql_api</span><span style="color: #F6F6F4"> </span></span>
<span class="line"><span style="color: #97E1F1">cd</span><span style="color: #F6F6F4"> </span><span style="color: #E7EE98">graphql_api</span></span></code></pre></div>



<h2 id="them-dependencies" class="wp-block-heading">Thêm Dependencies</h2>



<p class="wp-block-paragraph">Để tích hợp GraphQL vào dự án Rails của bạn, bạn sẽ cần thêm một số gems vào Gemfile. Mở Gemfile và bao gồm các dòng sau:</p>



<div class="wp-block-kevinbatdorf-code-block-pro cbp-has-line-numbers" data-code-block-pro-font-family="Code-Pro-JetBrains-Mono" style="font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#f6f6f4;--cbp-line-number-width:8.4296875px;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)"><span style="display:flex;align-items:center;padding:10px 0px 10px 16px;margin-bottom:-2px;width:100%;text-align:left;background-color:#333545;color:#ebebe6">Ruby</span><span role="button" tabindex="0" data-code="# Gemfile 

gem 'graphql' 
gem 'graphiql-rails', group: :development" style="color:#f6f6f4;display:none" aria-label="Copy" class="code-block-pro-copy-button"><svg xmlns="http://www.w3.org/2000/svg" style="width:24px;height:24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path class="with-check" stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5"></path><path class="without-check" stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></span><pre class="shiki dracula-soft" style="background-color: #282A36" tabindex="0"><code><span class="line"><span style="color: #7B7F8B"># Gemfile </span></span>
<span class="line"></span>
<span class="line"><span style="color: #F6F6F4">gem </span><span style="color: #DEE492">&#39;</span><span style="color: #E7EE98">graphql</span><span style="color: #DEE492">&#39;</span><span style="color: #F6F6F4"> </span></span>
<span class="line"><span style="color: #F6F6F4">gem </span><span style="color: #DEE492">&#39;</span><span style="color: #E7EE98">graphiql-rails</span><span style="color: #DEE492">&#39;</span><span style="color: #F6F6F4">, group</span><span style="color: #F286C4">:</span><span style="color: #F6F6F4"> </span><span style="color: #BF9EEE">:development</span></span></code></pre></div>



<p class="wp-block-paragraph">Chạy <mark style="background-color:rgba(0, 0, 0, 0)" class="has-inline-color has-vivid-red-color"><code>bundle install</code> </mark>để cài đặt các gems này.</p>



<h2 id="tao-schema-graphql" class="wp-block-heading">Tạo Schema GraphQL</h2>



<p class="wp-block-paragraph">Trong GraphQL, schema xác định các loại và các hoạt động có thể thực hiện trên dữ liệu của bạn. Hãy tạo một schema đơn giản cho ứng dụng blog. Chạy lệnh sau để tạo một schema GraphQL mới:</p>



<div class="wp-block-kevinbatdorf-code-block-pro cbp-has-line-numbers" data-code-block-pro-font-family="Code-Pro-JetBrains-Mono" style="font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#f6f6f4;--cbp-line-number-width:8.4296875px;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)"><span style="display:flex;align-items:center;padding:10px 0px 10px 16px;margin-bottom:-2px;width:100%;text-align:left;background-color:#333545;color:#ebebe6">Bash</span><span role="button" tabindex="0" data-code="rails generate graphql:install" style="color:#f6f6f4;display:none" aria-label="Copy" class="code-block-pro-copy-button"><svg xmlns="http://www.w3.org/2000/svg" style="width:24px;height:24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path class="with-check" stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5"></path><path class="without-check" stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></span><pre class="shiki dracula-soft" style="background-color: #282A36" tabindex="0"><code><span class="line"><span style="color: #62E884">rails</span><span style="color: #F6F6F4"> </span><span style="color: #E7EE98">generate</span><span style="color: #F6F6F4"> </span><span style="color: #E7EE98">graphql:install</span></span></code></pre></div>



<p class="wp-block-paragraph">Lệnh này sẽ tạo một thư mục <code><mark style="background-color:rgba(0, 0, 0, 0)" class="has-inline-color has-vivid-red-color">graphql</mark></code> trong thư mục dự án của bạn, chứa một tệp schema cơ bản (<code><mark style="background-color:rgba(0, 0, 0, 0)" class="has-inline-color has-vivid-red-color">app/graphql/types/query_type.rb</mark></code>). Tùy chỉnh tệp này để xác định schema GraphQL của bạn.</p>



<div class="wp-block-kevinbatdorf-code-block-pro cbp-has-line-numbers" data-code-block-pro-font-family="Code-Pro-JetBrains-Mono" style="font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#f6f6f4;--cbp-line-number-width:16.859375px;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)"><span style="display:flex;align-items:center;padding:10px 0px 10px 16px;margin-bottom:-2px;width:100%;text-align:left;background-color:#333545;color:#ebebe6">Ruby</span><span role="button" tabindex="0" data-code="# app/graphql/types/query_type.rb 

module Types 
  class QueryType &lt; Types::BaseObject 
    field :posts, [Types::PostType], null: false 
    
    def posts 
      Post.all
    end 
  end 
end" style="color:#f6f6f4;display:none" aria-label="Copy" class="code-block-pro-copy-button"><svg xmlns="http://www.w3.org/2000/svg" style="width:24px;height:24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path class="with-check" stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5"></path><path class="without-check" stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></span><pre class="shiki dracula-soft" style="background-color: #282A36" tabindex="0"><code><span class="line"><span style="color: #7B7F8B"># app/graphql/types/query_type.rb </span></span>
<span class="line"></span>
<span class="line"><span style="color: #F286C4">module</span><span style="color: #F6F6F4"> </span><span style="color: #97E1F1; font-style: italic">Types</span><span style="color: #F6F6F4"> </span></span>
<span class="line"><span style="color: #F6F6F4">  </span><span style="color: #F286C4">class</span><span style="color: #F6F6F4"> </span><span style="color: #97E1F1">QueryType</span><span style="color: #F6F6F4"> </span><span style="color: #F286C4">&lt;</span><span style="color: #F6F6F4"> </span><span style="color: #97E1F1; font-style: italic">Types::BaseObject</span><span style="color: #F6F6F4"> </span></span>
<span class="line"><span style="color: #F6F6F4">    field </span><span style="color: #BF9EEE">:posts</span><span style="color: #F6F6F4">, [</span><span style="color: #97E1F1; font-style: italic">Types</span><span style="color: #F286C4">::</span><span style="color: #BF9EEE">PostType</span><span style="color: #F6F6F4">], null</span><span style="color: #F286C4">:</span><span style="color: #F6F6F4"> </span><span style="color: #BF9EEE">false</span><span style="color: #F6F6F4"> </span></span>
<span class="line"><span style="color: #F6F6F4">    </span></span>
<span class="line"><span style="color: #F6F6F4">    </span><span style="color: #F286C4">def</span><span style="color: #F6F6F4"> </span><span style="color: #62E884">posts</span><span style="color: #F6F6F4"> </span></span>
<span class="line"><span style="color: #F6F6F4">      </span><span style="color: #97E1F1; font-style: italic">Post</span><span style="color: #F6F6F4">.all</span></span>
<span class="line"><span style="color: #F6F6F4">    </span><span style="color: #F286C4">end</span><span style="color: #F6F6F4"> </span></span>
<span class="line"><span style="color: #F6F6F4">  </span><span style="color: #F286C4">end</span><span style="color: #F6F6F4"> </span></span>
<span class="line"><span style="color: #F286C4">end</span></span></code></pre></div>



<h2 id="dinh-nghia-cac-loai" class="wp-block-heading">Định Nghĩa Các Loại</h2>



<p class="wp-block-paragraph">Trong ví dụ này, chúng ta đã tạo một trường <code><strong>posts</strong></code> trả về một mảng các đối tượng <code><strong>Post</strong></code>. Bạn cũng cần xác định <code><strong>PostType</strong></code>.</p>



<ul class="wp-block-list">
<li>Đừng quên là hãy chạy lệnh <mark style="background-color:rgba(0, 0, 0, 0)" class="has-inline-color has-vivid-red-color">rails generate model Post title:string content:text</mark> và <mark style="background-color:rgba(0, 0, 0, 0)" class="has-inline-color has-vivid-red-color">rails db:migrate</mark> để tạo ra bảng <strong>Post</strong> trước</li>
</ul>



<p class="wp-block-paragraph">Tạo một tệp mới <code><mark style="background-color:rgba(0, 0, 0, 0)" class="has-inline-color has-vivid-red-color">app/graphql/types/post_type.rb</mark></code>:</p>



<div class="wp-block-kevinbatdorf-code-block-pro cbp-has-line-numbers" data-code-block-pro-font-family="Code-Pro-JetBrains-Mono" style="font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#f6f6f4;--cbp-line-number-width:8.4296875px;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)"><span style="display:flex;align-items:center;padding:10px 0px 10px 16px;margin-bottom:-2px;width:100%;text-align:left;background-color:#333545;color:#ebebe6">Ruby</span><span role="button" tabindex="0" data-code="# app/graphql/types/post_type.rb 

module Types 
  class PostType &lt; Types::BaseObject 
    field :id, ID, null: false 
    field :title, String, null: false 
    field :content, String, null: false 
  end 
end" style="color:#f6f6f4;display:none" aria-label="Copy" class="code-block-pro-copy-button"><svg xmlns="http://www.w3.org/2000/svg" style="width:24px;height:24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path class="with-check" stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5"></path><path class="without-check" stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></span><pre class="shiki dracula-soft" style="background-color: #282A36" tabindex="0"><code><span class="line"><span style="color: #7B7F8B"># app/graphql/types/post_type.rb </span></span>
<span class="line"></span>
<span class="line"><span style="color: #F286C4">module</span><span style="color: #F6F6F4"> </span><span style="color: #97E1F1; font-style: italic">Types</span><span style="color: #F6F6F4"> </span></span>
<span class="line"><span style="color: #F6F6F4">  </span><span style="color: #F286C4">class</span><span style="color: #F6F6F4"> </span><span style="color: #97E1F1">PostType</span><span style="color: #F6F6F4"> </span><span style="color: #F286C4">&lt;</span><span style="color: #F6F6F4"> </span><span style="color: #97E1F1; font-style: italic">Types::BaseObject</span><span style="color: #F6F6F4"> </span></span>
<span class="line"><span style="color: #F6F6F4">    field </span><span style="color: #BF9EEE">:id</span><span style="color: #F6F6F4">, </span><span style="color: #BF9EEE">ID</span><span style="color: #F6F6F4">, null</span><span style="color: #F286C4">:</span><span style="color: #F6F6F4"> </span><span style="color: #BF9EEE">false</span><span style="color: #F6F6F4"> </span></span>
<span class="line"><span style="color: #F6F6F4">    field </span><span style="color: #BF9EEE">:title</span><span style="color: #F6F6F4">, </span><span style="color: #BF9EEE">String</span><span style="color: #F6F6F4">, null</span><span style="color: #F286C4">:</span><span style="color: #F6F6F4"> </span><span style="color: #BF9EEE">false</span><span style="color: #F6F6F4"> </span></span>
<span class="line"><span style="color: #F6F6F4">    field </span><span style="color: #BF9EEE">:content</span><span style="color: #F6F6F4">, </span><span style="color: #BF9EEE">String</span><span style="color: #F6F6F4">, null</span><span style="color: #F286C4">:</span><span style="color: #F6F6F4"> </span><span style="color: #BF9EEE">false</span><span style="color: #F6F6F4"> </span></span>
<span class="line"><span style="color: #F6F6F4">  </span><span style="color: #F286C4">end</span><span style="color: #F6F6F4"> </span></span>
<span class="line"><span style="color: #F286C4">end</span></span></code></pre></div>



<p class="wp-block-paragraph">Tệp này xác định cấu trúc của một loại <code><strong>Post</strong></code> với các trường <code><strong>id</strong></code>, <code><strong>title</strong></code>, và <code><strong>content</strong></code>.</p>



<h2 id="kiem-thu-voi-graphiql" class="wp-block-heading">Kiểm Thử với GraphiQL</h2>



<p class="wp-block-paragraph">GraphiQL là một công cụ đồ họa tương tác trực tuyến dành cho GraphQL giúp đơn giản hóa quá trình kiểm thử các truy vấn GraphQL của bạn. Để kích hoạt GraphiQL, mở tệp <code><mark style="background-color:rgba(0, 0, 0, 0)" class="has-inline-color has-vivid-red-color">config/routes.rb</mark></code> và thêm các dòng sau:</p>



<div class="wp-block-kevinbatdorf-code-block-pro cbp-has-line-numbers" data-code-block-pro-font-family="Code-Pro-JetBrains-Mono" style="font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#f6f6f4;--cbp-line-number-width:8.4296875px;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)"><span style="display:flex;align-items:center;padding:10px 0px 10px 16px;margin-bottom:-2px;width:100%;text-align:left;background-color:#333545;color:#ebebe6">Ruby</span><span role="button" tabindex="0" data-code="# config/routes.rb 

if Rails.env.development? 
  mount GraphiQL::Rails::Engine, at: &quot;/graphiql&quot;, graphql_path: &quot;/graphql&quot; end 
  
post &quot;/graphql&quot;, to: &quot;graphql#execute&quot;" style="color:#f6f6f4;display:none" aria-label="Copy" class="code-block-pro-copy-button"><svg xmlns="http://www.w3.org/2000/svg" style="width:24px;height:24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path class="with-check" stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5"></path><path class="without-check" stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></span><pre class="shiki dracula-soft" style="background-color: #282A36" tabindex="0"><code><span class="line"><span style="color: #7B7F8B"># config/routes.rb </span></span>
<span class="line"></span>
<span class="line"><span style="color: #F286C4">if</span><span style="color: #F6F6F4"> </span><span style="color: #97E1F1; font-style: italic">Rails</span><span style="color: #F6F6F4">.env.development? </span></span>
<span class="line"><span style="color: #F6F6F4">  mount </span><span style="color: #97E1F1; font-style: italic">GraphiQL</span><span style="color: #F286C4">::</span><span style="color: #97E1F1; font-style: italic">Rails</span><span style="color: #F286C4">::</span><span style="color: #BF9EEE">Engine</span><span style="color: #F6F6F4">, at</span><span style="color: #F286C4">:</span><span style="color: #F6F6F4"> </span><span style="color: #DEE492">&quot;</span><span style="color: #E7EE98">/graphiql</span><span style="color: #DEE492">&quot;</span><span style="color: #F6F6F4">, graphql_path</span><span style="color: #F286C4">:</span><span style="color: #F6F6F4"> </span><span style="color: #DEE492">&quot;</span><span style="color: #E7EE98">/graphql</span><span style="color: #DEE492">&quot;</span><span style="color: #F6F6F4"> </span><span style="color: #F286C4">end</span><span style="color: #F6F6F4"> </span></span>
<span class="line"><span style="color: #F6F6F4">  </span></span>
<span class="line"><span style="color: #F6F6F4">post </span><span style="color: #DEE492">&quot;</span><span style="color: #E7EE98">/graphql</span><span style="color: #DEE492">&quot;</span><span style="color: #F6F6F4">, to</span><span style="color: #F286C4">:</span><span style="color: #F6F6F4"> </span><span style="color: #DEE492">&quot;</span><span style="color: #E7EE98">graphql#execute</span><span style="color: #DEE492">&quot;</span></span></code></pre></div>



<p class="wp-block-paragraph">Bây giờ, khi bạn chạy máy chủ Rails của mình (<code><mark style="background-color:rgba(0, 0, 0, 0)" class="has-inline-color has-vivid-red-color">rails server</mark></code>), bạn có thể truy cập <code><mark style="background-color:rgba(0, 0, 0, 0)" class="has-inline-color has-vivid-red-color">http://localhost:3000/graphiql</mark></code> để tương tác với GraphQL API của bạn.</p>



<h2 id="thuc-hien-cac-truy-van" class="wp-block-heading">Thực Hiện Các Truy Vấn</h2>



<p class="wp-block-paragraph">Bây giờ, bạn có thể kiểm thử các truy vấn GraphQL của mình trong GraphiQL. Ví dụ:</p>



<div class="wp-block-kevinbatdorf-code-block-pro cbp-has-line-numbers" data-code-block-pro-font-family="Code-Pro-JetBrains-Mono" style="font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#f6f6f4;--cbp-line-number-width:8.4296875px;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)"><span style="display:flex;align-items:center;padding:10px 0px 10px 16px;margin-bottom:-2px;width:100%;text-align:left;background-color:#333545;color:#ebebe6">GraphQL</span><span role="button" tabindex="0" data-code="query {
  posts {
    id
    title
    content
  }
}" style="color:#f6f6f4;display:none" aria-label="Copy" class="code-block-pro-copy-button"><svg xmlns="http://www.w3.org/2000/svg" style="width:24px;height:24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path class="with-check" stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5"></path><path class="without-check" stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></span><pre class="shiki dracula-soft" style="background-color: #282A36" tabindex="0"><code><span class="line"><span style="color: #F286C4">query</span><span style="color: #F6F6F4"> {</span></span>
<span class="line"><span style="color: #F6F6F4">  </span><span style="color: #E7EE98">posts</span><span style="color: #F6F6F4"> {</span></span>
<span class="line"><span style="color: #F6F6F4">    </span><span style="color: #E7EE98">id</span></span>
<span class="line"><span style="color: #F6F6F4">    </span><span style="color: #E7EE98">title</span></span>
<span class="line"><span style="color: #F6F6F4">    </span><span style="color: #E7EE98">content</span></span>
<span class="line"><span style="color: #F6F6F4">  }</span></span>
<span class="line"><span style="color: #F6F6F4">}</span></span></code></pre></div>



<p class="wp-block-paragraph">Truy vấn này sẽ truy xuất tất cả các bài viết cùng với các trường <strong><code>id</code>, <code>title</code></strong>, và <code><strong>content</strong></code>.</p>



<figure class="wp-block-image size-large"><img fetchpriority="high" decoding="async" width="1024" height="582" src="http://blog.tomosia.com.vn/wp-content/uploads/2023/11/Screenshot-2023-11-28-at-10.17.45-AM-1024x582.png" alt="" class="wp-image-2056" srcset="https://blog.tomosia.com.vn/wp-content/uploads/2023/11/Screenshot-2023-11-28-at-10.17.45-AM-1024x582.png 1024w, https://blog.tomosia.com.vn/wp-content/uploads/2023/11/Screenshot-2023-11-28-at-10.17.45-AM-300x170.png 300w, https://blog.tomosia.com.vn/wp-content/uploads/2023/11/Screenshot-2023-11-28-at-10.17.45-AM-768x436.png 768w, https://blog.tomosia.com.vn/wp-content/uploads/2023/11/Screenshot-2023-11-28-at-10.17.45-AM-1536x873.png 1536w, https://blog.tomosia.com.vn/wp-content/uploads/2023/11/Screenshot-2023-11-28-at-10.17.45-AM-2048x1163.png 2048w, https://blog.tomosia.com.vn/wp-content/uploads/2023/11/Screenshot-2023-11-28-at-10.17.45-AM-380x216.png 380w, https://blog.tomosia.com.vn/wp-content/uploads/2023/11/Screenshot-2023-11-28-at-10.17.45-AM-800x454.png 800w, https://blog.tomosia.com.vn/wp-content/uploads/2023/11/Screenshot-2023-11-28-at-10.17.45-AM-1160x659.png 1160w, https://blog.tomosia.com.vn/wp-content/uploads/2023/11/Screenshot-2023-11-28-at-10.17.45-AM.png 2880w" sizes="(max-width: 1024px) 100vw, 1024px" /></figure>



<p class="wp-block-paragraph">Chúc mừng! Bạn đã xây dựng thành công một GraphQL API trong Ruby on Rails. <br>Happy coding!</p>
<p>The post <a href="https://blog.tomosia.com.vn/building-a-graphql-api-in-rails/">Building a GraphQL API in Rails</a> appeared first on <a href="https://blog.tomosia.com.vn">Tomoshare</a>.</p>
]]></content:encoded>
					
					<wfw:commentRss>https://blog.tomosia.com.vn/building-a-graphql-api-in-rails/feed/</wfw:commentRss>
			<slash:comments>6</slash:comments>
		
		
			</item>
	</channel>
</rss>
