python - 使用 catch all 捕获 url 不渲染 css

Question

我正在使用 Python 在 Google App Engine 的 webapp2 框架上构建一个应用程序。我一直使用 Jinja2 作为我的模板引擎，并使用 Twitter Bootstrap 来进行样式设计。在构建了一个漂亮的“layout.html”并让所有其他模板继承自“layout.html”之后，我进行了部署。所有页面都会呈现属性，除了 url 是动态的页面之外。

WSGI 处理程序如下所示:

webapp2.WSGIApplication = ([('/login', LoginPage),
                           ('/updates', Update),
                           ('/updates/.*', Individual)],
                           debug = True)

# as you can see I'm using the catchall regex for Individual

从功能上来说，Individual 处理的每个动态生成的 URL 都能正常运行。这是处理程序，同样，该处理程序中的所有内容都将被执行。

class Individual(Handler):
    def get(self):
            url_u = str(self.request.url)
            posit = url_u.find('updates')
            bus1 = url_u[posit+8:]
            bus = bus1.replace('%20', chr(32))
            b = BusUpdates.all()
            this_bus = b.order('-timestamp').filter('bus = ', bus).fetch(limit=10)
            name = users.get_current_user()
            user = None
            if name:
                    user = name.nickname()
            logout = users.create_logout_url(self.request.uri)

            self.render("individual.html", bus=bus, user=user, this_bus=this_bus, logout=logout)

典型的 url 如下所示: http://www.megabusfinder.appspot.com/updates/St%20Louis,%20MO-Chicago,%20IL-4-12-930AM-310PM

这是我的 app.yaml 文件

application: megabusfinder
version: 1
runtime: python27
api_version: 1
threadsafe: no


handlers:
- url: /favicon\.ico
  static_files: favicon.ico
  upload: favicon\.ico


- url: /static/stylesheets
  static_dir: static/stylesheets


- url: /twitter-bootstrap-37d0a30
  static_dir: twitter-bootstrap-37d0a30


- url: /static/xml
  static_dir: static/xml

- url: .*
  script: main.app


builtins:
- remote_api: on


libraries:
- name: webapp2
  version: "2.5.1"
- name: jinja2
  version: latest

现在，我以前有从我的“layout.html”继承的“individual.html”。大约一个小时前，我不再这样做，并且我已手动将“layout.html”中使用的所有必要的 Bootstrap 添加到“individual.html”中。即使这样，样式也不会生效。

提前致谢。

Answer 1

问题是您正在为样式表使用相对 URL 路径，而不是绝对路径。你正在这样做:

<link href="styles/bootstrap.css" rel="stylesheet">

什么时候你应该这样做:

<link href="/styles/bootstrap.css" rel="stylesheet">

问题在于，浏览器将通过将现有 URL 与 href(或 src)中提供的相对 URL 相结合来发出对类似相对 URL 的请求。对于 JavaScript 文件)。

在您的根页面上，浏览器会请求 megabusfinder.appspot.com/styles/bootstrap.css。在您的非根页面上，它会请求 megabusfinder.appspot.com/some/sub/path + styles/bootstrap.css ...它不存在，导致 404(和无样式页面)。

提供前导斜杠可确保浏览器将当前路径替换为 href 路径，而不是组合路径。

参见RFC 3986有关如何合并 URI 的更多信息。