鍍金池/ 問(wèn)答/HTML/ 如何避免options請(qǐng)求？

如何避免options請(qǐng)求？

我用vue-cli做一個(gè)后臺(tái)，要跨域訪問(wèn)微信服務(wù)器，獲取統(tǒng)計(jì)數(shù)據(jù)
圖片描述

我用axios發(fā)送post請(qǐng)求，然后瀏覽器先發(fā)了一個(gè)options請(qǐng)求
圖片描述

然后報(bào)錯(cuò)：
圖片描述

然后，我看阮一峰的 跨域資源共享 CORS 詳解，如果請(qǐng)求字段超出如下內(nèi)容，就是非簡(jiǎn)單請(qǐng)求，瀏覽器就先發(fā)option試探服務(wù)器是否允許跨域。

（1) 請(qǐng)求方法是以下三種方法之一：
HEAD
GET
POST
（2）HTTP的頭信息不超出以下幾種字段：
Accept
Accept-Language
Content-Language
Last-Event-ID
Content-Type：只限于三個(gè)值application/x-www-form-urlencoded、multipart/form-data、text/plain

我這段代碼發(fā)送的請(qǐng)求，為什么不是簡(jiǎn)單請(qǐng)求呢？
給個(gè)解決思路。

// 概況趨勢(shì)
export function getweanalysisappiddailysummarytrend (accessToken, data) {
  const url = `https://api.weixin.qq.com/datacube/getweanalysisappiddailysummarytrend?access_token=${accessToken}`
  axios.post(url, data)
    .then(res => {
      console.log(res)
    })
}
回答
編輯回答
神經(jīng)質(zhì)

你用的時(shí)axios,你需要再引入一個(gè)qs.min.js
然后：

axios.post(url, Qs.stringify(data))
    .then(res => {
      console.log(res)
    })
2018年8月30日 10:57
編輯回答
怣痛

添加了 content-type：application/x-www-form-urlencoded，避免了options請(qǐng)求，微信服務(wù)器返回了正確的數(shù)據(jù)，狀態(tài)碼200，但是瀏覽器依舊不允許跨域，還是拿不到數(shù)據(jù)

Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access

后來(lái)的解決方法是，用自己的服務(wù)器向微信post數(shù)據(jù)，再把微信結(jié)果返回客戶端

2018年5月24日 03:11
編輯回答
野橘

默認(rèn)情況下，axios將JavaScript對(duì)象序列化為JSON來(lái)發(fā)送，也就是說(shuō)會(huì)使用 'application/json'作為Content-Type，變得“不簡(jiǎn)單”了，你可以用qs庫(kù)來(lái)處理post的data

如果不是這個(gè)原因，那就檢查有沒(méi)有設(shè)置一些自定義的header

2017年9月10日 17:03