我们在日常的开发的过程中,经常需要前端测试发送请求测试一些数据。但是由于一些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. nodejs - http.request是否有超时

    默认没有.那么,req.setTimeout(msec, callback)是干什么用的. 它的意思是 socket msec 没有活动后执行callback,不帮你关闭连接. 就像一个秒表,每收到数 ...

  2. 抢先体验! 在浏览器里写 Flutter 是一种什么体验?

    Invertase 是一间位于英国的开源软件制作公司.主要构建关于开发者工具.SDK 等应用程序,早在 Flutter 2.2 的时候,Invertase 团队就开始帮助构建和贡献 Firebase ...

  3. Scala的基础用法 和 Java相对应学习(二)变量、循环、语法

    一.配置相关环境 1.增加项目 在idea里面创建新的maven项目 2. 在pom文件中增加依赖 <?xml version="1.0" encoding="UT ...

  4. 图文并茂演示小程序movable-view的可移动范围

    前言 开发过小程序的同学可能对这两个内置组件并不陌生,他们配合用来实现在页面中可以拖拽滑动,其中: movable-area表示元素可移动的区域,它决定元素移动的区域范围 movable-view表示 ...

  5. 使用OnPush和immutable.js来提升angular的性能

    angular里面变化检测是非常频繁的发生的,如果你像下面这样写代码 <div> {{hello()}} </div> 则每次变化检测都会执行hello函数,如果hello函数 ...

  6. python 生成Windows快捷方式

    此处以虚拟机镜像快捷方式为例 link_filepath:快捷方式的生成路径 win32_cmd:需要执行的应用程序 arg_str:exe的参数 快捷方式的目标:由win32_cmd + arg_s ...

  7. Splash (渲染JS服务)介绍安装

    一. splash介绍 1.Splash 是一个带有 HTTP API 的 javascript 渲染服务.它是一个带有 HTTP API 的轻量级浏览器,使用 Twisted 和 QT5 在 Pyt ...

  8. 使用Python3.7+Tornado5.1配合七牛云存储api来异步切分上传文件

    原文转载自「刘悦的技术博客」https://v3u.cn/a_id_123 之前写了几篇关于FastDfs分布式存储的文章:python3.7.3操作FastDfs来进行文件操作,其实市面上关于云存储 ...

  9. 恭喜社区喜提三枚新 Committer!

    点击上方 蓝字关注我们 ✎ 编 者 按 Apache DolphinScheduler 社区最近又迎来三位新的 Committer,凭借对社区的高质量贡献,社区很荣幸地邀请他们加入 Committer ...

  10. ajax.readyState与ajax.status一览

    ajax.readyState 0 -(未初始化)还没有调用send()方法 1 -(载入)已调用send()方法,正在发送请求 2 -(载入完成)send()方法执行完成,已经接收到全部响应内容 3 ...