Flask 静态文件

Web应用程序通常需要静态文件,例如javascript文件或支持网页显示的CSS文件。通常,配置Web服务器并为您提供这些服务,但在开发过程中,这些文件是从您的包或模块旁边的static文件夹中提供,它将在应用程序的/static中提供。

特殊端点'static'用于生成静态文件的URL。

在下面的示例中,在index.html中的HTML按钮的OnClick事件上调用hello.js中定义的javascript函数,该函数在Flask应用程序的“/”URL上呈现。

from flask import Flask, render_template
app = Flask(__name__) @app.route("/")
def index():
return render_template("index.html") if __name__ == '__main__':
app.run(debug = True)

index.html的HTML脚本如下所示:

<html>

   <head>
<script type = "text/javascript"
src = "{{ url_for('static', filename = 'hello.js') }}" ></script>
</head> <body>
<input type = "button" onclick = "sayHello()" value = "Say Hello" />
</body> </html>

Hello.js包含sayHello()函数。

function sayHello() {
alert("Hello World")
}

flask静态文件的更多相关文章

  1. Flask 静态文件缓存问题

    大家好,今天才发现很多学习Flask的小伙伴都有这么一个问题,清理缓存好麻烦啊,今天就教大家怎么解决. 大家在使用Flask静态文件的时候,每次更新,发现CSS或是Js或者其他的文件不会更新. 这是因 ...

  2. Flask -- 静态文件 和 模板渲染

    静态文件 一般用于存放图片,样式文件(css, js等) 保存位置:包中或者文件所在目录创建一个 static 目录 访问:在应用中使用 /static/...即可访问 , 更好的方式是使用url_f ...

  3. Flask:Flask的模板系统和静态文件

    1.Flask模板系统 Django框架有自己独立的模板系统,而Flask是没有的,Flask默认采用jinjia2模板系统,jinjia2是仿写Django模板系统的一个第三方模块,但性能上要比Dj ...

  4. Flask导入静态文件问题

    然而如果使用flask开发web,并且需要在本地导入已经写好的css js 文件或者image一系列,这些文件是静态文件,需要另外建一个文件夹static;并且在html文件修改导入方法,exampl ...

  5. flask 安装及基础学习(url_for反转,静态文件引入)

    pip3 install flask pycharm 创建项目 默认的代码解释说明(及开启debug模式) #encoding:utf-8 from flask import Flask #从flas ...

  6. flask模板应用-加载静态文件:添加Favicon,使用CSS框架,使用宏加载静态资源

    加载静态文件 一个Web项目不仅需要HTML模板,还需要许多静态文件,比如CSS.JavaScript文件.图片和声音声.在flask程序中,默认需要将静态文件存储在与主脚本(包含程序实例的脚本)同级 ...

  7. Flask初级(四)flash在模板中使用静态文件

    Project name :Flask_Plan templates: 默认设置下,Flask在程序根目录中名为static的子目录中寻找静态文件. 随便找个图片放进去把,命令test.png Fla ...

  8. Flask从入门到精通之静态文件

    Web 程序不是仅由Python 代码和模板组成.大多数程序还会使用静态文件,例如HTML代码中引用的图片.JavaScript 源码文件和CSS. 在前面的章节中,我们曾检查hello.py 程序的 ...

  9. Flask:静态文件&模板(0.1)

    Windows 10家庭中文版,Python 3.6.4,Flask 1.0.2 前面看了Flask的Quickstart文档,可是,一直没有练习里面的内容,这不,刚刚练习完毕,来写篇博文记录一下! ...

随机推荐

  1. Econ 493 A1 - Fall 2019

    Econ 493 A1 - Fall 2019Homework 4Assignment InformationThis assignment is due on Monday November 18 ...

  2. MYSQL LIMIT 性能测试

    查询语句 # 普通表 SELECT * FROM test_page LIMIT m,n # 内存表 SELECT * FROM test_page_memory LIMIT m,n 总结 查询位置( ...

  3. [转帖]k8s 如何让你的应用活的更久

    k8s 如何让你的应用活的更久 https://www.jianshu.com/p/132319e795ae 众所周知,k8s 可以托管你的服务 / 应用,当出现各种原因导致你的应用挂掉之后,k8s ...

  4. 【题解】Diferenc-Diferencija [SP10622]

    [题解]Diferenc-Diferencija [SP10622] 传送门:\(\text{Diferenc-Diferencija}\) \(\text{[SP10622]}\) [题目描述] 序 ...

  5. WPF 精修篇 Winform 嵌入WPF控件

    原文:WPF 精修篇 Winform 嵌入WPF控件 首先 创建WPF控件库 这样就有了一个WPF界面 在wpf中增加界面等 在winform中增加WPFDLL 重新生成解决方案 在左侧工具栏 出现W ...

  6. Linux纯小白操作(以安装JDK为例)

    [本文只针对纯小白,有基础的请略过] 最近公司给分配工作使用的虚拟机都是Linux系统的,以前完全没接触过,今天按照网上一些教程操作,好多地方感觉对小白不够友好(有些问题非常小白那些教程没有写出来.我 ...

  7. Python中的@函数装饰器到底是什么?

    在解释@函数装饰器之前,先说一下,类中的类方法和静态方法. 在Python中完全支持定义类方法.静态方法.这两种方法很相似,Python它们都使用类来调用(ps:用对象调用也可以). 区别在于:Pyt ...

  8. HighChat动态绑定数据 数据后台绑定(三)

    今天看了几位大佬的博客,学到了一些,现在分享一下,也作为以后的参考 不多说看代码 1.后台代码 public ActionResult Ajax2() { ReportData reportData ...

  9. Kubernetes概念之mater、node

    很久没写博客了,终于把重心找回来了,不过没有以前有斗志.有理想.有目标了.慢慢来.你若问我我最近几年的规划是什么,还真不知道.突然发现摧毁一个人真的很简单.k8s也是一遍一遍的从入门到放弃,还是要好好 ...

  10. Fundebug 微信小程 BUG 监控插件更新至 1.2.1,优化错误上报次数的限制算法,新增 silentHttpHeader 配置选项

    摘要: 1.2.1优化错误上报次数的限制算法,新增silentHttpHeader配置选项,请大家及时更新哈! Fundebug提供专业的微信小程序 BUG 监控服务,可以第一时间为您捕获生存环境中小 ...