摘要:注請求地址是自己的項目地址,請自行更改。這只是一個簡單的原生的使用,之后會發如何封裝原生實現的第一步創建對象。第四步發送請求數據。但是一般情況下數據的請求都是異步的,那么就要使用這個事件對數據進行處理。
注:請求地址是自己的項目地址,請自行更改。
這只是一個簡單的原生XMLHttpRequst的使用,之后會發如何封裝原生ajax實現jequery的ajax第一步:創建xhr對象。
const xhr = new XMLHttpRequest();第二步:open()設置。
xhr.open("PUT","http://118.24.84.199:8080/sm/accept/list",false);第三步:設置接口需要的頭部。
xhr.setRequestHeader("token","515b8c62-ddf4-41ef-a7c8-93957e1c589e"); xhr.setRequestHeader("Accept","application/json"); xhr.setRequestHeader("Content-Type","application/json");第四步:發送請求數據。
注意:這里的數據需要進行處理,處理為json文件,使用JSON.stringify處理。
let data = { page:1, pageSize:10, }; data = JSON.stringify(data); xhr.send(data);到這里就已經發送了,可以在瀏覽器的網絡請求中查看請求的情況。 但是在頁面中還沒有進行數據處理
如果數據是同步請求:直接在send()語句之后對數據進行處理。
console.log(xhr.response);
但是一般情況下數據的請求都是異步的,那么就要使用onreadystatechange這個事件對數據進行處理。
接收到數據之后將其打印。
xhr.onreadystatechange = function(event){ if (xhr.readyState == 4){ if ((xhr.status >= 200 && xhr.status < 300) || xhr.status == 304){ console.log(JSON.parse(xhr.response)); } else { console.log("Request was unsuccessful: " + xhr.status); } } };
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/96541.html
摘要:原生與對的實現一定義里這么解釋異步的和。二原生實現所有現代瀏覽器以及均內建對象。一般是正常未找到頁面,一般是錯誤,或者后臺沒有創建相應的內部服務錯誤,多為后臺錯誤?;旧贤ㄟ^發送的數據及傳回的數據就能定位問題所在了。 原生JS與jQuery對AJAX的實現 一、定義 W3C里這么解釋AJAX: AJAX = Asynchronous JavaScript and XML(異步的 Jav...
摘要:一封裝原生的為類以及用法見之前的文章根據確定請求的頭部以及別的信息。二封裝實用性的類在項目中經常需要將進行封裝,使用類發起請求。請求不帶請求帶請求不帶請求帶請求不帶請求帶這個方法感覺可以再次進行封裝。完整代碼點擊查看以上。 一、封裝原生的xhr為ajax類 xhr以及用法見之前的文章 1、根據url確定請求的頭部以及別的信息。 var _headerConfig = {}; ...
摘要:在這里講解一下用原生如何實現。當然,前面也說過,你可以給定固定回調函數名最后我已經將和請求合并在一起了,下載鏈接原文鏈接原生實現如有問題,歡迎在下方留言 相信大多數前端開發者在需要與后端進行數據交互時,為了方便快捷,都會選擇JQuery中封裝的AJAX方法,但是有些時候,我們只需要JQuery的AJAX請求方法,而其他的功能用到的很少,這顯然是沒必要的。 其實,原生JavaScript...
摘要:我們都知道因為同源策略的問題,瀏覽器的請求是可能隨便跨域的一定要有跨域頭或者借助,但是,中可以設置為不跨域,如下所示這樣之后我們會得到一個為的返回。 免費幫忙內推阿里等各大IT公司的崗位,有興趣可以帶簡歷加微信angeltune 引言 前端技術真是一個發展飛快的領域,我三年前入職的時候只有原生XHR和Jquery ajax,我們還曾被JQuery 1.9版本版本以下不支持大文件請求這個...
閱讀 1230·2021-11-11 16:54
閱讀 1745·2021-10-13 09:40
閱讀 940·2021-10-08 10:05
閱讀 3503·2021-09-22 15:50
閱讀 3707·2021-09-22 15:41
閱讀 1801·2021-09-22 15:08
閱讀 2346·2021-09-07 10:24
閱讀 3578·2019-08-30 12:52