<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Dian</title>
    <description>The latest articles on DEV Community by Dian (@dianwu).</description>
    <link>https://dev.to/dianwu</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F197141%2F657dd984-6e61-4c2c-889d-8fb3b346a63d.png</url>
      <title>DEV Community: Dian</title>
      <link>https://dev.to/dianwu</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/dianwu"/>
    <language>en</language>
    <item>
      <title>Interaction Issue between Apache's ETag Return and Accept-Encoding</title>
      <dc:creator>Dian</dc:creator>
      <pubDate>Mon, 16 Oct 2023 01:13:51 +0000</pubDate>
      <link>https://dev.to/dianwu/interaction-issue-between-apaches-etag-return-and-accept-encoding-3k0c</link>
      <guid>https://dev.to/dianwu/interaction-issue-between-apaches-etag-return-and-accept-encoding-3k0c</guid>
      <description>&lt;p&gt;Hello, I am encountering an issue related to the ETag return while using Apache and am hoping to get some insights from the community.&lt;/p&gt;

&lt;p&gt;In my server environment, when the HTTP Request Header contains Accept-Encoding: gzip, deflate, Apache appends a "-gzip" suffix to the ETag in the response, turning it into "12345-gzip". However, when I send another request to the same resource with "If-None-Match: 12345-gzip" in the headers, Apache responds with a status code of 200 instead of the expected 304.&lt;/p&gt;

&lt;p&gt;On the other hand, if I adjust the Request Header to "If-None-Match: 12345", then Apache responds with a 304 status code, which is as expected.&lt;/p&gt;

&lt;p&gt;I searched online and found some discussions suggesting that this might be a bug in Apache. However, I would like to further confirm and understand if anyone else has faced a similar issue and how they resolved it. Does anyone have any recommendations or solutions to offer? Much appreciated!&lt;/p&gt;

</description>
      <category>discuss</category>
      <category>apahche</category>
      <category>webserver</category>
      <category>cache</category>
    </item>
    <item>
      <title>Mock 工具介紹 — Mockoon</title>
      <dc:creator>Dian</dc:creator>
      <pubDate>Sun, 20 Jun 2021 15:35:23 +0000</pubDate>
      <link>https://dev.to/dianwu/mock-mockoon-5ebo</link>
      <guid>https://dev.to/dianwu/mock-mockoon-5ebo</guid>
      <description>&lt;p&gt;Mockoon 是一款具有 UI 隨裝即的 Mock API 工具。本身就包含了 Proxy 及 Mock 的功能，在做前端測試時是很方便的工具。&lt;/p&gt;

&lt;h2&gt;
  
  
  Proxy
&lt;/h2&gt;

&lt;p&gt;在開發新功能時，需要 Mockoon 的只有新 API 而已，所以 Mockoon 本身帶有 Proxy 功能就是很方便的工具。&lt;br&gt;
點擊右上 [齒輪] 可以開啟 Proxy mode 設定介面。只要不是我們要 mock 的目標就是丟回原本的 server 處理。&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fjb3k9wpydmrcbo7cnv2z.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fjb3k9wpydmrcbo7cnv2z.png" alt="Proxy Config"&gt;&lt;/a&gt;&lt;/p&gt;
&lt;h2&gt;
  
  
  Mock
&lt;/h2&gt;

&lt;p&gt;Mock 回傳內容除了可以在 UI 上直接輸入預期要回傳的內容，當回傳的內容很大時，也可以使用讀取本地檔案的方式回傳回容。回傳檔案的功能特別適合前端的 JS/CSS 還在開發階段時使用。&lt;/p&gt;
&lt;h2&gt;
  
  
  Rule
&lt;/h2&gt;

&lt;p&gt;Mock 的 Rule 的條件可以用 Request 的 Query string、Body、Header、Router params 或是 Request Number 設定提供很大的彈性。&lt;/p&gt;

&lt;p&gt;Rule 的比對方式是只要合符就不會再往下比對，所以在設定多組 Rule 時應該將條件較嚴格的 Rule 放在條件寬鬆的 Rule 之前。&lt;/p&gt;

&lt;p&gt;例如我想要在 Create user 時依據有沒有使用 refer code 來回傳不同的內容，就可以設定兩組不同的 Rule 回傳不同的內容。&lt;/p&gt;

&lt;p&gt;Rule: Create user with refer&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fsmdy4zsolvql2imgox4e.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fsmdy4zsolvql2imgox4e.png" alt="Create user with refer"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Rule: Create user without refer&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F1pidul91solwzibv0eby.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F1pidul91solwzibv0eby.png" alt="Create user without refer"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Create user with refer 應該排在 Create user without refer 之前，直接用滑鼠拖拉就可以改變順序&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fffnehom4k9zv4ci2wm2b.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fffnehom4k9zv4ci2wm2b.png" alt="用滑鼠拖拉就可以改變順序"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Templating&lt;br&gt;
透過 Templating 可以將 Response 中指定的段落用 Request 的內容取代做出動態改變回傳內容，也可以改回傳本地檔案的檔案路徑。&lt;br&gt;
下面範例為，用 Request 中的 username 及 refer 替換掉 Response 內容的做法。&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{
  "data": {
    "index": 0,
    "username": {{body 'username'}},
    "refer": {{body 'refer' ''}}
  },
  "error_code": 0
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;搭配的Request：&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;POST /api/v1/users
Content-Type: application/json

{
  "username": "John", 
  "refer": "XDCJJU8"
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Templating 套用在讀取本地端檔案&lt;br&gt;
使用 url 讀取對應的本地端檔案，在原本 url 中檔案名稱的位置上加上 &lt;code&gt;:jsFile&lt;/code&gt; 並在 File 的路徑中使用 &lt;code&gt;{{urlParam 'jsFileF'}}&lt;/code&gt; 改變讀取的檔案路徑。&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fievhgcgxyhjwe3ifrifd.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fievhgcgxyhjwe3ifrifd.png" alt="Path Templating"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;結語&lt;br&gt;
Mockoon 在設定上十分簡單，功能也相完整，很值得前端的開發者導入開發流程之中。&lt;/p&gt;

&lt;p&gt;參考資料：&lt;br&gt;
Mockoon 官網&lt;/p&gt;

</description>
      <category>testing</category>
      <category>mock</category>
    </item>
  </channel>
</rss>
