首页 > 其他分享 >django渲染模板与vue的语法冲突解决Flask框架默认WSGI:Werkzeug

django渲染模板与vue的语法冲突解决Flask框架默认WSGI:Werkzeug

时间:2024-04-04 21:35:00浏览次数:27  
标签:Web WSGI vue Flask 应用程序 Werkzeug 服务器

django渲染模板与vue的语法冲突解决

Flask框架默认WSGI:Werkzeug

 Python来说,它有很多web框架,常见的有jango、Flask、Tornado 、sanic等,比如Odoo、Superset都基于Flask框架进行开发的开源平台,具有强大的功能。在Linux下,默认使用的WSGI Server一般为Gunicorn, 它是一个比较出名的 Web 服务器。在常规的 Django 和 Flask 应用部署中,都有大量的站点使用 Gunicorn。但它只支持Linux,不支持Windows,但有没有类似Gunicorn的产品,但同时支持跨平台?答案是肯定的,那就是Waitress。一个Web框架如何被客户端访问,如下图:

 Vue.js - 渐进式 JavaScript 框架 | Vue.js (vuejs.org)   https://cn.vuejs.org/

引入vue.js文件  https://v2.cn.vuejs.org/v2/guide/

官方文档  介绍 — Vue.js (vuejs.org)

然后绑定DOM

官方文档

更多操作看文档,三天就可以灵活运用了

学习技术一定要看官方文档!!!

Vue与Django的渲染语法冲突问题

两种方法,一更换vue的括号,二用django模板语法

new Vue({
  delimiters: ["{[", "]}"] // 可自定义符号
})
{% verbatim %}
        <div>{{ text }}</div>
{% endverbatim %}

确保不会被django渲染

 

 

 

 

WSGI(Web服务器网关接口 Web Server Gateway Interface )Web应用程序和Web服务器之间的通用接口标准、Flask框架默认WSGI:Werkzeug

 

 

WSGI

WSGI(Web Server Gateway Interface)是一种Python Web应用程序和Web服务器之间的通用接口标准。它定义了Web服务器如何与Python应用程序进行通信,以便能够处理HTTP请求和响应。

作用

WSGI的设计目标是将Web服务器与应用程序解耦,使得开发人员可以使用不同的Web服务器和框架来开发和部署Python Web应用程序。通过遵循WSGI标准,开发人员可以编写可移植的Web应用程序,无需关心底层的Web服务器实现细节。

例如,今天您决定使用 Gunicorn 部署应用程序,但几年后您决定从 Gunicorn 切换到 mod_wsgi。现在,在这种情况下,您可以轻松切换到 mod_wsgi,而无需对实现 WSGI 的应用程序或框架进行任何更改。因此,WSGI 为您的应用程序提供了灵活性。
使用 WSGI 的另一个原因是它的可扩展性。一旦您的应用程序上线、启动并运行,您的应用程序中可能会出现数千个请求。因此,WSGI 能够一次处理数千个请求。众所周知,WSGI 服务器负责处理来自 Web 服务器的请求,并决定将这些请求与应用程序框架的进程进行通信。在这里,我们可以在服务器之间划分职责以扩展网络流量。
参考文章:什么是 WSGI(Web 服务器网关接口)?

工作原理

WSGI的工作原理是,Web服务器接收到HTTP请求后,将请求信息封装成一个字典对象,然后调用WSGI应用程序提供的一个可调用对象(通常是一个函数或类的实例),将请求信息作为参数传递给该可调用对象。应用程序处理请求并生成响应,然后将响应信息返回给Web服务器。(另一说法是应用程序返回响应信息的时候,也要先经过WSGI处理)

在这里插入图片描述

https://dev.to/dev0928/how-to-deploy-python-flask-web-applications-4mh7

在这里插入图片描述

优点

WSGI的优点包括灵活性、可移植性和可扩展性。它可以与各种Web服务器和框架配合使用,如Apache、Nginx、Gunicorn、uWSGI等,同时也可以方便地开发自定义的中间件来实现额外的功能。

Flask框架默认的WSGI:Werkzeug

