精华内容
下载资源
问答
  • 1.前端开发与后台交互的方式 (1)form提交 同步请求 (2)Ajax提交 异步请求 发送json对象 一 、Ajax:异步的javascriptXML 主要优点: 1.异步请求,不妨碍用户浏览页面或者其他操作。 2.局部刷新,...

     

    1.前端开发与后台交互的方式

     

    1)form提交  同步请求

    (2)Ajax提交  异步请求  发送json对象

     

    一 、Ajax异步的javascript和XML

    主要优点:

    1.异步请求,不妨碍用户浏览页面或者其他操作。

     

    2.局部刷新,无需重新刷新整个页面。

    缺点:

    1.back和History,对浏览器机制的破坏。

    2.安全问题。易受到黑客攻击。

     

    AJAX原理图:

     

     

    $.ajax({
                    cache: true,
                    type: "POST",
                    url:‘表单提交的url地址’,
                    data:$('#myformid').serialize(),// 序列化form表单数据,后台解析需要反序列化
                    async: false,//false表示同步,true表示异步
                    error: function(request) {
                        alert("请求失败");
                    },
                    success: function(data) {
                       console.log(data);//data为服务器处理后返回的数据
                       alert("请求成功");
                    }
                });
        

     

    二、Form表单提交到后台交互

    <form id="myform" name="myform" method="post" onsubmit="return sumbitTest();"   
          action="RegisterAction.action">  
        <table>  
            <tr>  
                <td>姓名:</td>  
                <td> <input type="text" name="name" /> </td>  
            </tr>  
            <tr>  
                <td>性别:</td>  
                <td>  
                    <input type="radio" name="sex" value="1"><input type="radio" name="sex" value="0"></td>  
            </tr>  
            <tr>  
                <td>年龄:</td>  
                <td>  
                    <select name="age">  
                        <option value="20">20</option>  
                        <option value="21">21</option>  
                        <option value="22">22</option>  
                    </select>  
                </td>  
            </tr>  
            <tr>  
                <td colspan="2">  
                    <input type="submit" value="Submit普通提交">  
                    <input type="button" id="ajaxBtn" value="AJAX提交" />  
                    <input type="button" id="jqueryBtn" value="jQuery提交" />  
                    <input type="button" id="jsBtn" value="JS提交" />  
                    <input type="submit" value="onSubmit提交" />  
                </td>  
            </tr>  
        </table>  
    </form>

    form表单提交为同步请求,submit按钮会刷新整个页面

    注意在使用ajax提交form表单时,提交按钮应为type=“button”,然后为其绑定点击事件,而不应该为type=“submit”,因为submit按钮会刷新整个页面,从而导致ajax请求被拦截。

    备注:如有不完整或者错误的地方请多多指教

     

     

    转载于:https://www.cnblogs.com/liutianzeng/p/10828615.html

    展开全文
  • 前端和后端交互的一些原规范问题

    千次阅读 2017-01-20 14:22:24
    关于交互会给大家详细介绍9个方面的细节: 1.前端请求数据URL由谁来写? 在开发中,URL主要是由后台来写的,写好了给前端开发者.如果后台在查询数据,需要借助查询条件才能查询到前端需要的数据时,这时后台会要求前端...

    最近自己做后台,跟前端的一些有交集的问题总是工作内容划分不清楚,找了下网上搜了搜相关管理的资料

    应,总结了下供大家参考,有好的意见求交流==

    该怎么去规避一些不该属于自己的任务而被后台强加于自己?等等问题,
    关于交互会给大家详细介绍9个方面的细节:

    1.前端请求数据URL由谁来写?

    在开发中,URL主要是由后台来写的,写好了给前端开发者.如果后台在查询数据,需要借助查询条件才能查询到前端需要的数据时,这时后台会要求前端提供相关的查询参数,这里的查询参数也就是URL请求的参数。

    2.接口文档主要由谁来写?

    接口文档也是主要由后台开发者来写的,因为直接跟数据打交道的就是后台,后台是最清楚,数据库里面有什么数据,能返回什么数据.前端开发只是数据的被动接受者.所以接口文档也主要是由后台来完成的,前端只是接口文档的使用者,使用过程中,发现返回的数据不对,则需要跟后台进行商量,由后台来修改.切记 前端不要随意更改接口文档,除非在取得后台开发人员的同意的情况下.总的来讲,接口文档主要由后台来设计,修改,前端开发者起到了辅助的作用.

    3.前端开发与后台交互的数据格式主要是什么?

    主要是JSON
    XML现在用的不多

    4.前端开发的后台交互原理?

    在项目的时候,我们前后端会大概说一下接口地址,前端请求的参数,后端返回的参数,然后大家就开始写,写的差不多的时候,大家调一下接口看一下返回的数据,没问题就可以了。

    5.前端请求参数的形式

    GET和POST两种方式
    对安全性不高 采用get方便
    post要比get安全
    GET - 从指定的服务器中获取数据
    POST - 提交数据给指定的服务器处理

    6.前端应该告知后台哪些有效信息,后台才能返回前端想的数据的呢?

    先将要展示的页面内容进行模块划分,将模块的内容提取出来,以及方便前端的一些标志值等,将所有想要的内容和逻辑告知后端,
    后端就会去数据库里面去查找相应的数据表中去获得相应的内容,或者图片地址信息。
    URL中的参数主要是根据后台需要,
    如果后台需要一个参数作为查询的辅助条件 前端在URL数据请求时就传递参数。
    参数前面?
    几个参数中间&

    7.我们应该怎么把页面这些信息有效传达给后台,以及后台是如何获取到这些数据?

    总的来讲:所有前端请求的URL后面的参数,都是辅助后台数据查询的.如果不需要参数,那么后台就会直接给个URL给前端.

    8.前端应该如何回拒一些本不属于自己做的一些功能需求或任务?

    在与后台打交道中,我们经常遇到这种情况,有时候明明后台来处理某个事件很简单,后台非要你来做,这时候我们应该懂得去回绝他.
    原则:前端就是负责把数据展示在页面上
    发挥:这就需要我们对一个需求,一个任务的要有清晰认识了,如果对任务含糊不清,自己都没搞明白,你只能受后台摆布了.最后也会因为任务没有完成而备受责难了.

    9.当前端在调用数据接口时,发现有些数据不是我们想要的,那么前端应该怎么办呢或者怎么跟后台讲呢?

    首先要把请求的URL和返回的数据以及在页面的展示的情况给跟后台看,这样有理有据,后台开发人员是不会说什么的,否则,后台会很不耐烦的,甚至骂你的可能都有,本身做后台比较难,尤其在查询数据,取数据,封装数据方面都比较难处理.

    10.为什么需要在请求的时候传入参数?

    因为后台在查询数据库的时候需要条件查询。

    展开全文
  • 一般前端后端发送请求是通过axios,Ajax等,后端向前端发送数据,都是通过发送Json字符串到前端进行交互。 对于axios: 会自动将接收到的字符串转换成json对象。 对于Ajax: 在发送请求时可以通过设置...

    这里需要区分一个概念,Json对象和Json字符串的区别:https://blog.csdn.net/u010865136/article/details/78591765

     

    一般前端向后端发送请求是通过axios,Ajax等,后端向前端发送数据,都是通过发送Json字符串到前端进行交互。

    对于axios:

    会自动将接收到的字符串转换成json对象。

    对于Ajax:

    在发送请求时可以通过设置contentType的值来告诉服务器内容编码类型。  参考这篇文章:https://blog.51cto.com/cnn237111/984466

    1>Content-Type和MIME的概念:在把输出结果响应到浏览器上的时候,浏览器必须启动适当的应用程序来处理这个输出文档。这可以通过MIME来完成。在HTTP中,MIME类型被定义在Content-Type

    response.setContentType(MIME)的作用是使客户端浏览器,区分不同种类的数据,并根据不同的MIME调用浏览器内不同的程序嵌入模块来处理相应的数据。

    2>dataType:

    预期服务器返回的数据类型。如果不指定,jQuery 将自动根据 HTTP 包 MIME 信息来智能判断,比如 XML MIME 类型就被识别为 XML。在 1.4 中,JSON 就会生成一个 JavaScript 对象,而 script 则会执行这个脚本。随后服务器端返回的数据会根据这个值解析后,传递给回调函数.而后端就可以设置response.setContentType("text/html;charset=utf-8”);来设置向前端发送的数据格式,根据前面的介绍Content-Type里存放的就是MIME的类型

    总之:

           前端向后端发送数据时,每次都直接把对象转换成Json字符串的格式发送到后端,后端不使用框架的话用request.getParameter("name")来获取。使用框架的话,比如在SpringMvc中,加上@RequestBody 会自动将Json字符串映射到对象中,也能以键值对的形式映射到Map中

     

     

     

     

    展开全文
  • 本篇文章主要介绍了SpringMVC前端和后端数据交互总结,具有一定的参考价值,感兴趣的小伙伴们可以参考一下。
  • 1、前端请求数据URL由谁来写 在开发中,URL主要是由后台来写好给前端。 若后台在查询数据,需要借助查询条件才能查询到前端需要的数据时,这时后台会要求前端提供相关的查询参数(即URL...3、前端与后台交互的数据格

    1、前端请求数据URL由谁来写

    在开发中,URL主要是由后台来写好给前端。

    若后台在查询数据,需要借助查询条件才能查询到前端需要的数据时,这时后台会要求前端提供相关的查询参数(即URL请求的参数)。

    2、接口文档主要由谁来写

    接口文档主要由后台设计和修改。

    后台直接跟数据打交道,最清楚数据库里有什么数据,能返回什么数据。

    前端只是数据的被动接受者,只是接口文档的使用者。

    使用过程中,发现返回的数据部队,则跟后台商量,由后台修改。

    切记:前端不能随意更改接口文档,除非取得后台同意。

    3、前端与后台交互的数据格式

    主要是JSON,XML现在用的不多

    JSON 通常用于与服务端交换数据。

    在接收服务器数据时一般是字符串。

    我们可以使用 JSON.parse() 方法将数据转换为 JavaScript 对象。

    在前端领域混了这几年,总结了一套前端学习的精讲视频和学习路线,如果有对前端开发感兴趣的伙伴,不管你是想转行,或是大学生,还有工作中想提升自己能力的web前端党,欢迎大家的加入我的前端开发交流群:603985993 希望大家诚心交流!,与企业需求同步。好友都在里面学习交流,每天都会有大牛定时讲解前端技术!也可以关注我的微信公众号:【前端留学生】 每天更新最新技术文章干货。

    4、前端与后台的交互原理

    关注点:接口地址、前端请求的参数、后端返回的参数。

    调一下接口,看一下返回的数据。

    5、前端请求参数的形式

    GET和POST两种方式

    GET从指定的服务器中获取数据,POST提交数据给指定的服务器处理

    6、前端应该告知后台那些有效信息,后台才能返回前端想要的数据

    先将要展示的页面内容进行模块划分,将模块的内容提取出来,以及方便前端的一些标志值等,将所有想要的内容和逻辑告知后端

    后端从数据库里面去查询相应的数据表以获得相应的内容或者图片地址信息

    URL中的参数主要是根据后台需要,若后台需要一个参数作为查询的辅助条件,前端在URL数据请求时就传递参数

    7、前端如何把页面信息有效传达给后台,以及后台如何获取到这些数据

    所有前端请求的URL后面的参数都是辅助后台数据查询的

    若不需要参数,那后台就会直接给个URL给前端

    8、前端应该如何回拒一些本不属于自己做的一些功能需求或任务

    前端负责把数据展示在页面上

    清晰的认识自己需要做的需求和任务

    9、当前端在调用数据接口时,发现有些数据不是我们想要的,那么前端应该怎么办

    把请求的URL和返回的数据以及在页面的展示的情况给后台看【后台查询数据、取数据、封装数据方面等蛮难处理的】

    10、为什么需要在请求的时候传入参数

    后台在查询数据库的时候需要条件查询

    展开全文
  • 1. 登陆 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <...--
  • 前端和后端如何进行交互

    千次阅读 2019-11-09 14:29:10
    设计师在参与项目时,一般会注重用户和前端之间的交互,至于前端和后端交互则经常被认为是技术大大们的工作。虽然数据交互是技术需解决的问题,但是在工作中若不懂这方面的问题在评审会议上经常会被技术们说这实现...
  • 前端和后端是如何实现交互

    千次阅读 2019-02-19 09:48:26
    前端和后端是如何交互的 2019年02月19日 09:43:21 1、前端请求数据URL由谁来写 在开发中,URL主要是由后台来写好给前端。 若后台在查询数据,需要借助查询条件才能查询到前端需要的数据时,这时后台会要求前端提供...
  • Vue中前端后端如何交互

    千次阅读 2020-08-24 13:10:12
    Vue中前后端交互Promise的基本使用基本使用多个请求,链式编程Promise的API---实例方法Promise的API---对象方法 Promise的基本使用 基本使用 new一个promise,为其传入一个函数作为参数,这个函数中传入两个参数,...
  • 安卓前端后端交互

    千次阅读 2019-11-09 20:44:53
    点击查找博客请求这个方法: 网络路径是u27665492r.wicp.vip:47513/test package com.wxw.hit; import android.support.v7.app.AppCompatActivity; import android.os.Bundle;...import android.util.Log;......
  • 关于交互会给大家详细介绍9个方面的细节: 1.前端请求数据URL由谁来写? 在开发中,URL主要是由后台来写的,写好了给前端开发者.如果后台在查询数据,需要借助查询条件才能查询到前端需要的数据时,这时后台会要求前端...
  • 这是结合博客的源码,链接是:http://blog.csdn.net/u012660464/article/details/53508757 。名为:Spring MVC+Maven 实现同一项目的前端和后台交互,该源码示例了前端和后台如何进行参数的绑定传递。
  • vue前端与java后端交互

    千次阅读 2019-07-02 21:47:49
    前端写法: 后端布局:
  • 比如说我用vue写前端,用java写后端。 那么vue用webpack打包,node跑。 java跑在tomcat,jboss容器上。 能像jsp那种把前端资源直接放在项目目录中使用吗? 若是不能那么怎么让二者交互呢?
  • 前端后端交互工具

    2019-09-15 10:57:03
    apizza,postman 转载于:https://my.oschina.net/puguole/blog/2993556
  • 本篇文章主要介绍了详解vue与后端数据交互(ajax):vue-resource,具有一定的参考价值,感兴趣的小伙伴们可以参考一下。
  • 后端前端编写过程以及交互流程

    千次阅读 2019-09-19 01:57:21
     (d)最后开始编写Servlet类,此类是前端后端进行数据交互的关键,前端发送的请求以及后端的数据传递都是在Servlet中进行的,Servlet类只是起到一个枢纽的作用,在此类中不做复杂的逻辑数据处理。  (一个HTTP...
  • 前端网页向后端发起相应请求,后端响应前端的请求,做出相关操作.如前端发出获取数据库用户表的请求,后端则将用户表的内容返回给前端.简而言之,前端发出对数据库访问的请求,后端需响应结果. 项目结构 后端项目结构 ...
  • web开发中前端页面是如何跟后端服务器数据交互

    万次阅读 多人点赞 2018-11-24 17:37:47
    后端服务器一般是指servlet容器,用于...这里前端网页以比较常见的 xx.html xx.jsp 网页作为介绍,其它类似 一、静态页面xx.html如何跟后台交互: 先来看一个最简单的登陆界面源代码 &lt;body&gt; ...
  • Web前端使用JavaScript进行开发,利用Ajax技术与后端通信,C#后端采用Asp.net的ashx处理前端请求,数据库端使用Mysql数据库,C#后端可以与数据库直连。
  • 前端和后端是如何交互

    千次阅读 2018-06-21 16:01:28
    1、前端请求数据URL由谁来写...2、接口文档主要由谁来写接口文档主要由后台设计修改。 后台直接跟数据打交道,最清楚数据库里有什么数据,能返回什么数据。 前端只是数据的被动接受者,只是接口文档的使用者。 ...
  • 前端后端交互时,出了问题如何解决? 接口文档中包括:服务器的地址,请求参数,请求方式,返回的数据格式 前后端交互的过程: 客户端需要设置请求的地址,请求的参数,请求的方式; 发送请求后,得到服务器端...
  • 前端工程师和后端工程师对于互联网应用开发来说,前端开发和后端开发是工程师的两大工作领域,这点已经是很多同学的常识。于是,经常有人会问,前端工程师和后端工程师都是做什么的?薪资如何?未来的行业发展前景...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 88,868
精华内容 35,547
关键字:

前端和后端如何交互