当前位置: 首页 > news >正文

发送网络请求

原生Ajax

1.新建请求(XMLHttpRequest对象)

const aj = new XMLHttpRequest()

2.开启请求

aj.open('GET/POST','URL')

3.发送请求

aj.send()

4.接受响应(通过监听事件onreadystatechange是否执行完毕)

aj.onreadystatechange = function(){ 

        if(aj.readyState(事件进展) === XMLHttpRequest.Done $$ aj.status(状态码) === 200)

{

        console.log(aj.responseText)

        JSON.parse(aj.responseText)(将字符串转为JavaScript对象)

}

}

注:get请求传入参数通过URL后接上 问号 参数名 = 参数值 & 参数名 = 参数值 的形式传入

Post请求传入参数发生在使用send()中,且需要设置响应头对发送内容进行声明

aj.setRequestHeader(‘Content-Type’,'application')

Axios

1.引入Axios

2.发送请求

axios.get('URL'),{        params:{键名=键值}        }

baseURL简约:const ins = axios.create({        baseURL:'  '        }) 

ins.get('URL-baseURL')

3.拦截器(请求发送到服务端前或响应返回到客户端前)

请求:ins.interceptors.request.use(config => {    return config    })

响应:ins.interceptors.response.use(res => {    return res    })

Fetch API

1.get发送请求

const get = fetch('URL')

2.get处理返回数据

fh.then(res=>{

        if(res.ok){

        return res.json()(将结果直接转为对象并返回)

}

})

fh.data(data=>{

console.log(data)

})

3.post发生请求

const fetch('URL',{        method:'POST',

                                           headers:{

                                                                'Content-Type:''application/json'

                                                              },

                                        body:JSON.stringify({

                                                  键名:键值    

                                                })

                                        }

                        )

.then(res=>{        

                        return res.json()        

})

.then(data=>{

                        console.log(data)

})

相关文章:

  • 《无尽的尽头》今日开播 刘家祎大胆演绎林磊儿的“另一面”
  • RAG(检索增强生成)技术详解与应用实践:从原理到落地
  • 简单几步,开启 Intel VT-x 让电脑“解开CPU封印”
  • 蓝桥杯 20. 压缩变换
  • 数据分析之 商品价格分层之添加价格带
  • 欧姆龙NJ系列PLC通讯
  • vue3-springboot-mysql的docker部署
  • 怎么实现RAG检索相似文档排序:similarities
  • 云蝠智能大模型呼叫:AI驱动的通信服务革新与实践
  • 操作系统---进程同步与互斥
  • 【频谱分析仪与信号分析仪】异同比较
  • Unity后处理全解析:从入门到优化
  • 《Linux程序设计》实验8 线程程序设计
  • vulkanscenegraph显示倾斜模型(6)-帧循环
  • RTS 如何使用流控方式自动实现收发
  • 【每天一个知识点】熵(Entropy)
  • SpringBoot入门实战(项目搭建、配置、功能接口实现等一篇通关)
  • 【KWDB 创作者计划】_上位机知识篇---Github
  • 什么是公链?公链项目有哪些?公链项目开发
  • 【OSG学习笔记】Day 8: 纹理贴图——赋予模型细节
  • 机票搜索热度飙升,透过数据看五一假期旅游热度
  • 南宁市委常委、组织部部长陈川已任广西医科大学党委书记
  • 王鹏任海南文昌市委书记
  • 法治日报:强制统一店铺广告牌匾事件何以频发?
  • 聚焦“共赢蓝色未来” “海洋命运共同体”上海论坛举行
  • 校友伉俪捐赠10亿元!成立复旦大学学敏高等研究院