ajax

ajax

跨域

跨域:http 協(xié)議 域名 端口

三者只要有一個不同擂仍,就是跨域

服務(wù)端解決跨域: res.setHeader('Access-Control-Allow-Origin','*')

客戶端 request

客戶端 request 請求三部分 請求行 請求頭 請求體

請求行

req

method ?path ?http version

請求頭

Host 主機(jī)名

Connection 鏈接狀態(tài)

User-Agent 客戶端軟件環(huán)境

Accept 接受響應(yīng)類型

Accept-Encoding 接受的數(shù)據(jù)壓縮格式

Accept-Language 客戶端語言格式

Cookie 數(shù)據(jù)載體

請求體

name=liwenli&id=10

服務(wù)端 response

服務(wù)端 response 響應(yīng)三部分 響應(yīng)行 響應(yīng)頭 響應(yīng)體

響應(yīng)行

http version ?狀態(tài)碼 狀態(tài)語

響應(yīng)頭

Server 服務(wù)名稱

Date 響應(yīng)時間

Content-Type 響應(yīng)內(nèi)容mime類型 字符編碼格式 默認(rèn)text/html

Transfer-Encoding 傳輸編碼格式 chunked 分段傳輸

Connection 鏈接狀態(tài)

Cache-Control 緩存控制

Content-Encoding 壓縮格式

Set-Cookie 設(shè)置cookie

響應(yīng)體 響應(yīng)回送的內(nèi)容

sever詞匯 同步異步

解析url路徑 url.pars

url.parse(req.url,true)解析路徑 如果是true的話,返回的是鍵值隊(duì)

query: { name: 'zhufeng', id: '2' },

pathname是url路徑

query 查詢問號后面的參數(shù)

創(chuàng)建sever

createServer 創(chuàng)建一個sever

res.setHeader()設(shè)置響應(yīng)頭類型信息 (text/css text/html )

var result=fs.readFileSyn('.index/html') 獲取文件路徑

res.end('') 結(jié)束響應(yīng)原押,并返回給客戶端

req.url 客戶端請求路徑

如果請求資源不存在

如果請求資源不存在 返回404

res.statusCode = 404;

res.end('404 NOT FOUND!')

ajax獲取數(shù)據(jù)

注釋:AJAX在不加載網(wǎng)頁的情況下,更新部分?jǐn)?shù)據(jù)

1:

創(chuàng)建對象 XML

var xml=new XMLHTTPRequest();

實(shí)例創(chuàng)建,后續(xù)所有的操作,都用該對象上的屬性

2:

打開地址xml.open()

@param1:請求方式get post delete head put---->method請求方式

@param2:請求地址 接口url

@param3:同步false/異步true ?sync/async

xml.open('git','data.txt',false)

3:

響應(yīng)請求

@param1:readyState 請求狀態(tài)

@param2:status http狀態(tài)碼

xml.onreadystatechange=function(){

if(xml.readyState==4&&/2\d{2}/.test(xml.status)){ 監(jiān)聽狀態(tài)

data=xml.responseText 數(shù)據(jù)存儲在這個里面

}

}

4:xml.send();發(fā)送請求

5:回掉函數(shù)

typeof ?callback=='function'?callback(data):null;

method請求方式

method設(shè)置請求的方式

> GET系列 問號傳參 ?傳遞的服務(wù)器的內(nèi)容有大小限制 谷歌8KB衍菱、火狐7KB、IE2KB

> - get ?獲取

> - delete 刪除

> - head 只獲取服務(wù)器響應(yīng)頭信息

>

> POST系列 設(shè)置請求主體

> - post ?給后端推送數(shù)據(jù)

> - put 更新服務(wù)端數(shù)據(jù)

jquery ajax獲取數(shù)據(jù)

數(shù)據(jù)獲取

$.ajax

$.ajax({

type:'GET',//請求方式 ‘POST’ JSONP(跨域請求) 1.9以下版本mothod用這個

url:'www.baidu.com', //請求url地址棠笑,請求接口地址

dataType:'json'//返回的數(shù)據(jù)類型

async:false//是否異步

cache:true// 默認(rèn)是否緩存 true緩存

context:window 指定success里面上下文

beforeSend:function(){

發(fā)送請求之前 觸發(fā)

}

data:form.serialize(),//表單序列化

jsonp:'',//重寫jsonp的請求 url中回調(diào)函數(shù) key的名字

jsonpCallback:'',//制定jsonp回掉函數(shù)的名稱 ? ? ? ? ? ? ? ? ? ? ? ?value名字

data:{

查詢參數(shù)梦碗,向后臺發(fā)送數(shù)據(jù)(url?wd=liwenli&uid=1)

wd:'liwenli',

uid:1

}

success:function(val){//成功之后返回數(shù)據(jù)

this.data=val

}

timerout:3000//3秒以后終止請求 超時時間/原生xhr.timeout觸發(fā)的是xhr.ontimeout=function(){}

error:function(res){ 請求出錯 404不會被觸發(fā)禽绪,請求超時的時候蓖救,會報錯

}

complete:function(xhr){

不管提交成功或者失敗洪规,都會執(zhí)行

}

})

