Python中关于前后端分离开发入门的示例分析-创新互联

本篇文章为大家展示了Python中关于前后端分离开发入门的示例分析，内容简明扼要并且容易理解，绝对能使你眼前一亮，通过这篇文章的详细介绍希望你能有所收获。

为青县等地区用户提供了全套网页设计制作服务，及青县网站建设行业解决方案。主营业务为成都网站设计、成都网站建设、青县网站设计，以传统方式定制建设网站，并提供域名空间备案等一条龙服务，秉承以专业、用心的态度为用户提供真诚的服务。我们深信只要达到每一位用户的要求，就会得到认可，从而选择与我们长期合作。这样，我们也可以走得更远！

前后端分离开发入门

在传统的Web应用开发中，大多数的程序员会将浏览器作为前后端的分界线。将浏览器中为用户进行页面展示的部分称之为前端，而将运行在服务器，为前端提供业务逻辑和数据准备的所有代码统称为后端。所谓前后端分离的开发，就是前后端工程师约定好数据交互接口，并行的进行开发和测试，后端只提供数据，不负责将数据渲染到页面上，前端通过HTTP请求获取数据并负责将数据渲染到页面上，这个工作是交给浏览器中的JavaScript代码来完成。

使用前后端分离开发有诸多的好处，下面我们简要的说下这些好处：

提升开发效率。前后端分离以后，可以实现前后端代码的解耦，只要前后端沟通约定好应用所需接口以及接口参数，便可以开始并行开发，无需等待对方的开发工作结束。在这种情况下，前后端工程师都可以只专注于自己的开发工作，有助于打造出更好的团队。除此之外，在前后端分离的开发模式下，即使需求发生变更，只要接口与数据格式不变，后端开发人员就不需要修改代码，只要前端进行变动即可。
增强代码的可维护性。前后端分离后，应用的代码不再是前后端混合，只有在运行期才会有调用依赖关系，这样的话维护代码的工作将变得轻松愉快很多，再不会牵一发而动全身。当你的代码变得简明且整洁时，代码的可读性和可维护性都会有质的提升。
支持多终端和服务化架构。前后端分离后，同一套数据接口可以为不同的终端提供服务，更有助于打造多终端应用；此外，由于后端提供的接口之间可以通过HTTP(S)进行调用，有助于打造服务化架构（包括微服务）。

接下来我们就用前后端分离的方式来改写之前的投票应用。

返回JSON格式的数据

刚才说过，在前后端分离的开发模式下，后端需要为前端提供数据接口，这些接口通常返回JSON格式的数据。在Django项目中，我们可以先将对象处理成字典，然后就可以利用Django封装的JsonResponse向浏览器返回JSON格式的数据，具体的做法如下所示。

def show_subjects(request):
 queryset = Subject.objects.all()
 subjects = []
 for subject in queryset:
 subjects.append({
 'no': subject.no,
 'name': subject.name,
 'intro': subject.intro,
 'isHot': subject.is_hot
 })
 return JsonResponse(subjects, safe=False)

上面的代码中，我们通过循环遍历查询学科得到的QuerySet对象，将每个学科的数据处理成一个字典，在将字典保存在名为subjects的列表容器中，最后利用JsonResponse完成对列表的序列化，向浏览器返回JSON格式的数据。由于JsonResponse序列化的是一个列表而不是字典，所以需要指定safe参数的值为False才能完成对subjects的序列化，否则会产生TypeError异常。

可能大家已经发现了，自己写代码将一个对象转成字典是比较麻烦的，如果对象的属性很多而且某些属性又关联到一个比较复杂的对象时，情况会变得更加糟糕。为此我们可以使用一个名为bpmappers的三方库来简化将对象转成字典的操作，这个三方库本身也提供了对Django框架的支持。

安装三方库bpmappers。

pip install bpmappers

编写映射器（实现对象到字典转换）。

from bpmappers.djangomodel import ModelMapper
from poll2.models import Subject
class SubjectMapper(ModelMapper):
 
 class Meta:
 model = Subject

修改视图函数。

