亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

關(guān)于 Fetch API 的注意事項(xiàng)

tracy / 2107人閱讀

摘要：輸出為因此當(dāng)我們發(fā)送令牌時(shí)，在服務(wù)端接收到的是，如果仍用處理，將發(fā)生錯(cuò)誤。文件上傳失敗解決刪除你的自定義請(qǐng)求頭設(shè)置參見實(shí)踐補(bǔ)充篇，文件上傳怎么設(shè)置

fetch(url, {
    // "GET", "POST", "PUT", "DELETE"等
    method: "GET", 
})
關(guān)于 GET 參數(shù)

發(fā)送GET請(qǐng)求時(shí)的query參數(shù)不能放到對(duì)象中（如：{a:1, b:2}） 必須在 url 字符串中：

const url = "http://api.example.com/search?a=1&b=2"

可通過如下函數(shù)處理url：

function makeURL(url, params = {}) {
    let _URL = new URL(url, window.location.origin);
    Object.keys(params).forEach(key => _URL.searchParams.append(key, params[key]));
    return _URL
}
const url = makeURL("http://api.example.com/search",{
    a: 1,
    b: 2,
})

然后發(fā)起請(qǐng)求：

fetch(url, {
    method: "GET"
})
關(guān)于 POST 請(qǐng)求體 body

如需通過POST請(qǐng)求的發(fā)送json，需要做字符串化處理：

fetch(url, {
    method: "POST",
    headers: {
        "Content-Type": "application/json",
    }
    body: JSON.stringify({a: 1, b: 2})
})
關(guān)于 cookies

Fetch 發(fā)送請(qǐng)求默認(rèn)不攜帶 cookies，如需攜帶，需要添加credentials: "include" 參數(shù)：

fetch(url,{
    method: "GET", // "POST"等
    credentials: "include",
})
關(guān)于 Headers

定義headers：

const headers = {
    "Content-Type": "application/x-www-form-urlencoded"
    "Authorization": "Token uynn887989afs989s8df9afa08&^&huh"
}

或

const headers = new Headers({
    "Content-Type": "application/x-www-form-urlencoded"
    "Authorization": "Token uynn887989afs989s8df9afa08&^&huh"
})

發(fā)送請(qǐng)求：

fetch(url, {
  method: "POST",
  headers: headers,
}

自定義的 headers中的鍵會(huì)經(jīng)過 Headers 對(duì)象包裝，會(huì)自動(dòng)轉(zhuǎn)換為小寫。

// Create a test Headers object
var myHeaders = new Headers();
myHeaders.append("Content-Type", "text/xml");
myHeaders.append("Vary", "Accept-Language");

// Display the key/value pairs
for (var [key,value] of myHeaders.entries()) {
    console.log(`${key}: ${value}`);
}

輸出為：

content-type: text/xml
VM141:8 vary: Accept-Language

因此當(dāng)我們發(fā)送 Authorization 令牌時(shí)，在服務(wù)端接收到的是 authorization，如果仍用 Authorization 處理，將發(fā)生錯(cuò)誤。

文件上傳失敗解決

刪除你的自定義Content-Type請(qǐng)求頭設(shè)置

參見：fetch實(shí)（cai）踐（keng）補(bǔ)充篇，文件上傳Content-type multipart/form-data怎么設(shè)置

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://www.ezyhdfw.cn/yun/84681.html

相關(guān)文章

  • Fetch API

    摘要：遍歷所有的字段，接受一個(gè)回調(diào)函數(shù)，和可選的第二個(gè)參數(shù)。構(gòu)造函數(shù)接受的參數(shù)和函數(shù)的參數(shù)形式一樣，實(shí)際上方法會(huì)使用傳入的參數(shù)構(gòu)造出一個(gè)對(duì)象來。 Fetch API Fetch API 旨在用來簡(jiǎn)化 HTTP 請(qǐng)求，它包含以下類和方法： fetch 方法：用于發(fā)起 HTTP 請(qǐng)求 Request 類：用來描述請(qǐng)求 Response 類：用來表示響應(yīng) Headers 類：用來表示 HTTP ...

    AJie 評(píng)論0 收藏0

  • ES6 Fetch API HTTP請(qǐng)求實(shí)用指南

    摘要：例子張三刪除用戶為了刪除用戶，我們首先需要定位用戶，然后我們定義方法類型。例子張三結(jié)論現(xiàn)在，你已基本了解如何使用的從服務(wù)器檢索或操作資源，以及如何處理。您可以使用本文作為如何構(gòu)建操作的請(qǐng)求的指南。 showImg(https://segmentfault.com/img/bVbjxqh?w=1000&h=562); 本次將介紹如何使用Fetch API（ES6 +）對(duì)REST API的...

    Sunxb 評(píng)論0 收藏0

  • 分別使用 XHR、jQuery 和 Fetch 實(shí)現(xiàn) AJAX

    摘要：本文詳細(xì)講述如何使用原生和來實(shí)現(xiàn)。使用可以無刷新地向服務(wù)端發(fā)送請(qǐng)求接收服務(wù)端響應(yīng)，并更新頁(yè)面。分別要用到的方法和方法。，，都是現(xiàn)在和未來解決異步的標(biāo)準(zhǔn)做法，可以完美搭配使用。這也是使用標(biāo)準(zhǔn)一大好處。 本文詳細(xì)講述如何使用原生 JS、jQuery 和 Fetch 來實(shí)現(xiàn) AJAX。 AJAX 即 Asynchronous JavaScript and XML，異步的 JavaScript...

    Julylovin 評(píng)論0 收藏0

  • 異步請(qǐng)求與Fetch

    摘要：再談異步請(qǐng)求語(yǔ)言將任務(wù)的執(zhí)行模式分成兩種同步和異步。通過對(duì)象及時(shí)監(jiān)聽完成事件，執(zhí)行事件回調(diào)函數(shù)不會(huì)堵塞程序運(yùn)行。新的是異步請(qǐng)求的另一種方案，比起其復(fù)雜糅雜的寫法，能更簡(jiǎn)潔的獲取到數(shù)據(jù)。提供了對(duì)和以及其他與網(wǎng)絡(luò)請(qǐng)求有關(guān)的對(duì)象的通用定義。 再談異步請(qǐng)求 Javascript語(yǔ)言將任務(wù)的執(zhí)行模式分成兩種：同步（Synchronous）和異步（Asynchronous）。 在瀏覽器，耗時(shí)很長(zhǎng)...

    vibiu 評(píng)論0 收藏0

  • Chrome 66 Beta：CSS 類型對(duì)象模型，異步剪貼板 API，AudioWorklet，等

    摘要：在中，針對(duì)屬性的一個(gè)子集實(shí)現(xiàn)了類型對(duì)象模型，這些屬于的一部分。返回一個(gè)對(duì)象，該對(duì)象指定每個(gè)受限制屬性的值或值范圍。例如，這會(huì)在導(dǎo)航請(qǐng)求期間發(fā)生。按照規(guī)范，已被刪除。 原文鏈接：Chrome 66 Beta: CSS Typed Object Model, Async Clipboard API, AudioWorklet 除非另有說明，否則下文所述的更改適用于 Android，Ch...

    ralap 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<