Python Pyramid 简明教程

Python Pyramid - Static Assets

通常需要在模板响应中包含一些即使存在某些动态数据也不会更改的资源。此类资源称为静态资产。媒体文件（.png、.jpg 等）、用于执行某些前端代码的 JavaScript 文件或用于格式化 HTML（.css 文件）的样式表是静态文件示例。

Often it is required to include in the template response some resources that remain unchanged even if there is a certain dynamic data. Such resources are called static assets. Media files (.png, .jpg etc), JavaScript files to be used for executing some front end code, or stylesheets for formatting HTML (.css files) are the examples of static files.

Pyramid 从服务器文件系统中的指定目录向客户端浏览器提供这些静态资产。Configurator 对象的 add_static_view() 方法定义了包含图像、JavaScript 和 CSS 文件等静态文件的文件夹的路由和路径名称。

Pyramid serves these static assets from a designated directory in the server’s filesystem to the client’s browser. The add_static_view() method of the Configurator object defines the name of the route and path for the folder containing the static files such as images, JavaScript, and CSS files.

根据约定，“static”目录用于存储静态资产，而 add_static_view() 的使用方法如下：

As a convention, the 'static' directory is used to store the static assets and the add_static_view() is used as follows −

config.add_static_view(name='static', path='static')

定义静态路由后，可以使用 request.static_url() 方法在 HTML 脚本中使用静态资产的路径。

Once the static route is defined, the path of static assets while using in HTML script can be obtained by request.static_url() method.

Static Image

在以下示例中，Pyramid 徽标将在 logo.html 模板中呈现。因此，首先将 "pyramid.png" 文件放在 static 文件夹中。现在可以将它用作 HTML 代码中 <img> 标记的 src 属性。

In the following example, Pyramid logo is to be rendered in the logo.html template. Hence, "pyramid.png" file is first placed in static folder. It is now available for using as src attribute of <img> tag in HTML code.

<html>
<body>
   <h1>Hello, {{ name }}. Welcome to Pyramid</h1>
   <img src="{{request.static_url('app:static/pyramid.png')}}">
</body>
</html>

Example

应用程序代码使用 add_static_view() 更新配置器并定义 index() 视图呈现上述模板。

The application code updates the configurator with add_static_view(), and defines index() view renders the above template.

from wsgiref.simple_server import make_server
from pyramid.config import Configurator
from pyramid.response import Response
from pyramid.view import view_config

@view_config(route_name='index', renderer='templates/logo.html')

def index(request):
   return {'name':request.matchdict['name']}

if __name__ == '__main__':
   with Configurator() as config:
      config.include('pyramid_jinja2')
      config.add_jinja2_renderer(".html")
      config.add_route('index', '/{name}')
      config.add_static_view(name='static', path='app:static')
      config.scan()
      app = config.make_wsgi_app()
   server = make_server('0.0.0.0', 6543, app)
   server.serve_forever()

Output

运行上述代码以启动服务器。在浏览器中使用 http://localhost:6543/Guest 作为 URL。在此，“Guest”是 matchdict 对象中的视图函数选取的路径参数，并作为上下文传递给 logo.html 模板。现在浏览器显示 Pyramid 徽标。

Run the above code to start the server. Use http://localhost:6543/Guest as the URL in your browser. Here 'Guest' is the path parameter picked up by the view function in matchdict object and passed to the logo.html template as the context. The browser displays the Pyramid logo now.

pyramid

Javascript as Static Asset

以下是静态文件的另一个示例。JavaScript 代码 hello.js 包含 myfunction() 定义，将在 HTML 脚本 (templates\hello.html) 中的 onload 事件中执行

Here is another example of static file. A JavaScript code hello.js contains a definition of myfunction() to be executed on the onload event in following HTML script (templates\hello.html)

<html>
<head>
   <script src="{{request.static_url('app:static/hello.js')}}"></script>
</head>
<body onload="myFunction()">
   <div id="time" style="text-align:right; width="100%"></div>
   <h1><div id="ttl">{{ name }}</div></h1>
</body>
</html>

Example

存储在 static 文件夹中的 hello.js 代码如下：

The hello.js code saved in static folder is as follows −

function myFunction() {
   var today = new Date();
   var h = today.getHours();
   var m = today.getMinutes();
   var s = today.getSeconds();
   var msg="";
   if (h<12)
   {
      msg="Good Morning, ";
   }
   if (h>=12 && h<18)
   {
      msg="Good Afternoon, ";
   }
   if (h>=18)
   {
      msg="Good Evening, ";
   }
   var x=document.getElementById('ttl').innerHTML;
   document.getElementById('ttl').innerHTML = msg+x;
   document.getElementById('time').innerHTML = h + ":" + m + ":" + s;
}

Output

该函数检测当前时间的值，并根据一天中的时间为 msg 变量分配适当的值（早上好、下午好或晚上好）。

The function detects the value of current time and assigns appropriate value to msg variable (good morning, good afternoon or good evening) depending on the time of the day.

将 hello.js 存储在 static 文件夹中，将 hello.html 存储在 templates 文件夹中并重新启动服务器。浏览器应显示当前时间及其下方相应的提示信息。

Save hello.js in static folder, hello.html in templates folder and restart the server. The browser should show the current time and corresponding message below it.

goodevening