Flask是一个基于Python的轻量级Web框架,它使用了Werkzeug作为底层的WSGI工具库。Werkzeug是一个WSGI工具库,提供了处理HTTP请求和响应的功能,它是Flask框架的核心组件之一。

在Flask中,Werkzeug提供了处理HTTP请求和响应的功能,包括路由、请求上下文、会话管理等。Flask框架则在此基础上提供了更高级的功能,如模板引擎、表单处理、数据库集成等,使得开发Web应用程序更加方便和高效。

因此,可以说Flask是基于Werkzeug的,而Werkzeug是基于WSGI的。Flask使用Werkzeug来处理HTTP请求和响应,而Werkzeug则遵循WSGI规范与Web服务器(如nginx服务器)进行通信。这种层次化的关系使得Flask能够灵活地与不同的Web服务器和框架进行集成和扩展。

注意:如果Flask直连浏览器,那么Flask本身便充当了web服务器的功能,此时,并未用到WSGI

在Flask直接连接浏览器的情况下,不需要使用WSGI(Web Server Gateway Interface)。WSGI是一种规范,定义了Web服务器和Web应用程序之间的通信接口。它允许不同的Web服务器和Web应用程序框架进行交互。

当Flask直接连接浏览器时,Flask充当了Web服务器的角色,并且直接处理HTTP请求和响应。在这种情况下,Flask不需要与其他Web服务器进行通信,因此不需要使用WSGI。

然而,当Flask应用程序部署到生产环境时,通常会使用WSGI服务器来处理请求。WSGI服务器可以与Flask应用程序进行交互,并将来自Web服务器的请求转发给应用程序进行处理。在这种情况下,Flask应用程序将作为WSGI应用程序运行,而不是直接连接到浏览器。常见的WSGI服务器包括Werkzeug、Gunicorn、uWSGI和mod_wsgi等。

为什么flask与web服务器交互需要wsgi,flask与浏览器直连,就不需要了?

Flask与Web服务器交互需要WSGI的原因是为了实现Web应用程序与Web服务器之间的解耦。WSGI(Web Server Gateway Interface)是一种规范,定义了Web服务器和Web应用程序之间的通信接口。它允许不同的Web服务器和Web应用程序框架进行交互。

当Flask应用程序直接连接浏览器时,Flask充当了Web服务器的角色,并直接处理HTTP请求和响应。在这种情况下,Flask不需要与其他Web服务器进行通信,因此不需要使用WSGI。

然而,当Flask应用程序部署到生产环境时,通常会使用WSGI服务器来处理请求。WSGI服务器可以与Flask应用程序进行交互,并将请求转发给应用程序进行处理。这种架构的好处是可以实现解耦,使得Web应用程序与具体的Web服务器无关,可以在不同的服务器上部署和扩展。

因此,当Flask应用程序直接连接浏览器时,不需要使用WSGI。但当Flask应用程序与Web服务器交互时,需要使用WSGI来实现通信和解耦。

支持WSGI的服务有很多,Werkzeug只是其中一种,具体可以参考这里

Servers which support WSGI

在这里插入图片描述

在这里插入图片描述

参考文章

参考文章:https://medium.com/analytics-vidhya/what-is-wsgi-web-server-gateway-interface-ed2d290449e

拓展:有哪些常见的web服务器(web server)?

以下是一些常见的Web服务器:

  1. Apache HTTP Server:Apache是最流行的开源Web服务器之一,具有广泛的功能和可扩展性。

  2. Nginx:Nginx是一个高性能的开源Web服务器,以其轻量级和高并发处理能力而闻名。

  3. Microsoft IIS:Internet Information Services(IIS)是微软的Web服务器,主要用于Windows操作系统。

  4. Lighttpd:Lighttpd是一个轻量级的Web服务器,特别适用于高并发和低资源消耗的场景。

  5. Caddy:Caddy是一个现代化的Web服务器,具有自动HTTPS配置和易用性等特点。

  6. Gunicorn:Gunicorn(绿色独角兽)是一个基于Python的WSGI HTTP服务器,常用于部署Python Web应用程序。

  7. uWSGI:uWSGI是一个高性能的Web服务器和应用服务器,支持多种编程语言和协议。

这是一些常见的Web服务器,还有其他许多可选的服务器,每个服务器都有其特定的特点和适用场景。

     

