摘要:讀取并處理返回的,得出一個化的。這個處理是異步處理,所以返回是一個另外本身是個異步操作,得到的自然也是一個。使用創建一個資源,往往需要認證,需要把認證放在的里,把創建數據放到的里,發過去。如果返回的結果是格式的數據,還需把里的的值寫成
Basic Concept Promise Overview
Promise is a js standard built-in object.
Promise is used for asynchronous computations.
A Promise represents a value which may be available now, or in the future, or never.
A Promise is in one of these states:
pending: initial state, not fulfilled or rejected.
fulfilled: meaning that the operation completed successfully.
rejected: meaning that the operation failed.
As the Promise.prototype.then() and Promise.prototype.catch() methods return promises, they can be chained.
Definition Syntaxnew Promise( /* executor */ function(resolve, reject) { ... });
executor
A function normally initiates some asynchronous work, and then, once that completes, either calls the resolve function to resolve the promise or else reject it if an error occurred.
If an error is thrown in the executor function, the promise is rejected. The return value of the executor is ignored.
Because the work is an asynchronous work, you may use XHR or Fetch in it.
Methodsreject(reason) - return a promise with the given reason.
resolve(value) - return a promise that is resolved with the given value. The value maybe a promise too, if it is, chain the result with then method again.
Prototype Methodsprototype.catch(onRejected) - onRejected is a callback function to handle the situation that is on rejected.
prototype.then(onFulfilled, onRejected) - OnRejected is as the below catch method. OnFulfilled is a callback function to handle the situation that is on fulfilled.
FormData OverviewThe FormData interface provides a way to easily construct a set of key/value pairs representing from fields and their values, which can then be easily sent using asynchronous way(XHR or Fetch).
It uses the same format a form would use if the encoding type were set to "multipart/form-data".
Definition ConstructorFormData()
Create a new FormData object.
append()
delete()
entries()
get()
getAll()
has()
keys()
set()
values()
Fetch API OverviewThe Fetch API provides an interface for fetching resources(including across the network).
It will seem familiar to anyone who has used XHR, but the new API provides a more powerful and flexible feature set.
Definition Interfaces
GlobalFetch
fetch()
Headers
Request
implement Body
Response
implement Body
Mixin
Body
json()
Takes a Response stream and reads it to completion.It returns a promise that resolves with a JSON object.(讀取并處理fetch返回的Response,得出一個json Object化的response。這個處理是異步處理,所以返回是一個Promise.另外fetch本身是個異步操作,得到的Response自然也是一個Promise。)
使用POST創建一個資源,往往需要認證,需要把認證token放在request的header里,把創建數據放到request的body里,發過去。token要放到header的"Authorization" field里,并且前面要加"Bearer "類型標示。創建數據往往放到FormData里,再把formData放倒body里。
如果返回的結果是json格式的數據,還需把header里的"Accept" field的值寫成"application/json".
WorkFlowGet token from localStorage to post a image by fetch API.(assume the token is there.)
Get the remote url of the image in response.
Show image.
Demohttps://jsfiddle.net/clemTheD...
ReferencePromise
Fetch
FormData
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/82250.html
摘要:我們看下把重復代碼封裝成一個的示例代碼這里假設我們項目請求頭固定這兩個判斷返回沒有錯誤使調用可讀性更好以上封裝了一個,調用的時候如下對結果進行處理通過傳遞回調函數的方式,可讀性性不是很好當然這是一個仁者見仁的問題。 調用 ajax 取請求后端數據是項目中最基礎的功能。但是如果每次直接調用底層的瀏覽器 api 去發請求則非常麻煩?,F在來分析一下怎么封裝這一層,看看有哪些基礎問題需要考慮。...
摘要:四請求常見數據格式接下來將介紹如何使用請求本地文本數據,請求本地數據以及請求網絡接口。請求網絡接口獲取中的數據,做法與獲取本地的方法類似得到數據后,同樣要經過處理 一 序言 在 傳統Ajax 時代,進行 API 等網絡請求都是通過XMLHttpRequest或者封裝后的框架進行網絡請求,然而配置和調用方式非常混亂,對于剛入門的新手并不友好。今天我們介紹的Fetch提供了一個更好的替代方...
摘要:四請求常見數據格式接下來將介紹如何使用請求本地文本數據,請求本地數據以及請求網絡接口。請求網絡接口獲取中的數據,做法與獲取本地的方法類似得到數據后,同樣要經過處理 一 序言 在 傳統Ajax 時代,進行 API 等網絡請求都是通過XMLHttpRequest或者封裝后的框架進行網絡請求,然而配置和調用方式非?;靵y,對于剛入門的新手并不友好。今天我們介紹的Fetch提供了一個更好的替代方...
摘要:四請求常見數據格式接下來將介紹如何使用請求本地文本數據,請求本地數據以及請求網絡接口。請求網絡接口獲取中的數據,做法與獲取本地的方法類似得到數據后,同樣要經過處理 一 序言 在 傳統Ajax 時代,進行 API 等網絡請求都是通過XMLHttpRequest或者封裝后的框架進行網絡請求,然而配置和調用方式非?;靵y,對于剛入門的新手并不友好。今天我們介紹的Fetch提供了一個更好的替代方...
摘要:支持請求響應攔截器。定位與目標的定位是成為請求的終極解決方案。攔截器支持請求響應攔截器,可以通過它在請求發起之前和收到響應數據之后做一些預處理。 Fly.js 是一個功能強大的輕量級的javascript http請求庫,同時支持瀏覽器和node環境,通過適配器,它可以運行在任何具有網絡能力的javascript運行環境;同時fly.js有一些高級的玩法如全局ajax攔截、在web a...
閱讀 2970·2023-04-25 17:46
閱讀 3594·2021-11-25 09:43
閱讀 1100·2021-11-18 10:02
閱讀 3058·2021-10-14 09:43
閱讀 2776·2021-10-13 09:40
閱讀 1529·2021-09-28 09:35
閱讀 2190·2019-08-30 15:52
閱讀 3161·2019-08-30 14:06