抖音POI获取token,分别通过axios,fetch发送json和form-data

1.fetch formData

let data = new FormData()
data.append('client_key','111111')
data.append('client_secret','222222')
data.append('grant_type','client_credential')
fetch('/douyinOpen/oauth/client_token/',{
  method: 'post',
  body:data
})

备注:省略了content-type因为浏览器自动填入了正确的值

2.fetch json

fetch("/douyinOpen/oauth/client_token/", {
  headers: {
    "content-type": "application/json"
  },
  body: '{"client_key":"111111","client_secret":"222222","grant_type":"client_credential"}',
  method: "POST"
});

备注:默认为text/plain;charset=UTF-8所以这里覆盖掉，body中传入json字符串

3.axios formData

let data = new FormData()
data.append('client_key','111111')
data.append('client_secret','222222')
data.append('grant_type','client_credential')
axios({
  method: 'post',
  url: '/douyinOpen/oauth/client_token/',
  data: data
}).then(res=>{})

备注:省略了content-type因为浏览器自动填入了正确的值

4.axios json

// 发送 POST 请求
axios({
  method: 'post',
  url: '/douyinOpen/oauth/client_token/',
  data: {
    client_key: '111111',
    client_secret: '222222',
    grant_type: 'client_credential'
  },
  headers:{
    "content-type": "application/json"
  }
});

备注:传入content-type覆盖掉默认值

5.总结
传递FormData的时候fetch和axios都能正确的自动设置好Content-Type的值，所以可以省略不传
但是传递json的时候，fetch中的content-type被设置为了text/plain;charset=UTF-8,而axios中的content-type首先读取了库中的配置文件，不同版本可能有不同的设置值，但是在此项目中必须为application/json,否则都会报错，所以通过显式设置覆盖掉默认配置

6.补充
抖音POI文档说的提交格式为formData,但是经过测试，formData可以成功，json格式也可以但是content-type必须为application/json,如传入application/json;charset=utf-8就会出错

铁血汉子 2022年8月31日

0 1417