HTTP網(wǎng)絡(luò)狀態(tài)碼

服務(wù)器響應(yīng)狀態(tài)碼(HTTP網(wǎng)絡(luò)狀態(tài)碼):

> 200 成功

> 3xx 重定向

> 301 永久重定向(永久轉(zhuǎn)移)

> 302 臨時重定向(臨時轉(zhuǎn)移) ?服務(wù)器負(fù)載均衡

> 303 查看其他位置

> 304 讀取緩存數(shù)據(jù)(對于不經(jīng)常改變的CSS/JS等文件,我們可以做304緩存)

> 4xx 請求錯誤

> 400 傳遞參數(shù)有誤 客戶端錯誤

> 401 沒權(quán)限

> 403 禁止 服務(wù)器拒絕請求

> 404 找不到

> 5xx 服務(wù)器錯誤

> 500 未知的服務(wù)器錯誤

> 503 服務(wù)器超負(fù)載

AJAX的各種狀態(tài)

AJAX的各種狀態(tài)

> xhr.readyState

> 0 uninitialized 未初始化,創(chuàng)建了ajax對象循捺,但是沒有調(diào)用open方法的時候斩例;

> 1 loading 調(diào)用open方法,準(zhǔn)備發(fā)送請求从橘;

> 2 loaded 發(fā)送請求后念赶,完全接收響應(yīng)信息,開始準(zhǔn)備解析恰力;

> 3 interactive 交互叉谜,將響應(yīng)回來的原始數(shù)據(jù)解析為客戶端可以調(diào)用的數(shù)據(jù),掛載到xhr.responseText ?xhr.responseXML中等

> 4 done 響應(yīng)完成,客戶端可以調(diào)用踩萎,并且http status是200

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末停局,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子香府,更是在濱河造成了極大的恐慌董栽,老刑警劉巖,帶你破解...
    沈念sama閱讀 212,718評論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件企孩,死亡現(xiàn)場離奇詭異锭碳,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)勿璃,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,683評論 3 385
  • 文/潘曉璐 我一進(jìn)店門擒抛,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人蝗柔,你說我怎么就攤上這事闻葵。” “怎么了癣丧?”我有些...
    開封第一講書人閱讀 158,207評論 0 348
  • 文/不壞的土叔 我叫張陵槽畔,是天一觀的道長。 經(jīng)常有香客問我胁编,道長厢钧,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 56,755評論 1 284
  • 正文 為了忘掉前任嬉橙,我火速辦了婚禮早直,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘市框。我一直安慰自己霞扬,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,862評論 6 386
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著喻圃,像睡著了一般萤彩。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上斧拍,一...
    開封第一講書人閱讀 50,050評論 1 291
  • 那天雀扶,我揣著相機(jī)與錄音,去河邊找鬼肆汹。 笑死愚墓,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的昂勉。 我是一名探鬼主播浪册,決...
    沈念sama閱讀 39,136評論 3 410
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼岗照!你這毒婦竟也來了议经?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 37,882評論 0 268
  • 序言:老撾萬榮一對情侶失蹤谴返,失蹤者是張志新(化名)和其女友劉穎煞肾,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體嗓袱,經(jīng)...
    沈念sama閱讀 44,330評論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡籍救,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,651評論 2 327
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了渠抹。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片蝙昙。...
    茶點(diǎn)故事閱讀 38,789評論 1 341
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖梧却,靈堂內(nèi)的尸體忽然破棺而出奇颠,到底是詐尸還是另有隱情,我是刑警寧澤放航,帶...
    沈念sama閱讀 34,477評論 4 333
  • 正文 年R本政府宣布烈拒,位于F島的核電站,受9級特大地震影響广鳍,放射性物質(zhì)發(fā)生泄漏荆几。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 40,135評論 3 317
  • 文/蒙蒙 一赊时、第九天 我趴在偏房一處隱蔽的房頂上張望吨铸。 院中可真熱鬧,春花似錦祖秒、人聲如沸诞吱。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,864評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽房维。三九已至鸭栖,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間握巢,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,099評論 1 267
  • 我被黑心中介騙來泰國打工松却, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留暴浦,地道東北人。 一個月前我還...
    沈念sama閱讀 46,598評論 2 362
  • 正文 我出身青樓晓锻,卻偏偏與公主長得像歌焦,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子砚哆,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,697評論 2 351

推薦閱讀更多精彩內(nèi)容