16. HTTP request methods ( 下 )--- PUT vs. PATCH

延续昨天的文章15. HTTP request methods ( 上 )--- GET vs. POST，今天来复习PUT和PATCH。

PUT

The difference between PUT and POST is that PUT is idempotent: calling it once or several times successively has the same effect (that is no side effect), whereas successive identical POST requests may have additional effects, akin to placing an order several times.

PUT请求方法用於创建或更新资料。

虽然POST也能够创建资料，差别在PUT有幂等(Idempotent)的性质。

幂等的作用是为了确保在请求失败时，可以重新进行请求，而不会造成多余的影响。PUT更新资料的方式是覆盖整笔资料，所以是一个Idempotent method。

范例

昨天尝试取得过的第一笔资料，原本是长这样子的：

// output
{
	"userId": 1,
	"id": 1,
	"title": "delectus aut autem",
	"completed": false
}

来修改一下内容：

fetch('https://jsonplaceholder.typicode.com/todos/1',   {  //目标URL
  method: 'PUT',  // 使用PUT
  body: JSON.stringify({
    title: 'Winnie the Pooh',  // 改个标题
    id: 1,
    userId: 1,
    completed: true,
    notes: "new Item"  // 增加了一个条目
  }),
  headers: {
    'Content-type': 'application/json; charset=UTF-8',
  },
})
  .then(response => response.json())
  .then(json => { console.log(json) ;})

成功PUT结果:

{
    "title": 'Winnie the Pooh', 
    "id": 1,
    "userId": 1,
    "completed": true,
    "notes": "new Item" 
  }

可以用response.status来确认请求的状态，在.json()加入这一行：

  .then(response => sonsole.log(response.status))

PUT的性质

safe(安全) : 会更动资料的内容，因此是不安全的。(X)
idempotent(幂等) : 即使请求多次，server都会回传相同的结果，所以也是幂等的。(O)
cacheable(可缓存的) : 不会被缓存。(X)

PATCH

PATCH用於局部资料的更新。

A PATCH request is considered a set of instructions on how to modify a resource. Contrast this with PUT; which is a complete representation of a resource.

相较於PUT是覆盖整笔资料，PATCH只会更动部分的资料。

一样看到例子，我们还是借用第一笔资料：

// output
{
	"userId": 1,
	"id": 1,
	"title": "delectus aut autem",
	"completed": false
}

PATCH请求：

fetch('https://jsonplaceholder.typicode.com/todos/1',   {  
  method: 'PATCH',
  body: JSON.stringify({
    completed: true,
  }),
  headers: {
    'Content-type': 'application/json; charset=UTF-8',
  },
})
  .then(response => response.json())
  .then(json => { console.log(json) ;})

成功PATCH的结果：

// output
{
	"userId": 1,
	"id": 1,
	"title": "delectus aut autem",
	"completed": true
}

所以如果不小心写成PUT，资料会出大事：

{
	"id": 1,
    "completed": true,
  }

整笔资料会被覆盖过去，这就是PUT和PATCH的差异。

PATCH的性质

safe(安全) : 会更动资料的内容，因此是不安全的。(X)
idempotent(幂等) : 请求多次就会执行多次要求，所以不是幂等的。(X)
cacheable(可缓存的) : 如果headers里的Content-Location有指定，是可以被暂时储存。但一般不会这麽做，而且这在Firefox不支援。(△，和POST一样)