柚子快報(bào)邀請(qǐng)碼778899分享:尚硅谷Ajax筆記
柚子快報(bào)邀請(qǐng)碼778899分享:尚硅谷Ajax筆記
一天拿下
介紹二級(jí)目錄三級(jí)目錄
b站鏈接
介紹
ajax優(yōu)缺點(diǎn) http
node.js下載配置好環(huán)境
express框架 切換到項(xiàng)目文件夾,執(zhí)行下面兩條命令 有報(bào)錯(cuò),退出用管理員身份打開(kāi) 或者再命令提示符用管理員身份打開(kāi)
npm init --yes
npm i express
請(qǐng)求
ajax請(qǐng)求
post請(qǐng)求
//引入express
const express = require('express');
//創(chuàng)建應(yīng)用對(duì)象
const app = express();
//創(chuàng)建路由規(guī)則
//request對(duì)請(qǐng)求報(bào)文的封裝
//response是對(duì)響應(yīng)報(bào)文的封裝
app.get('/server',(request,response)=>{
//設(shè)置響應(yīng)頭 設(shè)置允許跨域
response.setHeader('Access-Control-Allow-Origin','*');
//設(shè)置響應(yīng)體
response.send('HELLO EXPRESS');
});
app.post('/server',(request,response)=>{
//設(shè)置響應(yīng)頭 設(shè)置允許跨域
response.setHeader('Access-Control-Allow-Origin','*');
//設(shè)置響應(yīng)體
response.send('HELLO AJAX POST');
});
//監(jiān)聽(tīng)端口啟動(dòng)服務(wù)
app.listen(8000,()=>{
console.log("服務(wù)已經(jīng)啟動(dòng),8000端口監(jiān)聽(tīng)中……");
});
設(shè)置請(qǐng)求頭
//設(shè)置請(qǐng)求頭
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
xhr.setRequestHeader('name','atguigu');
//發(fā)送
xhr.send('a=100 & b=200 &c=300');
app.all('/server',(request,response)=>{
//設(shè)置響應(yīng)頭 設(shè)置允許跨域
response.setHeader('Access-Control-Allow-Origin','*');
//響應(yīng)頭
response.setHeader('Access-Control-Allow-Hearders','*')
//設(shè)置響應(yīng)體
response.send('HELLO AJAX POST');
});
json數(shù)據(jù)響應(yīng)
//引入express
const express = require('express');
//創(chuàng)建應(yīng)用對(duì)象
const app = express();
//創(chuàng)建路由規(guī)則
//request對(duì)請(qǐng)求報(bào)文的封裝
//response是對(duì)響應(yīng)報(bào)文的封裝
app.get('/server',(request,response)=>{
//設(shè)置響應(yīng)頭 設(shè)置允許跨域
response.setHeader('Access-Control-Allow-Origin','*');
//設(shè)置響應(yīng)體
response.send('HELLO AJAX');
});
app.all('/server',(request,response)=>{
//設(shè)置響應(yīng)頭 設(shè)置允許跨域
response.setHeader('Access-Control-Allow-Origin','*');
//響應(yīng)頭
response.setHeader('Access-Control-Allow-Hearders','*')
//響應(yīng)一個(gè)數(shù)據(jù)
const data = {
name:'atguigu'
};
//對(duì)對(duì)象進(jìn)行字符串轉(zhuǎn)換
let str = JSON.stringify(data);
//設(shè)置響應(yīng)體
response.send(str);
});
//監(jiān)聽(tīng)端口啟動(dòng)服務(wù)
app.listen(8000,()=>{
console.log("服務(wù)已經(jīng)啟動(dòng),8000端口監(jiān)聽(tīng)中……");
});
nodemon 有報(bào)錯(cuò),退出軟件用管理員身份打開(kāi)
npm install -g nodemon
nodemon server.js
ie緩存
//引入express
const express = require('express');
//創(chuàng)建應(yīng)用對(duì)象
const app = express();
//創(chuàng)建路由規(guī)則
//request對(duì)請(qǐng)求報(bào)文的封裝
//response是對(duì)響應(yīng)報(bào)文的封裝
app.get('/server',(request,response)=>{
//設(shè)置響應(yīng)頭 設(shè)置允許跨域
response.setHeader('Access-Control-Allow-Origin','*');
//設(shè)置響應(yīng)體
response.send('HELLO AJAX');
});
app.all('/server',(request,response)=>{
//設(shè)置響應(yīng)頭 設(shè)置允許跨域
response.setHeader('Access-Control-Allow-Origin','*');
//響應(yīng)頭
response.setHeader('Access-Control-Allow-Hearders','*')
//響應(yīng)一個(gè)數(shù)據(jù)
const data = {
name:'atguigu'
};
//對(duì)對(duì)象進(jìn)行字符串轉(zhuǎn)換
let str = JSON.stringify(data);
//設(shè)置響應(yīng)體
response.send(str);
});
app.all('/json-server',(request,response)=>{
//設(shè)置響應(yīng)頭 設(shè)置允許跨域
response.setHeader('Access-Control-Allow-Origin','*');
//響應(yīng)頭
response.setHeader('Access-Control-Allow-Hearders','*')
//響應(yīng)一個(gè)數(shù)據(jù)
const data = {
name:'atguigu'
};
//對(duì)對(duì)象進(jìn)行字符串轉(zhuǎn)換
let str = JSON.stringify(data);
//設(shè)置響應(yīng)體
response.send(str);
});
app.get('/ie',(request,response)=>{
//設(shè)置響應(yīng)頭 設(shè)置允許跨域
response.setHeader('Access-Control-Allow-Origin','*');
//設(shè)置響應(yīng)體
response.send('HELLO IE');
});
//監(jiān)聽(tīng)端口啟動(dòng)服務(wù)
app.listen(8000,()=>{
console.log("服務(wù)已經(jīng)啟動(dòng),8000端口監(jiān)聽(tīng)中……");
});
超時(shí)與網(wǎng)絡(luò)異常
app.get('/delay',(request,response)=>{
//設(shè)置響應(yīng)頭 設(shè)置允許跨域
response.setHeader('Access-Control-Allow-Origin','*');
setImmeout(()=>{
//設(shè)置響應(yīng)體
response.send('延時(shí)響應(yīng)');
},3000);
});
取消請(qǐng)求
請(qǐng)求重復(fù)發(fā)送問(wèn)題
怎么感覺(jué)學(xué)的迷迷糊糊的…… emo中
我還會(huì)回來(lái)的……
二級(jí)目錄
三級(jí)目錄
柚子快報(bào)邀請(qǐng)碼778899分享:尚硅谷Ajax筆記
好文鏈接
本文內(nèi)容根據(jù)網(wǎng)絡(luò)資料整理,出于傳遞更多信息之目的,不代表金鑰匙跨境贊同其觀點(diǎn)和立場(chǎng)。
轉(zhuǎn)載請(qǐng)注明,如有侵權(quán),聯(lián)系刪除。