Статические файлы в бутылках
Итак, я пробовал читать Doc for Bottle, однако я все еще не уверен, как работает статический файл. У меня есть index.tpl
, однако внутри него он имеет прикрепленный к нему файл css, и он работает. Тем не менее, я читал, что Bottle не автоматически обслуживает файлы css, которые не могут быть истинными, если они загружаются правильно. Я, однако, столкнулся с проблемами скорости при запросе страницы, потому что я не использовал return static_file(params go here)
? Если кто-то может прояснить, как они работают, и как они будут использоваться при загрузке страницы, это будет здорово.
Код сервера:
from Bottle import route,run,template,request,static_file
@route('/')
def home():
return template('Templates/index',name=request.environ.get('REMOTE_ADDR'))
run(host='Work-PC',port=9999,debug=True)
Индекс
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type"
content="text/html; charset=ISO-8859-1">
<title>index</title>
<link type="text/css"
href="cssfiles/mainpagecss.css"
rel="stylesheet">
</head>
<body>
<table
style="width: 100%; text-align: left; margin-left: auto; margin-right: auto;"
border="0" cellpadding="2" cellspacing="2">
<tbody>
<tr>
<td>
<h1><span class="headertext">
<center>Network
Website</center>
</span></h1>
</td>
</tr>
</tbody>
</table>
%if name!='none':
<p align="right">signed in as: {{name}}</p>
%else:
pass
%end
<br>
<table style="text-align: left; width: 100%;" border="0" cellpadding="2"
cellspacing="2">
<tbody>
<tr>
<td>
<table style="text-align: left; width: 100%;" border="0"
cellpadding="2" cellspacing="2">
<tbody>
<tr>
<td style="width: 15%; vertical-align: top;">
<table style="text-align: left; width: 100%;" border="1"
cellpadding="2" cellspacing="2">
<tbody>
<tr>
<td>Home<br>
<span class="important">Teamspeak Download</span><br>
<span class="important">Teamspeak Information</span></td>
</tr>
</tbody>
</table>
</td>
<td style="vertical-align: top;">
<table style="text-align: left; width: 100%;" border="1"
cellpadding="2" cellspacing="2">
<tbody>
<tr>
<td>
<h1><span style="font-weight: bold;">Network Website</span></h1>
To find all of the needed information relating to the network social
capabilities, please refer to the links in the side bar.</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</body>
</html>
Ответы
Ответ 1
Как указано в документации, вы должны обслуживать статические файлы с помощью статической функции, а css - это статический файл. Статическая функция обрабатывает безопасность и некоторые другие функции, которые вы можете узнать из источника. Аргумент path для статической функции должен указывать на каталог, где вы храните файлы css
Ответ 2
Чтобы обслуживать статические файлы с помощью bottle
, вам необходимо использовать предоставленную функцию static_file
и добавить несколько дополнительных маршрутов. Следующие маршруты направляют статические запросы файлов и гарантируют доступ только к файлам с правильным расширением файла.
from bottle import get, static_file
# Static Routes
@get("/static/css/<filepath:re:.*\.css>")
def css(filepath):
return static_file(filepath, root="static/css"))
@get("/static/font/<filepath:re:.*\.(eot|otf|svg|ttf|woff|woff2?)>")
def font(filepath):
return static_file(filepath, root="static/font"))
@get("/static/img/<filepath:re:.*\.(jpg|png|gif|ico|svg)>")
def img(filepath):
return static_file(filepath, root="static/img"))
@get("/static/js/<filepath:re:.*\.js>")
def js(filepath):
return static_file(filepath, root="static/js"))
Теперь в вашем html вы можете ссылаться на файл следующим образом:
<link type="text/css" href="/static/css/main.css" rel="stylesheet">
Макет каталога:
`--static
| `--css
| `--fonts
| `--img
| `--js
Ответ 3
Просто предоставление ответа здесь, потому что некоторые мои ученики использовали этот код в задании, и я немного обеспокоен решением.
Стандартный способ обслуживания статических файлов в Bottle находится в документации:
from bottle import static_file
@route('/static/<filepath:path>')
def server_static(filepath):
return static_file(filepath, root='/path/to/your/static/files')
таким образом, все файлы под вашей статической папкой подаются с URL-адреса, начинающегося с /static. В вашем HTML вам нужно указать полный URL-адрес ресурса, например:
<link rel='stylesheet' type='text/css' href='/static/css/style.css'>
Ответ от Sanketh позволяет сделать так, чтобы любая ссылка на изображение, файл css и т.д. в любом месте URL-адреса обслуживалась из заданной папки внутри статической папки. Так что /foo/bar/baz/picture.jpg и/picture.jpg оба будут обслуживаться с static/images/picture.jpg. Это означает, что вам не нужно беспокоиться о том, чтобы получить правильный путь в вашем HTML-коде, и вы всегда можете использовать относительные имена файлов (например, просто src= "picture.jpg" ).
Проблема с этим подходом возникает, когда вы пытаетесь развернуть свое приложение. В рабочей среде вы хотите, чтобы статические ресурсы обслуживались веб-сервером, таким как nginx, а не вашим приложением "Бутылка". Чтобы включить это, все они должны обслуживаться из одной части пространства URL, например./Статический. Если ваш код заполнен относительными именами файлов, он не будет легко переводить эту модель.
Итак, я бы посоветовал использовать трехлинейное решение из учебника Bottle, а не более сложное решение, указанное на этой странице. Это более простой код (поэтому он менее подвержен ошибкам), и он позволяет легко перемещаться в производственную среду без изменений кода.
Ответ 4
Вместо использования регулярного выражения для обработки файлов, как в ответе Sanketh, я бы предпочел не изменять мои шаблоны и не указывать путь к статическим файлам явно, как в:
<script src="{{ get_url('static', filename='js/bootstrap.min.js') }}"></script>
Вы можете сделать это просто, заменив <filename>
в статическом дизайнере маршрута одним из типов :path
- например:
@app.route('/static/<filename:path>', name='static')
def serve_static(filename):
return static_file(filename, root=config.STATIC_PATH)
:path
соответствует целым пути к файлу нежеланным способом, поэтому вам не нужно беспокоиться об изменении шаблонов при переключении на производство - просто сохраняйте все в той же структуре относительных папок.
Ответ 5
Я использовал шаблон Sanketh в прошлом, но со временем спрятал его в агностическую функцию расширения. Вам просто нужно добавить сопоставления с расширением папки в словарь ext_map. По умолчанию используется статическая/папка, если расширение не отображается явно.
import os.path
# Static Routes
@get('/<filename>')
def serve_static_file(filename):
ext = os.path.splitext(filename)[1][1:]
ext_map = {'image':['png','gif','jpg','ico'],'js':['js']}
sub_folder = next((k for k, v in ext_map.items() if ext in v),'')
return static_file(filename, root='static/'+sub_folder)