用 catch all re 不渲染 css 来捕获 url

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

现在，我之前的“individual.html”继承自“layout.html”。大约一个小时前，我不再这样做了，我已经手动将我在“layout.html”中使用的所有必要引导程序添加到“individual.html”中。即使这样，样式也不会生效。

提前致谢。

Answer 1

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

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

什么时候你应该这样做：

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

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

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

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

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