`

Ajax 前端与后台交互

阅读更多
  • 前端后端交互是比较正常的事情。例如登录这样一个功能:
  1. 整体的思路和逻辑是这样的:我需要获取用户名和密码,将用户名和密码组合成一个对象,传给后台服务器后台服务器会进行匹配将返回来的数据给前端,前端根据返回的数据判断是否成功登陆。以下是通过ajax实现这个过程:
  2. url :         代表登录功能需要访问的接口
    method:  代表前端是需要向服务器发送数据(POST),还是在服务器获取数据(GET)
    data :      代表前端需要向后端传递的数据对象
    success :代表前端向后台发送请求成功时,调用此函数,并可以展示服务器返回的数据,根据返回的数据进行前端页面的操作
    error :     代表前端向后端请求失败时,调用此函数,如:网络连接失败

    以下是简写:

    $.ajax({
                    url: "http://182.92.161.230:3000/session/login",
                    method:'POST',
                    data: {},
                    success: function (data) {
                    },
                    error: function () {
                    }
                });
      
    以下是ajax使用实例
    $.ajax({
                    url: "http://182.92.161.230:3000/session/login",
                    method:'POST',
                    data: {"email":$("#email").val(),"password":$("#password").val()},
                    success: function (data) {
                        if(data.errcode==40002)
                        {
                            $("#email-or-password-error").text("邮箱或密码错误");
                            setTimeout(dismiss_error_info(),6000);
                        }
                        if(data.errcode === 0)
                        {
                            localStorage.setItem("data",JSON.stringify(data.data));
                            window.location.href = "http://182.92.161.230/";
                        }
                    },
                    error: function () {
                    }
                });
     
分享到:
评论

相关推荐

    通过ajax进行前后台交互

    页面通过ajax与后台进行前后台数据交互 .

    nodejs+ajax用js实现前端后台demo

    nodejs+ajax用js实现前端后台demo,主要用nodejs实现服务器端,express+ajax实现数据的前后端交互

    JS的Ajax与后端交互数据的实例

    JS中很多地方会使用Ajax与后台进行数据交互。 Ajax是通过http,使得JS与后端进行数据通信,由于Ajax的异步特性,可以使多个Ajax请求同时访问后端,对页面的局部数据进行逻辑处理,并渲染。 ajax中前端和后端的交互图...

    TP5(thinkPHP5)框架使用ajax实现与后台数据交互的方法小结

    本文实例讲述了TP5(thinkPHP5)框架使用ajax实现与后台数据交互的方法。分享给大家供大家参考,具体如下: 方法一: serialize() 方法通过序列化表单值,创建 URL 编码文本字符串,这个是jquery提供的方法 前端代码 &...

    前后台交互案例

    前端用jquery的ajax方法发送请求到C#后台,后台收到请求后返回请求结果案例

    前后端数据交互ajax ,包括原生js的ajax,以及jquery中的ajax的使用(一)

    1.异步:代表的是前端向后台发起请求,让后端处理完成,然后再返回一段数据,前端拿到返回的数据后需要做一系列的处理,前端处理这些数据就是异步的行为。(那一瞬间你没偶数据,等后端处理完成才能回头处理你的事件...

    TP5(thinkPHP5)框架基于ajax与后台数据交互操作简单示例

    主要介绍了TP5(thinkPHP5)框架基于ajax与后台数据交互操作,结合实例形式分析了thinkPHP5前端基于jQuery的ajax数据提交及后台数据接收、处理相关操作技巧,需要的朋友可以参考下

    ECharts前台后台数据交互Demo

    使用AJAX向ECharts送入MySQL中的数据

    ajax+json实现三级联动,显示的数据取自后台

    用ajax与后台交互,把数据拼接成json格式返回到前端,再用插件实现三级联动效果

    Spring MVC前端与后端5种ajax交互方法【总结】

    前端ajax与后端Spring MVC控制器有以下五种数据交互方式。(前台使用了dhtmlxGrid,后端使用了fastjson) 方式一 通过URL传参 通过URL挂接参数,如/auth/getUser?userid=’6′ 服务器端方法可编写为:getUser(String ...

    extjs 前后台交互参数出现中文乱码问题的解决方法

    在使用myeclipse过程中,我使用ajax同步请求传递参数到后台却出现中文乱码,这是我解决问题的代码,希望对您有所帮助

    Java后台服务器Maven+SpringMVC+Ajax+@RequestBody+Json传输

    模拟了基本前端与后端交互JSon数据,使用了Java语言+Maven+SpringMVC+Ajax @RequestBody+Json传输完成基本数据交互

    ajax基础知识总结

    学习ajax基础知识,让自己的前端技术更上一层,学会与后台交互

    Python Flask 搭建微信小程序后台详解

    前言: 近期需要开发一个打分的微信小程序,涉及到与后台服务器的数据交互,...分三步讲解微信小程序与Python后台交互数据的全过程 小程序向后台服务器提交数据。微信小程序为数据提交开发了一个API,其实是一个js函数

    ASP.NET使用AjaxPro实现前端跟后台交互详解

    使用 AjaxPro 进行交互,很多人都写过文章了,为什么还要继续老生常谈呢。因为有一些细节上的东西我们需要注意,因为这些细节如果不注意的话,那么程序会报错,而且维护性较差。 引言 一.首先,还是那句话,欲练神功...

    输入框 自动完成 AJAX

    输入框 自动完成 AJAX,可以与JAVA 或者 NET 后台代码交互,一款比较好的 自动完成功能

    java电商网站源码带前后台

    该网站包含前台购物流程、个人中心展示、后台管理这三个大类组成,实现流畅的购物体验。 前台购买—>个人中心查看—>后台发货的基本购物流程。 运行环境:myeclipse+mysql+Tomcat ...与客户端交互:Servlet、Ajax

    boa与数据库数据交互的例子

    boa网页读取数据库数据能实现保存 通过前台读取后台数据库的值来确定前台上的控件的状态,实现保存网页设置的功能 boa ajax send传参 ...这2个例子能帮助初学者很好的理解前台后台数据交互的功能及方法

    前端素材 优质通用后台管理模板Hyper.zip

    后台管理系统是一个用于管理和控制网站、应用程序或系统的管理界面。下面是关于后台管理系统的多层次详细分析和功能:用户管理、内容管理、数据管理、系统设置、统计和报告...AJAX,创建交互式网页应用的网页开发技术。

    前端素材 优质通用后台管理模板 Adminity.zip

    后台管理系统是一个用于管理和控制网站、应用程序或系统的管理界面。下面是关于后台管理系统的多层次详细分析和功能:用户管理、内容管理、数据管理、系统设置、统计和报告...AJAX,创建交互式网页应用的网页开发技术。

Global site tag (gtag.js) - Google Analytics