前端ajax的各种与后端交互的姿势
前端中常常用的与后端交换数据的话,通常是要用到ajax这种方法的
但是交互的方式有很多种,很多取决于你后端的属性,我这儿主要列举我目前项目比较常用的两种方式
--一个是我们通用的web api和控制器,
首先我们来仔细看看ajax来与webapi做的交互数据
这里先简单描述一下web api的四种属性--GET,POST,PUT,DELETE
这里面我永昌使用的是GET和POST
如果这时候我们需要用到AJAX与那些数据做后端交互的话
$.ajax({
url: "你的webapi",
type: "Get",
DATA{},//这里面写你要传给后端的数据,不过GET方法一般不需要,直接读就可以了
success: function (data) {
//成功后的return事件
}
error: function (data) {
alert("data");//请求错误后的报错事件(很重要,如果你报错了不知道哪儿要改的话这个可以帮助你,我个人感觉主要是500报错)
}
})
这种GET一般在网页初始化的时候从后端读取到一些数据然后赋给页面上(可能我的专业术语表达不标准,见谅QAQ)
然后我要讲的是POST方法
$.ajax({
url: "你的webapi",
type: "POST",
DATA{},//这里面写你要传给后端的数据,这里面有点十分重要就是你的webapi方法上面一定要加[HTTPPOST]不然会500报错
success: function (data) {
//成功后的return事件
}
error: function (data) {
alert("data");//请求错误后的报错事件(很重要,如果你报错了不知道哪儿要改的话这个可以帮助你,我个人感觉主要是500报错)
}
})
一般POST方法和通常的ajax方法一样,只需要记得在你WEBAPI方法上加上[HTTPPOST]即可
剩下的我想总结一些有时候会用到的POST到控制器方法,虽然说控制器直接URLPOST即可,但是我个人还是喜欢用AJAX,主要是因为AJAX可以看下自己的psot错误在哪些地方233
$.ajax({
url: 你的控制器/你的控制器方法名字,
type: 'POST',
dataType: 'json',
data: ,//依旧是你要传递参数的值
contentType: “”application/json”,//这儿是告诉你传递参数一定是要json格式的啊
success: function (data) {
//成功后的返回事件
}
});
值得一提是我个人传递的值感觉都是json类型的,目前还没有测试过传递非json类型的参数;
本片内容先写这么多好了 ,这儿有个用到webapi的的ajax方法实例,等我过会打包到github上面再在评论区上,
新人写东西不容易,求推荐QAQ。
前端ajax的各种与后端交互的姿势的更多相关文章
- content-type常见类型辨析(以ajax与springmvc前后端交互为例)
博客搬家: content-type常见类型辨析(以ajax与springmvc前后端交互为例) 在http报文的首部中,有一个字段Content-type,表示请求体(entity body)中的数 ...
- 前端ajax异步传值以及后端接收参数的几种方式
原文参考 异步传值 前台往后台传值呢,有很多种方式,大家听我细细道来. 第一种呢,也是最简单的一种,通过get提交方式,将参数在链接中以问号的形式进行传递. // 前台传值方法 // 触发该方法调用a ...
- ASP.Net WebAPI与Ajax进行跨域数据交互时Cookies数据的传递
前言 最近公司项目进行架构调整,由原来的三层架构改进升级到微服务架构(准确的说是服务化,还没完全做到微的程度,颗粒度没那么细),遵循RESTFull规范,使前后端完全分离,实现大前端思想.由于是初次尝 ...
- ASP.Net中关于WebAPI与Ajax进行跨域数据交互时Cookies数据的传递
本文主要介绍了ASP.Net WebAPI与Ajax进行跨域数据交互时Cookies数据传递的相关知识.具有很好的参考价值.下面跟着小编一起来看下吧 前言 最近公司项目进行架构调整,由原来的三层架构改 ...
- SSM-网站后台管理系统制作(4)---Ajax前后端交互
前提:Ajax本身就为前后端交互服务的,实现功能:用户输入信息,实时判断用户的情况,这也是现在登录界面普遍流行的做法.前端js通过注释识别Controller层,该层查询返回,和之前Google验证码 ...
- Django之前后端交互使用ajax的方式
1. 在项目中前后端数据相互是一种常态, 前后端交互使用的是ajax请求和form表单的请求两种方式" ajax与form表单的区别在于: form 是整个页面刷新提交的, 但是ajax ...
- ajax学习----json,前后端交互,ajax
json <script> var obj = {"name": "xiaopo","age": 18,"gender ...
- 框架基础:ajax设计方案(三)--- 集成ajax上传技术 大文件/超大文件前端切割上传,后端进行重组
马上要过年了,哎,回家的心情也特别的激烈.有钱没钱,回家过年,家永远是舔舐伤口最好的地方.新的一年继续加油努力. 上次做了前端的ajax的上传文件技术,支持单文件,多文件上传,并对文件的格式和大小进行 ...
- 关于web前端base64转换为Blob,存入数组后 ajax请求传输到后端 接受不到文件问题
前端console输出是正常Blob对象,通过ajax formdata 传输到 后端java SpringMvc用MultipartFile接受却一直接受不到,后来直接解析HttpServletRe ...
随机推荐
- Python-网络编程(一)
首先我们python基础部分已经学完了,而socket是我们基础进阶的课程,也就是说,你自己现在完全可以写一些小程序了,但是前面的学习和练习,我们写的代码都是在自己的电脑上运行的,虽然我们学过了模块引 ...
- js原生获取css属性
原文参考http://blog.csdn.net/lzding/article/details/46317777 1.写在dom上的属性,内联样式 <div id="box" ...
- JSP / JDK和Apache的配置
系统环境:Windows7 x64 Ultimate chs 1.首先安装jdk,可以再oracle官网下载到,此处安装jdk6.0版本. 2.配置jdk环境变量: 我的电脑-->属性--> ...
- CentOS安装软件出现错误:bash: /usr/local/bin/rar: /lib/ld-linux.so.2: bad ELF interpreter: No such file or directory
CentOS安装软件出现错误: bash: /usr/local/bin/rar: /lib/ld-linux.so.2: bad ELF interpreter: No such file or d ...
- mysql 修改数据库密码
MYSQL5.7以下版本的数据库密码使用的是 mysql这个数据库里的user表的password这个字段, 修改密码只需: 1.update MySQL.user set password=pass ...
- libgdx for eclipse开发环境搭建
1.安装jdk1.7以上 2.下载libgdx1.2.0 下载地址:https://libgdx.badlogicgames.com/releases 3.下载项目创建工具(老版本的) 下载地址:ht ...
- T-SQL语法学习一(持续更新)
T-SQL语法学习(一) 第一节 不常用语句 不常用语句-指的是一些不常用的查询语句,不针对业务数据查询 SET STATISTICS IO ON(用于查询逻辑读取次数,物理读取次数) 图片 sele ...
- 【Leetcode】【Medium】Combination Sum
Given a set of candidate numbers (C) and a target number (T), find all unique combinations in C wher ...
- laravel 使用EasyWechat 3分钟完成微信支付(以APP支付为例)
上一篇写了支付宝支付,然后这段时间我又把微信支付给接上了,作为萌新的我还是很有成就感的,哈哈~~好了,该写正事了. 第一步:创建应用及配配置 首先到微信的官方平台注册应用https://pay.we ...
- Entity Framework: 主从表的增删改
1.根据主表添加从表数据 var dest = (from d in context.Destinations where d.Name == "Bali" select d).S ...