标签:Web,WSGI,vue,Flask,应用程序,Werkzeug,服务器
From: https://www.cnblogs.com/xinxihua/p/18114624

相关文章

  • 【服务器uwsgi + flask + nginx的搭建】
    目录服务器uwsgi+flask+nginx的搭建1.安装必要的软件2.启动nginx服务3.测试Nginx4.配置uwsgi和flask5.配置nginx服务器uwsgi+flask+nginx的搭建1.安装必要的软件安装Python、uWSGI、Flask和Nginx。#Ubuntu安装命令sudoapt-getupdatesudoap......
  • VUE3 使用资源路径加载
    1.使用场景有些情况下,我需要使用组件路径动态的方式加载组件。2.实现方法import{defineAsyncComponent}from'vue';/***根据view组件路径异步加载组件.*@param{String}view组件路径这个文件在views下.*@returns{*}*/AppUtil.loadComponent=function(v......
  • 『VUE』11. 操作数组的方法(详细图文注释)
    目录vue中操作数组的方法会修改原数组的会进行渲染更新不修改原数组的不会进行渲染更新push自动渲染concat赋值渲染总结欢迎关注『VUE』专栏,持续更新中欢迎关注『VUE』专栏,持续更新中vue中操作数组的方法vue中数组数据呈现在网页,只检测一开始用到的数......
  • 『VUE』10. 事件修饰符(详细图文注释)
    目录什么是事件修饰符?vuejs不使用修饰符原生js实现禁用事件对象的默认事件使用事件修饰符.prevent使用事件修饰符.stop使用事件修饰符.self欢迎关注『VUE』专栏,持续更新中欢迎关注『VUE』专栏,持续更新中什么是事件修饰符?vue在Vue.js中,事件修饰符......
  • (谷歌浏览器)如何在vscode中搭建vue.js devtools的环境
    搭建过程中明明所有操作步骤都做了,却还是出现下面这种情况: 以下是正确的搭建操作步骤:根据一下图片在vscode中创建文件夹;将以下代码写入; <scripttype="text/javascript"src="../js/vue.js"></script>接下来就是我们需要点击https://vuejs.zcopy.site/,进入到网站后,......
  • vue axios sessionID 每次请求都不同的解决方式
    前端:        后端:注意:配置 allowedOrigins时,如果写的是http://localhost/,而请求的源地址是127.0.0.1。虽然它们通常指向同一台本地计算机,但在CORS规则中被视为不同的源。需更新更新allowedOrigins列表,将现有条目http://localhost:5174替换为http://127.......
  • Flask01
    1新建虚拟环境2在PyCharm中创建一个NewProject用PurePython或新建一个py文件3基础代码app.pyfromflaskimportFlaskimportconfigapp=Flask(__name__)app.config.from_object(config)#flask路由是基于装饰器的"""装饰器执行过程:先执行加括号(),然后......
  • Java登陆第三十七天——VUE3响应式基础、条件渲染、列表渲染
    响应式数据什么是响应式数据? 当数据发生改变时,DOM树的内容,会和数据同步更新。 vue3不是自动响应式数据,需要经过函数处理得到响应式数据对象。ref和reactive这两个函数都会返回响应式数据对象,但也有不同。refref通常用于将一个基本类型转为响应式数据对象。基本类型包括:数......
  • Vue基础知识:声明式导航---导航链接router-link,router-link是什么,怎么用?router-link-ac
    router-link是什么?vue-router提供的一个全局组件,router-link(用于取代a标签)router-link怎么用?router-link的好处?1.能够跳转,能高亮(自带激活时的类名)1.能跳转,配置to属性指定路径(必须)。本质还是a标签,to不需要多加#既然已经有了a标签,为什么还有加一个router-link标签呢?......
  • 一文搞懂 CGI, FastCGI, WSGI, uWSGI, uwsgi
    CGI:CommonGatewayInterfaceWSGI:WebServerGatewayInterface 图解注意: django项目是跑在uWSGIweb服务器上的 问题:有uWGSI了,Django为什么还需要Nginx?一个普通的个人网站,访问量不大的话,当然可以由uWSGI和Django构成。但是一旦访问量过大,客户端请求连......