首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

一个兼容get请求和post请求Ajax封装函数

今天在看某风网老师录制 Ajax 函数封装视频,get 和 post 请求都考虑到了,我在这里也做一下笔记。 我把考虑到都备注上了,以往可以给大家一点参考。...代码如下: JavaScript: function ajax(method, url, data, callback) { // method:请求方式,url:请求地址,data:数据,callback...") { //如果是get请求         data = true;     };     var xhr = null;     // 创建异步请求     if (window.XMLHttpRequest...            } else {                 alert("错误状态!")             ...}         })     } 声明:本文由w3h5原创,转载请注明出处:《一个兼容get请求和post请求Ajax封装函数》 https://www.w3h5.com/post

1.6K10
您找到你想要的搜索结果了吗?
是的
没有找到

Ajax请求过程显示“进度”简单实现

在进行Ajax调用过程中一般都具有这样做法:显示一个GIF图片动画表明后台正在工作,同时阻止用户操作本页面(比如Ajax请求通过某个按钮触发,用户不能频繁点击该按钮产生多个并发Ajax请求);调用完成后...以下图为例,页面通过一个Load链接以Ajax请求方式加载数据(左)。...当用户点击该链接之后,Ajax请求开始,GIF图片显示“Loading“状态,同时当前页面被“罩住”防止用户继续点击Load按钮();Ajax请求完成被返回响应结果,结果被呈现出来同时,GIF图片和...在这里我同样以ASP.NET MVC应用为例,提供一种简单实现方式。我们GIF图片和作为遮罩定义在布局文件,并为它们定制了相应CSS。...jQuery定义了另一个实现Ajax调用方法ajax2,该方法依然调用$.ajax(options)实现Ajax调用。

1.9K90

Flask RESTful API 简单设计一个 GET 请求接口

,这个与flask设计表结构写法是一致,用到flaskflask-sqlalchemy 数据库迁移文件migrate.py 使用Flask-Migrate和Flask-Script来实现数据迁移...alembic.ini ├── env.py ├── script.py.mako └── versions └── 79d73a8da1cf_.py Flask-RESTful接口实现app.py 先给出代码..., data=None, status=0) 定义一个Common,来统一响应数据格式 处理请求 Flask-RESTfulreqparse用于获取并转化客户端输入参数 parser = reqparse.RequestParser...True) # parser.add_argument('user_nickname') parser.add_argument('image_name', required=True) 上面代码定义了一个请求数据分析转化器...代码里面没有用到,这个是post,delete等请求会用到,就是增删改用 处理响应 Flask-RESTfulfields用于规范响应字段,定制响应字段键名和键值数据类型,还可以对输出响应做更多复杂处理

6.1K50

通过jquery$.getJSON自己做一个跨域ajax请求试验