def show_subjects(request):
 queryset = Subject.objects.all()
 subjects = []
 for subject in queryset:
 subjects.append(SubjectMapper(subject).as_dict())
 return JsonResponse(subjects, safe=False)

配置URL映射，然后访问该接口，可以得到如下所示的JSON格式数据。

[
 {
 "no": 101,
 "name": "Python全栈+人工智能",
 "intro": "Python是一种计算机程序设计语言。是一种面向对象的动态类型语言，最初被设计用于编写自动化脚本(shell)，随着版本的不断更新和语言新功能的添加，越来越多被用于独立的、大型项目的开发。",
 "create_date": "2017-08-01",
 "is_hot": true
 },
 // 此处省略下面的内容
]

如果不希望在JSON数据中显示学科的成立时间，我们可以在映射器中排除create_date属性；如果希望将是否为热门学科对应的键取名为isHot（默认的名字是is_hot），也可以通过修改映射器来做到。具体的做法如下所示：

from bpmappers import RawField
from bpmappers.djangomodel import ModelMapper
from poll2.models import Subject
class SubjectMapper(ModelMapper):
 isHot = RawField('is_hot')
 class Meta:
 model = Subject
 exclude = ('create_date', 'is_hot')

再次查看学科接口返回的JSON数据。

[
 {
 "no": 101,
 "name": "Python全栈+人工智能",
 "intro": "Python是一种计算机程序设计语言。是一种面向对象的动态类型语言，最初被设计用于编写自动化脚本(shell)，随着版本的不断更新和语言新功能的添加，越来越多被用于独立的、大型项目的开发。",
 "isHot": true
 },
 // 此处省略下面的内容
]

关于bpmappers详细的使用指南，请参考它的官方文档，这个官方文档是用日语书写的，可以使用浏览器的翻译功能将它翻译成你熟悉的语言即可。

使用Vue.js渲染页面

关于Vue.js的知识，我们在第21天到第30天的内容中已经介绍过了，这里我们不再进行赘述。如果希望全面的了解和学习Vue.js，建议阅读它的官方教程或者在YouTube上搜索Vue.js的新手教程（Crash Course）进行学习。

重新改写subjects.html页面，使用Vue.js来渲染页面。

<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>学科</title>
</head>
<body>
 <h2>所有学科</h2>
 <hr>
 <div id="app">
 <div v-for="subject in subjects">
 <h4>
 <a :href="getTeachersHref(subject.no)">{{ subject.name }}</a>
 <img v-if="subject.isHot" src="/static/images/hot.png" width="32">
 </h4>
 <p>{{ subject.intro }}</p>
 </div>
 </div>
 <script src="/tupian/20230522/script>
 <script>
 const app = new Vue({
 el: '#app',
 data: {
 subjects: []
 },
 created() {
 fetch('/subjects/')
 .then(resp => resp.json())
 .then(json => this.subjects = json)
 },
 methods: {
 getTeachersHref(sno) {
 return `/static/teachers.html/?sno=${sno}`
 }
 }
 })
 </script>
</body>
</html>

前后端分离的开发需要将前端页面作为静态资源进行部署，项目实际上线的时候，我们会对整个Web应用进行动静分离，静态资源通过Nginx或Apache服务器进行部署，生成动态内容的Python程序部署在uWSGI或者Gunicorn服务器上，对动态内容的请求由Nginx或Apache路由到uWSGI或Gunicorn服务器上。

在开发阶段，我们通常会使用Django自带的测试服务器，如果要尝试前后端分离，可以先将静态页面放在之前创建的放静态资源的目录下！

上述内容就是Python中关于前后端分离开发入门的示例分析，你们学到知识或技能了吗？如果还想学到更多技能或者丰富自己的知识储备，欢迎关注创新互联-成都网站建设公司行业资讯频道。

网站名称：Python中关于前后端分离开发入门的示例分析-创新互联
URL地址：https://www.cdcxhl.com/article14/pjhge.html

成都网站建设公司_创新互联，为您提供面包屑导航、自适应网站、Google、域名注册、ChatGPT、品牌网站建设

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容