我们在日常的开发的过程中,经常需要前端测试发送请求测试一些数据。但是由于一些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请求的更多相关文章

  1. JS 点击元素发ajax请求 打开一个新窗口

    JS 点击元素发ajax请求 打开一个新窗口 经常在项目中会碰到这样的需求,点击某个元素后,需要发ajax请求,请求成功以后,开发需要把链接传给前端(或者说请求成功后打开新窗口),前端需要通过新窗口打 ...

  2. chrome 等浏览器不支持本地ajax请求的问题

    chrome 等浏览器不支持本地ajax请求的问题 XMLHttpRequest cannot load file:///D:/WWW/angularlx/ui-router-test/templat ...

  3. springmvc 前端 发ajax请求的几种方式

    一.传json单值或对象 1.前端 var data = {'id':id,'name':name}; $.ajax({ type:"POST", url:"user/s ...

  4. [Web 前端] 如何在React中做Ajax 请求?

    cp from : https://segmentfault.com/a/1190000007564792 如何在React中做Ajax 请求? 首先:React本身没有独有的获取数据的方式.实际上, ...

  5. react生命周期函数的应用-----1性能优化 2发ajax请求

    知识点1:每次render其实就会将jax的模板生成一个虚拟dom,跟上一个虚拟dom进行比对,通过diff算法找出不同,再更新到真实dom上去. 1性能优化 每次父组件render一次(除了第一次初 ...

  6. 如何解决chrome 等浏览器不支持本地ajax请求的问题

    XMLHttpRequest cannot load file:///D:/WWW/angularlx/ui-router-test/template/content.html. Cross orig ...

  7. chrome 等浏览器不支持本地ajax请求,的问题

    XMLHttpRequest cannot load file:///D:/WWW/angularlx/ui-router-test/template/content.html. Cross orig ...

  8. 解决火狐浏览器发送jquery的ajax请求无效的问题

    今天遇到这样一个问题: 页面在chrome下发送ajax的请求是没有问题的,但是在firfox下无效. 代码大致如下: //前面省略 <form> ..... <button cla ...

  9. 当可以设置src时,不必发ajax请求,如果没有参数设置src即可

    var params = (function(obj){ var string = []; for(var key in obj){ string.push(window.encodeURI(key) ...

随机推荐

  1. 数组基础篇(对应C++ Primer plus 4.10)

    概要:数组是由一组同类型的元素组成的集合,在内存上是一片连续的存储空间.C++提供了三种数组的表示方法:普通数组,模板类vector(C++98 新增的标准模板库STL提供该模板类)和模板类array ...

  2. 基于.NetCore开发博客项目 StarBlog - (14) 实现主题切换功能

    系列文章 基于.NetCore开发博客项目 StarBlog - (1) 为什么需要自己写一个博客? 基于.NetCore开发博客项目 StarBlog - (2) 环境准备和创建项目 基于.NetC ...

  3. arcgis中nodata设为0及其小技巧

    一.arcgis中nodata设为0 两个栅格进行叠加,有时会有一部分没有数据,即用identify点击该区域,Value为NoDat a,而不是像其他非空区域一样有值. 此时注意nodata区域要赋 ...

  4. GRAPH CONVOLUTIONAL NETWORK WITH SEQUENTIAL ATTENTION FOR GOAL-ORIENTED DIALOGUE SYSTEMS

    面向领域特定目标的对话系统通常需要建模三种类型的输入,即(i)与领域相关的知识库,(ii)对话的历史(即话语序列)和(iii)需要生成响应的当前话语. 在对这些输入进行建模时,当前最先进的模型(如Me ...

  5. Docker安装canal、mysql进行简单测试与实现redis和mysql缓存一致性

    一.简介 canal [kə'næl],译意为水道/管道/沟渠,主要用途是基于 MySQL 数据库增量日志解析,提供增量数据订阅和消费. 早期阿里巴巴因为杭州和美国双机房部署,存在跨机房同步的业务需求 ...

  6. JAVA中计算两个日期时间的差值竟然也有这么多门道

    上半年春招的时候,作为面试官,对于面试表现的不错的同学会要求其写一小段代码看看.题目很简单: 给定一个日期,然后计算下距离今天相差的天数. 本以为这么个问题就是用来活跃面试氛围的,但是结果却让人大跌眼 ...

  7. pyhon推荐的命名规范

    类别 public Internal Modules(模块) low_with_under _low_with_under Packages(包) low_with_under   Classes(类 ...

  8. Java中修饰符的分类及用法

    访问权限修饰符: public 修饰class,方法,变量: 所修饰类的名字必须与文件名相同,文件中最多能有一个pulic修饰的类. private class不可用,方法,变量可以用: 只限于本类成 ...

  9. 浅谈spring-createBean

    目录 找到BeanClass并且加载类 实例化前 实例化 Supplier创建对象 工厂方法创建对象 方法一 方法二 推断构造方法 BeanDefionition 的后置处理 实例化后 属性填充 sp ...

  10. 面试突击68:为什么 TCP 需要 3 次握手?

    TCP 三次握手是一道经典的面试题,它是指 TCP 在传递数据之前,需要进行 3 次交互才能正式建立起连接,并进行数据传递. TCP 之所以需要 3 次握手是因为 TCP 双方都是全双工的.所谓全双工 ...