jquery提供了.getJSON方法,让我们可以实现跨域ajax请求,但jqueryAPI上内容实在太少,如何用.getJSON,请求网站应该返回怎样数据库才能让   我后端是用php,以下代码主要实现一个功能就是提供一个预约登记接口.../*预约登记 执行 接口*/ case "yuyue_interface": $name = trim($_GET['name']); $phone = trim($_GET['phone']);...$addr = trim($_GET['addr']); $dt = date("Y-m-d H:i:s"); $cb = $_GET['callback']; if($name == "" |...”也输出来,如: $cb = $_GET['callback']; echo $cb."({code:".json_encode(4)...."})";   以上就是一个简单.getJSON试验,通过这个试验,我们可以学到如何用.getJSON,也能学到如何做一个接口让别人跨域请求

1.7K20

Ajax请求SpringMVC Json数据报错Http 400(二)

Ajax请求SpringMVC Json数据报错Http 400(二) 作者:幽鸿   Apr 15, 2016 9:54:50 PM 二、前台看http 400 Bad Request...错误     我们最常见http错误恐怕就是404 not found错误了,这回碰到400 bad request错误。...这个400错误又称语法请求错误。就是说我们请求语法是不被服务器所正确解析。那么问题来了,看官可能要说,这么简单一个ajax请求为什么不被spring mvc解析呢?    ...请看我注释这一行:contentType : 'application/json',如果注释掉这一行,这个请求就会success了,如果打开注释就会报如题400错误。...在浏览器中观察RequestHeaders,会发现jquery “.ajax”方法默认Content-Type如下: Content-Type: application/x-www-form-urlencoded

2.1K40

JS实现ajax和同源策略

一、jQuery实现ajax 首先说一下ajax优缺点 优点: AJAX使用Javascript技术向服务器发送异步请求AJAX无须刷新整个页面; 因为服务器响应内容不再是整个页面,而是页面局部...send()方法参数为POST请求参数,即对应HTTP协议请求体内容,若是GET请求,需要在URL后连接参数。 注意:若没有参数,需要给出null为参数!...7.2 案例分析 页面给出注册表单; 在username表单字段添加onblur事件,调用send()方法; send()方法获取username表单字段内容,向服务器发送异步请求,参数为username...如果非同源,那么在请求数据时,浏览器会在控制台中报一个异常,提示拒绝访问。 jsonp(jsonpadding) 之前发ajax时候都是在自己给自己的当前项目下发 现在我们来实现跨域发。...,这是因为同源策略给限制了,这是游览器给我们报一个错 (但是注意,项目2访问已经发生了,说明是浏览器对非同源请求返回结果做了拦截。)

2.5K20

Ajax设置请求和接收响应、自己封装简易jQuery.Ajax、回调函数

Ajax设置请求和接收响应、自己封装简易jQuery.Ajax 这篇文章是承接前几篇博客,是前几篇继续学习 包括Ajax学习与理解和简化版自己实现jQuery等 这篇文章只算是我个人学习笔记,内容没有精心排版...3 客户端/服务器模型 客户端使用js设置请求四个部分, 服务器用nodejs也可以设置响应四个部分 ? ? 为什么要三次握手? 三次握手: A:我能连你了吗?...,在ajax函数传了一个successFN,failFn函数作为参数,但是执行时候是在别的地方执行(在request.onreadystatechange里) if(request.readyState...4真正jQuery.ajax()API如何使用 jQuery.ajax()API 例子 $.ajax({ type: "GET", url: "/test", dataType: "script...5函数传不同参数 例如文档里 jQuery.ajax( url [, settings ] ) jQuery.ajax( [settings ] ) jQuery.ajax一个参数既可以是url

2.6K50

只知道ajax?你已经out了

随着前端技术发展,请求服务器数据方法早已不局限于ajaxjQueryajax方法。各种js库已如雨后春笋一般,蓬勃发展,本文主要想介绍其中axios和fetch。...在我之前文章,介绍过ajax创建过程,可以移步这次,我们聊聊ajax创建过程。 当然项目中我们一般没有直接使用原生ajax,而是使用javascript各种库,例如jQuery。...所以本文将介绍两个目前常用获取服务器数据js库:axios和fetch。 1.axios 是一个基于 Promise HTTP 库,可以用在浏览器和 node.js 。...2.2 fetch优点及需要注意地方 为什么要使用fetch呢?直接使用jQuery和axios也能满足我们开发需要。...、输出和用事件来跟踪状态混杂在一个对象里; 更好更方便写法; 需要注意是: 兼容性; 当服务器返回400、500等错误码时并不会reject,只有网络错误等导致请求不能完成时,fetch才会被reject

3.6K571

一、爬虫基本体系和urllib基本使用 先进行一个简单实例:利用有道翻译(post请求)另外一个简单小实例是:豆瓣网剧情片排名前20电影(Ajax请求

爬虫分类   传统爬虫从一个或若干初始网页URL开始,获得初始网页上URL,在抓取网页过程,不断从当前页面上抽取新URL放入队列,直到满足系统一定停止条件。...端口是一个l6位数卞,用来辨识不同服务。Http请求一般默认都是80端口。      3) 一旦建立连接,客户端向服务器发送一个http请求,服务器接收到请求后,返回响应结果给客户端。     ...异常处理模块   urllib.parse url解析模块   urllib.robotparser robots.txt解析模块 先进行一个简单实例:利用有道翻译(post请求) 1 #引入模块...38 所以如果我们添加data参数时候就是以post请求方式请求,如果没有data参数就是get请求方式 39 ''' 40 data =urllib.parse.urlencode(form_data...:豆瓣网剧情片排名前20电影(Ajax请求) 1 import urllib.request 2 import urllib.parse 3 import json 4 5 url = '

1.1K40

异步编程Ajax详解,并对其进行封装整理

含义 100 ~ 199 连接继续 200 ~ 299 各种成功请求 300 ~ 399 重定向 400 ~ 499 客户端错误 500 ~ 599 服务端错误 (2)xhr基本使用 在使用xhr...请求 上面也讲解了Ajax请求简单应用,同时也是拿 get 请求来举得例子,因此这里我就不多做说明,唯一要讲就是,get请求所携带数据是明文,大小只有4k左右,而且它是写在URL ?...文章开头提到,JQuery早已对Ajax请求进行了成熟封装,所以我们可以借鉴它,甚至尽可能地去模仿它进行封装,在这之前,我们得先了解JQueryAjax使用 (1)JQueryAjax 这里我找来了几段使用...方法 在JQuery还有一个 ajax 方法,其既可以发送 get 请求,也可以发送 post 请求,该方法可传入多种参数,且支持 promise 处理回调函数 let $ = { createXHR...现在大部分浏览器几乎都支持了在发送Ajax请求后,自动向请求头部添加当前源信息 六、结束语 建议你们好好了解JSAjax使用,这样在面试问起来你还能说出个一二三,并且有时候面试官还会直接让你亲手写一个简单

1.6K20

为什么说在Android请求权限从来都不是一件简单事情?

等待时间一时兴起,突然想写一篇原创,聊一聊我自己在写Android权限请求代码时一些技术心得。 正如这篇文章标题所描述一样,在Android请求权限从来都不是一件简单事情。为什么?...到现在为止,我们才算是把一个简单权限请求流程用比较完善方式处理完毕。然而代码写到这里真的还算是简单吗?每次申请运行时权限,都要写这么长长一段代码,你真的受得了吗?...这也就是我编写PermissionX这个开源库原因,在Android请求权限从来都不是一件简单事情,但它不应该如此复杂。...PermissionX将请求运行时权限时那些应该考虑复杂逻辑都封装到了内部,只暴露最简单接口给开发者,从而让大家不需要考虑上面我所讨论那么多场景。...()回调即可保证已经得到了所有请求权限授权,调用takePicture()方法开始拍照即可。

1.2K10

Django之json、Ajax简介及实例介绍

AJAX除了异步特点外,还有一个就是:浏览器页面局部刷新;(这一特点给用户感受是在不知不觉完成请求和响应过程) js实现局部刷新: <!...当文件框发生了输入变化时,浏览器会使用AJAX技术向服务器发送一个请求,查询包含“传”字前10个关键字,然后服务器会把查询到结果响应给浏览器,最后浏览器把这4个关键字显示在下拉列表。...send()方法参数为POST请求参数,即对应HTTP协议请求体内容,若是GET请求,需要在URL后连接参数。 注意:若没有参数,需要给出null为参数!...页面给出注册表单; 在username表单字段添加onblur事件,调用send()方法; send()方法获取username表单字段内容,向服务器发送异步请求,参数为username; django...如果非同源,那么在请求数据时,浏览器会在控制台中报一个异常,提示拒绝访问。

6.6K20

Django跨域(前端跨域)

,而是页面局部,所以AJAX性能高; jQuery实现ajax index.html Views.py ajax参数 请求参数 ######################------...) 其实AJAX就是在Javascript多添加了一个对象:XMLHttpRequest对象。...send()方法参数为POST请求参数,即对应HTTP协议请求体内容,若是GET请求,需要在URL后连接参数。 注意:若没有参数,需要给出null为参数!...7.2 案例分析 页面给出注册表单; 在username表单字段添加onblur事件,调用send()方法; send()方法获取username表单字段内容,向服务器发送异步请求,参数为username...如果非同源,那么在请求数据时,浏览器会在控制台中报一个异常,提示拒绝访问。 jsonp(jsonpadding) 之前发ajax时候都是在自己给自己的当前项目下发 现在我们来实现跨域发。

7.8K30

高级前端:详解手写原生Ajax实现

含义 100 ~ 199 连接继续 200 ~ 299 各种成功请求 300 ~ 399 重定向 400 ~ 499 客户端错误 500 ~ 599 服务端错误 (2)xhr基本使用 在使用xhr...请求 上面也讲解了Ajax请求简单应用,同时也是拿 get 请求来举得例子,因此这里我就不多做说明,唯一要讲就是,get请求所携带数据是明文,大小只有4k左右,而且它是写在URL ?...文章开头提到,JQuery早已对Ajax请求进行了成熟封装,所以我们可以借鉴它,甚至尽可能地去模仿它进行封装,在这之前,我们得先了解JQueryAjax使用 (1)JQueryAjax 这里我找来了几段使用...方法 在JQuery还有一个 ajax 方法,其既可以发送 get 请求,也可以发送 post 请求,该方法可传入多种参数,且支持 promise 处理回调函数 let $ = { createXHR...现在大部分浏览器几乎都支持了在发送Ajax请求后,自动向请求头部添加当前源信息 六、结束语 建议你们好好了解JSAjax使用,这样在面试问起来你还能说出个一二三,并且有时候面试官还会直接让你亲手写一个简单

1.6K20

jQuery Ajax 全解析

废话少说,直接进入正题,我们先来看一些简单方法,这些方法都是对jQuery.ajax()进行封装以方便我们使用方法,当然,如果要处理复杂逻辑,还是需要用到jQuery.ajax()(这个后面会说到...callback (Function) : (可选) 载入成功时回调函数(只有当Response返回状态是success才是调用该方法)。 这是一个简单 GET 请求功能以取代复杂 .ajax 。...其实应该为客户端请求类型(JSON,XML,等等) 这是一个简单 POST 请求功能以取代复杂 .ajax请求成功时可调用回调函数。如果需要在出错时执行函数,请使用 .ajax。...jQuery官方给出完整Ajax事件列表: ajaxStart (Global Event) This event is broadcast if an Ajax request is started...简单易用高层实现见 $.get, $.post 等。 $.ajax() 返回其创建 XMLHttpRequest 对象。大多数情况下你无需直接操作该对象,但特殊情况下可用于手动终止请求

9.5K10

jQuery ajax() 方法

.ajaxError() 当 Ajax 请求完成且出现错误时注册要调用处理程序。这是一个 Ajax 事件。 .ajaxSend() 在 Ajax 请求发送之前显示一条消息。...jQuery.ajaxSetup() 设置将来 Ajax 请求默认值。 .ajaxStart() 当首个 Ajax 请求完成开始时注册要调用处理程序。这是一个 Ajax 事件。...callback (Function) :(可选) 载入成功时回调函数(只有当Response返回状态是success才是调用该方法)。 这是一个简单 GET 请求功能以取代复杂 $.ajax 。...其实应该为客户端请求类型(JSON,XML,等等) 这是一个简单 POST 请求功能以取代复杂 $.ajax请求成功时可调用回调函数。如果需要在出错时执行函数,请使用 $.ajax。...简单易用高层实现见 $.get, $.post 等。 $.ajax() 返回其创建 XMLHttpRequest 对象。大多数情况下你无需直接操作该对象,但特殊情况下可用于手动终止请求

2.5K60
领券