成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

jQuery + koa2 實(shí)現(xiàn)簡單的Ajax請求

leeon / 2074人閱讀

摘要：前言之前寫代碼只管前端的實(shí)現(xiàn)，感覺這樣導(dǎo)致自己對的請求的理解不夠深入，所以寫了這個(gè)從前端到后端的實(shí)現(xiàn)小，分別實(shí)現(xiàn)簡單的和請求，加深下對前后端交互的理解。

前言

之前寫Ajax代碼只管前端的實(shí)現(xiàn)，感覺這樣導(dǎo)致自己對Ajax的請求的理解不夠深入，所以寫了這個(gè)從前端到后端的Ajax實(shí)現(xiàn)小demo，分別實(shí)現(xiàn)簡單的GET和POST請求，加深下對前后端交互的理解。

技術(shù)棧

koa2
jQuery

需求

某些邏輯可以直接在前端處理，這里發(fā)給后端處理是為了更好地理解Ajax請求。

POST

通過填寫編號和姓名并發(fā)送POST請求來保存人員信息，當(dāng)信息未填寫或填寫不正確時(shí)給出格式錯(cuò)誤的提醒；當(dāng)信息填寫正確但編號已存在時(shí)給出編號已存在的提醒；當(dāng)信息填寫正確且編號不存在時(shí)顯示保存成功。

GET

通過填寫編號并發(fā)送GET請求來查詢?nèi)藛T信息，當(dāng)編號未填寫或填寫不正確時(shí)給出格式錯(cuò)誤的提醒；當(dāng)編號填寫正確且編號已存在時(shí)返回人員信息；當(dāng)信息填寫正確但編號不存在時(shí)顯示人員不存在的錯(cuò)誤提醒。

文件列表

dist

index.html

index.js

server.js

router.js

前端實(shí)現(xiàn) html頁面

index.html，簡單的html頁面，通過點(diǎn)擊按鈕發(fā)送json格式的Ajax請求:




  
  Document
  


  

    
Hello World

    
    
    
    
    
    
    
    
    

    

    

  

  
  


查詢數(shù)據(jù)：






保存數(shù)據(jù)：




再次查詢數(shù)據(jù)：




至此，一個(gè)完整的Ajax請求demo就完成了。

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/93168.html

相關(guān)文章

  • iKcamp團(tuán)隊(duì)制作｜基于Koa2搭建Node.js實(shí)戰(zhàn)（含視頻）? 路由koa-router

    路由koa-router——MVC 中重要的環(huán)節(jié)：Url 處理器 ?? iKcamp 制作團(tuán)隊(duì) 原創(chuàng)作者：大哼、阿干、三三、小虎、胖子、小哈、DDU、可木、晃晃 文案校對：李益、大力萌、Au、DDU、小溪里、小哈 風(fēng)采主播：可木、阿干、Au、DDU、小哈 視頻剪輯：小溪里 主站運(yùn)營：給力xi、xty 教程主編：張利濤 視頻地址：https://www.cctalk.com/v/151...

    netmou 評論0 收藏0

  • Koa2框架利用CORS完成跨域ajax請求

    摘要：目前代碼如下到現(xiàn)在為止，可以對跨域請求進(jìn)行響應(yīng)了，但是該域下的不會(huì)被攜帶在請求頭中。調(diào)整后順序如下這樣就減少了多余的響應(yīng)頭。 實(shí)現(xiàn)跨域ajax請求的方式有很多，其中一個(gè)是利用CORS，而這個(gè)方法關(guān)鍵是在服務(wù)器端進(jìn)行配置。 本文僅對能夠完成正?？缬騛jax響應(yīng)的，最基本的配置進(jìn)行說明（深層次的配置我也不會(huì)）。 CORS將請求分為簡單請求和非簡單請求，可以簡單的認(rèn)為，簡單請求就是沒有加上額...

    Jrain 評論0 收藏0

  • 通過koa2和Promise.race()構(gòu)造一個(gè)超時(shí)取消的ajax。

    摘要：上說你可以使用構(gòu)造函數(shù)創(chuàng)建一個(gè)新的對象。使用對象完成與請求的通信。服務(wù)端使用重要的點(diǎn)在于不能直接使用這樣返回給前端會(huì)直接報(bào)錯(cuò)。前端的代碼要注意的第三個(gè)參數(shù)設(shè)置成將請求設(shè)置為異步，然后由于超時(shí)會(huì)取消請求，所以這里根本不需要來顯式的取消請求 MDN上說： 你可以使用AbortController.AbortController()構(gòu)造函數(shù)創(chuàng)建一個(gè)新的AbortController對象。 使...

    e10101 評論0 收藏0

  • nodejs爬蟲項(xiàng)目實(shí)戰(zhàn)

    摘要：四爬蟲功能制作是來使用的庫，它的使用方法與差不多，我們通過它發(fā)起請求，在回調(diào)函數(shù)中輸出結(jié)果。第一步得到一個(gè)的實(shí)例第二步定義監(jiān)聽事件的回調(diào)函數(shù)。 這篇文章主要介紹了NodeJS制作爬蟲的全過程，包括項(xiàng)目建立，目標(biāo)網(wǎng)站分析、使用superagent獲取源數(shù)據(jù)、使用cheerio解析、使用eventproxy來并發(fā)抓取每個(gè)主題的內(nèi)容等方面，有需要的小伙伴參考下吧。showImg(http:/...

    xcold 評論0 收藏0

發(fā)表評論

0條評論

閱讀需要支付1元查看
<