不懂技术的产品，学这些前端、后端、前后端交互的知识，让你和研发沟通更加高效

一、前端

说起前端，可能大家不自觉的会联想到我们所看到的的网页前端。其实前端分为网页前端（h5）和移动客户端（下载到本地的）app前端。

前端涉及到的开发语言是HTML、CSS、JS。HTML就是图片、文字等元素。页面的颜色、图片的尺寸，按钮的颜色以及位于什么位置等，这些是CSS实现的。js实现内部的逻辑，以及如何请求数据，比如我点击这个按钮的事件等。

我们经常听到在做活动页面时，为了减少和后端的依赖，并快速完成研发，经常听到前端工程师口中的“写死”，听着还蛮吓人的。但是仔细分析，写死，大概就是无法替换数据。那无法替换的数据，其实就是我们口中常说的术语，“静态数据”。动态数据其实就是通过前端请求后台的接口获得，因此在做活动页面时，如果遇到需要频繁更换电商商品的情况，此时是不建议写死的。因为每一次替换，都需要前端工程师手动来完成。讲到这里和大家说下电商活动页面基本需要做的事情：

①由设计人员给出活动页面的设计图稿。

②商品部门给出，活动页面所需占的商品和一些基本信息（包含名称、促销标签、价格等）。

③ui人员对设计人员给出的设计图稿，进行切图。

④后端人员写好前端所需要的接口，一般活动页上的商品信息通过后台活动设置，如果没有活动支撑，可以写配置文件，让前端调用。

⑤将切图给前端工程师，前端人员通过数据接口，获取页面需要展示的商品数据。并对页面增加一些效果和交互功能。

⑥前后端联调，自测，确认数据获取是否正确。

⑦发布到测试环境，测试活动页面。

⑧若无问题安排上线，有问题修复bug。

活动页面中获取静态数据的优缺点：

优点：减少和服务端的请求次数，提升处理的效率

缺点：扩展性差，每一次替换数据都需要麻烦前端工程师来完成。

二、后端

后端的任务实际上就是向前端提供需要显示网页和APP内容的数据，可能是HTML，也可能是JSON数据，也可以是音视频或者PDF文件。简单来划分，一个服务器包含三个部分：

①HTTP服务器：把它后面的编程语言生成的各种HTML/CSS/JavaScript打包成一个HTTP请求，然后再封装到一个TCP/IP的数据包里发回给我们。而最常用的两个HTTP服务器叫做APach和Nginx。

②应用服务器

③数据库

三、前后端如何交互

首先我们先了解一下接口的概念：

API接口：是一些预先定义的函数，目的是提供应用程序与开发人员基于软件或硬件得以访问的一组例程的能力，而无需访问源码，或理解内部工作机制的细节。通俗来讲，就是接口封装好了某些功能的一段代码，给前端调用，我们不需要知道这些功能具体怎么实现的，我们只需要按照接口协议调用即可。就好比我们生活中使用洗衣机，漂洗过后经历的一系列操作，通过接口即可完成，而无需深入了解其脱水是怎么完成的。

其次我们了解下前后端交互时传递数据的格式

一般都使用JSON格式的，JSON主要处理一些轻量级的文本数据交换格式是当然也有XML格式。总体来说，所有前端请求的URL后面的参数，都是辅助后台数据查询的。比如下方我贴出来的链接，使用搜索功能，请求参数。如果不需要参数，那么后台就会直接给个URL传给前端。

好了，今天就讲到这里。每个工作的业务流程和业务模式不同，但是技术知识是相通的。多懂一些技术知识，可以让大家在需求评审会上以及和研发哥哥姐姐们交流沟通时，更加高效。也防止不必要的撕逼，更容易认清本质，继续热爱工作。