【前端】在浏览器控制台,直接发Ajax请求
我们在日常的开发的过程中,经常需要前端测试发送请求测试一些数据。但是由于一些session,cookie的存在,我们无法在postman上创建一些会话。那么这样,我们就可以在浏览器上直接发送Ajax请求
XMLHttpRequest 是 AJAX 的基础。我们直接利用XMLHttpRequest构建请求。
function ajax(req){
var xhr=new XMLHttpRequest();
xhr.onreadystatechange=function(){
if(xhr.readyState===4){
req.success&&req.success(xhr.responseText,xhr.status);
}
}
req.method=req.method?req.method.toUpperCase():'GET';
var data=null;
var url=req.url;
if(req.data){
var arg='';
for(var n in req.data){
arg+=n+'='+encodeURIComponent(req.data[n])+'&'
}
arg=arg.slice(0,-1);
if(req.method==='GET'){
url=url+'?'+arg;
}else{
data=arg;
}
}
if(req.headers){
for(var h in req.headers){
var v=req.headers[h];
xhr.setRequestHeader(h,v);
}
}
xhr.open(req.method,url);
xhr.send(data);
}
// 再进行访问
ajax({url:"https://i.cnblogs.com/api/user",method:"GET",data:{},headers:{},success:function(res){console.log(res)}})

【前端】在浏览器控制台,直接发Ajax请求的更多相关文章
- JS 点击元素发ajax请求 打开一个新窗口
JS 点击元素发ajax请求 打开一个新窗口 经常在项目中会碰到这样的需求,点击某个元素后,需要发ajax请求,请求成功以后,开发需要把链接传给前端(或者说请求成功后打开新窗口),前端需要通过新窗口打 ...
- chrome 等浏览器不支持本地ajax请求的问题
chrome 等浏览器不支持本地ajax请求的问题 XMLHttpRequest cannot load file:///D:/WWW/angularlx/ui-router-test/templat ...
- springmvc 前端 发ajax请求的几种方式
一.传json单值或对象 1.前端 var data = {'id':id,'name':name}; $.ajax({ type:"POST", url:"user/s ...
- [Web 前端] 如何在React中做Ajax 请求?
cp from : https://segmentfault.com/a/1190000007564792 如何在React中做Ajax 请求? 首先:React本身没有独有的获取数据的方式.实际上, ...
- react生命周期函数的应用-----1性能优化 2发ajax请求
知识点1:每次render其实就会将jax的模板生成一个虚拟dom,跟上一个虚拟dom进行比对,通过diff算法找出不同,再更新到真实dom上去. 1性能优化 每次父组件render一次(除了第一次初 ...
- 如何解决chrome 等浏览器不支持本地ajax请求的问题
XMLHttpRequest cannot load file:///D:/WWW/angularlx/ui-router-test/template/content.html. Cross orig ...
- chrome 等浏览器不支持本地ajax请求,的问题
XMLHttpRequest cannot load file:///D:/WWW/angularlx/ui-router-test/template/content.html. Cross orig ...
- 解决火狐浏览器发送jquery的ajax请求无效的问题
今天遇到这样一个问题: 页面在chrome下发送ajax的请求是没有问题的,但是在firfox下无效. 代码大致如下: //前面省略 <form> ..... <button cla ...
- 当可以设置src时,不必发ajax请求,如果没有参数设置src即可
var params = (function(obj){ var string = []; for(var key in obj){ string.push(window.encodeURI(key) ...
随机推荐
- 我是如何将一个老系统的kafka消费者服务的性能提升近百倍的
☞☞☞ 我是如何将一个老系统的kafka消费者服务的性能提升近百倍的 ☜☜☜ ○○○○○○○○○○○○○○○ 大家好,又见面了~ kafka作为一种高吞吐量的分布式发布订阅消息系统,在业务系统中被广泛 ...
- Tapdata PDK 生态共建计划启动!Doris、OceanBase、PolarDB、SequoiaDB 等十余家厂商首批加入
2022年4月7日,Tapdata 正式启动 PDK 插件生态共建计划,致力于全面连接数据孤岛,加速构建更加开放的数据生态,以期让各行各业的使用者都能释放数据的价值,随时获取新鲜的数据.截至目前, ...
- shell查询prometheus数据
#shell查询prometheus数据 shell使用curl调用HTTP API执行PromQL /api/v1/query查询某一时刻的数据 查询条件PromSQL复杂时, 传入接口/api/v ...
- 2022徐特立科学营&BIT机器人队电控课程讲义
目录 \(\cdot\)电控简介 \(\cdot\)认识单片机 什么是单片机 时钟-单片机的脉搏 \(\cdot\)外设及应用 GPIO PWM 定时器 UART \(\cdo ...
- 手动从0搭建ABP框架-ABP官方完整解决方案和手动搭建简化解决方案实践
本文主要讲解了如何把ABP官方的在线生成解决方案运行起来,并说明了解决方案中项目间的依赖关系.然后手动实践了如何从0搭建了一个简化的解决方案.ABP官方的在线生成解决方案源码下载参考[3],手动搭 ...
- reduce累加实现
与map端的模式类似,map端要重写Mapper方法,reduce端也要重写Reduce方法,这里有一个泛型,我们先看参数类型 分别对应输入keyin,valuein,keyout,valueout. ...
- php date函数和首位带0问题
一.带零 echo date('Y-m-d'); 2012-08-08 二.不带零 echo date('Y-n-j'); 2012-8-8 以下为参数详解(转载): a - "am&quo ...
- springboot的@ConditionalOnClass注解
大家好,我是"良工说技术". 今天给大家带来的是springboot中的@ConditionalOnClass注解的用法.上次的@ConditionalOnBean注解还记得吗? ...
- 内存问题难定位,那是因为你没用ASAN
摘要:ASAN全称:Address Sanitizer,google发明的一种内存地址错误检查器.目前已经被集成到各大编译器中. 本文分享自华为云社区<内存定位利器-ASAN使用小结>,作 ...
- doc或docx(word)或image类型文件批量转PDF脚本
doc或docx(word)或image类型文件批量转PDF脚本 1.实际生产环境中遇到文件展示只能适配PDF版本的文件,奈何一万个文件有七千个都是word或者image类型的,由此搞个脚本批量转换下 ...