摘要:基本方式為,求余取余調(diào)整長(zhǎng)度與鏈接變量進(jìn)行循環(huán)運(yùn)算。可以借助發(fā)送請(qǐng)求,元素作為一種傳輸機(jī)制。使用元素調(diào)用數(shù)據(jù)時(shí),必須用函數(shù)名和圓括號(hào)包裹起來(lái)。
中止請(qǐng)求和超時(shí)
一個(gè)栗子在上傳多少秒以后直接終止請(qǐng)求
// 發(fā)起HTTP GEt請(qǐng)求獲取指定URl的內(nèi)容 // 如果響應(yīng)成功到達(dá),將會(huì)傳入responseText給回調(diào)函數(shù) // 如果響應(yīng)在timeout毫秒內(nèi)沒(méi)有到達(dá),將會(huì)中止這個(gè)請(qǐng)求 function timedGetText(url, timeout, callback) { var request = new XMLHttpRequest(); // 創(chuàng)建新請(qǐng)求 var timedout = false; // 是否超時(shí),設(shè)置標(biāo)志 // 啟動(dòng)計(jì)時(shí)器,在timeout毫秒后將終止請(qǐng)求 var timer = setTimeout(() => { // 設(shè)置計(jì)時(shí)器,將在timeout時(shí)間之后執(zhí)行該操作,不同于直接定義,是直接 timedout = true; // 設(shè)置標(biāo)記 request.abort(); // 直接中止請(qǐng)求 }, timeout); // 直接終止請(qǐng)求 request.open("GET", url); request.onreadystatechange = () => { // 定義事件處理程序,如果事件處理完成,直接終止計(jì)時(shí)器 if (request.readyState !== 4) return; // 如果此時(shí)仍然有沒(méi)有下載完成的,直接忽視,等待計(jì)時(shí)器取消 if (timedout) return; // 確定此時(shí)仍然沒(méi)有超時(shí),如果此時(shí)仍然沒(méi)有超時(shí),直接取消 cleraTimeout(timer); // 此時(shí)已經(jīng)執(zhí)行完成任務(wù),取消計(jì)時(shí)器 if (request.status === 200) // 對(duì)回調(diào)函數(shù)的處理 callback(request.responseText); // 如果請(qǐng)求成功,將會(huì)直接返回成功的文本,并調(diào)用回調(diào)函數(shù) }; request.send(null); // 直接發(fā)送請(qǐng)求(此請(qǐng)求為異步操作) }跨域的HTTP請(qǐng)求
作為同源策略的一部分,XMLHttpRequest對(duì)象可以發(fā)起HTTP請(qǐng)求,由于同源的影響,導(dǎo)致必須是同源的,
ps script元素不是真正的受到了同源策略的影響,它加載并執(zhí)行任何來(lái)源的腳本,使用ajax的方式為直接script腳本完成
或者依舊可以使用cors的方式跨域訪問(wèn)網(wǎng)站
一些安全問(wèn)題如果傳入用戶名和密碼,其不能通過(guò)跨域發(fā)送(因?yàn)檫@樣可以利用js客戶端的方式,使得分布式破解密碼成為可能)
跨域請(qǐng)求不會(huì)包含其他任何的用戶證書
cookie和token 都會(huì)被丟棄,如果跨域請(qǐng)求需要這幾種憑證,必須在send方法之前,使用withCredentials
即簽名認(rèn)證
一次性身份校驗(yàn)方式,常常用于不同項(xiàng)目之間的api通信
舉例來(lái)自百度翻譯的api接口
https://fanyi-api.baidu.com/a...
上方是百度翻譯的api文檔
get請(qǐng)求url如下 http://api.fanyi.baidu.com/ap...
最后一個(gè)為簽名,在這里,這個(gè)api使用的是md5的 還有一種加密方式為rsa加密
md5 MD5是輸入不定長(zhǎng)度信息,輸出固定長(zhǎng)度128-bits的算法。經(jīng)過(guò)程序流程,生成四個(gè)32位數(shù)據(jù),最后聯(lián)合起來(lái)成為一個(gè)128-bits散列?;痉绞綖?,求余、取余、調(diào)整長(zhǎng)度、與鏈接變量進(jìn)行循環(huán)運(yùn)算。得出結(jié)果。
目前已經(jīng)被證實(shí)可被破解
還有一些哈希算法等其他的加密算法
繼續(xù)舉例
https://help.aliyun.com/docum...
上方的是來(lái)自于阿里云的一個(gè)api
只不過(guò)使用的是Hmac SHA1算法加密得到簽名的
HMAC-SHA1 為哈希運(yùn)算消息認(rèn)證碼,HMAC運(yùn)用的是哈希算法,以一個(gè)秘鑰和一個(gè)消息為輸入,生成一個(gè)消息摘要作為輸出。為一種最常用的簽名算法。用于對(duì)一段信息生成一段簽名的摘要,在GET或者POST請(qǐng)求內(nèi)token
token的鑒權(quán)流程
https://help.aliyun.com/docum...
整個(gè)流程是先通過(guò)用戶賬號(hào)體系登錄,接著對(duì)token認(rèn)證服務(wù)器發(fā)送申請(qǐng)token的請(qǐng)求,token的有效期自定義,驗(yàn)證通過(guò)后,直接返回給客戶端token,最后驗(yàn)證token到要訪問(wèn)的服務(wù)器。即上方為完整的用戶登錄過(guò)程
ps 用戶登錄需要進(jìn)行鑒權(quán)
由于http可被局域網(wǎng)抓包,所以一般使用ssl
后方的token會(huì)和后端服務(wù)器進(jìn)行token的同步
一篇博文 http://www.cnblogs.com/xiekel...
還有其他,不在說(shuō)
舉個(gè)栗子下方的栗子實(shí)現(xiàn)一個(gè)簡(jiǎn)單的跨域的js請(qǐng)求,使用的是來(lái)自于百度翻譯的api
使用的cors
ps 我根本找不到支持cors的api 貌似是瀏覽器不兼容的緣故。。唉。
那就暫時(shí)不舉了,總體來(lái)說(shuō)瀏覽器在發(fā)現(xiàn)是跨域請(qǐng)求的時(shí)候,會(huì)自動(dòng)添加origin頭,如果服務(wù)端Access-Control-Allow-Origin 的頭部和origin相同,或者為*號(hào)的時(shí)候,即可進(jìn)行同源請(qǐng)求,否則將會(huì)拒絕同源請(qǐng)求。
JSONP可以借助script發(fā)送HTTP請(qǐng)求,script元素作為一種ajax傳輸機(jī)制。
使用script,不會(huì)受到同源策略的影響,并且包含JSON編碼數(shù)據(jù)的響應(yīng)體會(huì)自動(dòng)解碼
腳本和安全性 使用script元素進(jìn)行AJAX傳輸,會(huì)運(yùn)行執(zhí)行發(fā)送過(guò)來(lái)的任何js腳本,這種方式適用于可信的第三方腳本,如廣告,統(tǒng)計(jì)等。
使用script元素調(diào)用數(shù)據(jù)時(shí),必須用js函數(shù)名和圓括號(hào)包裹起來(lái)。
使用script元素發(fā)送JSONP請(qǐng)求一個(gè)栗子
// 根據(jù)指定的URL發(fā)送一個(gè)JSONP請(qǐng)求 function getJSONP(url) { // 為本次請(qǐng)求創(chuàng)建一個(gè)唯一的回調(diào)函數(shù)名稱,將會(huì)拼接成 getJSONP.cb3 // 將會(huì)拼接成 ?jsonp=getJSONP.cb3 var cbnum = "cb" + getJSONP.counter++; // 自增計(jì)算器 var cbname = "getJSONP." + cbnum; // 作為JSONP函數(shù)的屬性 // 將回調(diào)函數(shù)名以表單彪馬的形式添加到url的?后面部分中 // 使用JSONP作為參數(shù)名 if (url.indexOf("?") === -1) // 如果url沒(méi)有查詢部分 url += "?jsonp=" + cbname; // 進(jìn)行添加參數(shù),拼接成為完整的url else // 否則 url += "&jsonp" + cbname; // 將會(huì)作為新的參數(shù)進(jìn)行添加 // 創(chuàng)建script元素用于發(fā)送請(qǐng)求 var script = document.createElement("script"); // 觸發(fā)HTTP請(qǐng)求,直接操作DOM創(chuàng)建script節(jié)點(diǎn),讓瀏覽器加載 script.src = url; document.body.appendChild(script); }
總體思路是,直接創(chuàng)建script元素,通過(guò)添加src屬性,讓script元素代為發(fā)送get請(qǐng)求
查看響應(yīng)
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/108333.html
摘要:私有變量用來(lái)臨時(shí)存放配置中的,即請(qǐng)求成功后執(zhí)行的回調(diào)函數(shù)名,該配置可以為類型。是根據(jù)配置得出的回調(diào)函數(shù)名。接下來(lái),將的占位符,替換成回調(diào)函數(shù)名,最后將插入到頁(yè)面中,發(fā)送請(qǐng)求。 Ajax 模塊也是經(jīng)常會(huì)用到的模塊,Ajax 模塊中包含了 jsonp 的現(xiàn)實(shí),和 XMLHttpRequest 的封裝。 讀 Zepto 源碼系列文章已經(jīng)放到了github上,歡迎star: reading-...
摘要:但是有可能還不太它內(nèi)部具體是如何實(shí)現(xiàn)一個(gè)的,從請(qǐng)求的發(fā)出,到指定的成功或失敗回調(diào)函數(shù)的執(zhí)行。服務(wù)端會(huì)解析請(qǐng)求的至少拿到一個(gè)回調(diào)函數(shù)比如參數(shù)之后將數(shù)據(jù)放入其中返回給客戶端。 前言 原文地址 倉(cāng)庫(kù)地址 jsonp(JSON with padding)你一定不會(huì)陌生,前端向后端拿數(shù)據(jù)的方式之一,也是處理跨域請(qǐng)求的得利助手。 我們?cè)缫蚜?xí)慣,早已熟練了jQ或者zepto的ajax調(diào)用方式。但是...
閱讀 1806·2021-11-15 11:37
閱讀 3122·2021-11-04 16:05
閱讀 1940·2021-10-27 14:18
閱讀 2773·2021-08-12 13:30
閱讀 2511·2019-08-29 14:18
閱讀 2106·2019-08-29 13:07
閱讀 2056·2019-08-27 10:54
閱讀 2747·2019-08-26 12:15