我一直在学习 Udacity Web Enginnering 课程,但在其中一项作业上遇到了困难。
我创建了一个基本博客,允许我创建帖子并将它们显示在主页上。此外,每次创建帖子时都会生成一个永久链接并显示页面。然而,虽然我的 HTML 渲染得很好,但所有的 CSS 都丢失了。从服务器返回的源中肯定会引用样式表,但不会显示。
相同的 CSS 文件 (stlye.css) 在其他地方成功使用。
目录结构如下所示:
blog:
- app.yaml
- main.py
templates:
- index.html
- newpost.html
- styles.css
stylesheets
- styles.css
这是我的应用程序代码:
import os
import webapp2
import jinja2
from google.appengine.ext import db
jinja_environment = jinja2.Environment(autoescape=True,
loader=jinja2.FileSystemLoader(os.path.join(os.path.dirname(__file__), 'templates')))
# Defines the database model
class Post(db.Model):
subject = db.StringProperty(required = True)
content = db.TextProperty(required = True)
created = db.DateTimeProperty(auto_now_add = True)
# Base handler class with utility functions
class Handler(webapp2.RequestHandler):
def write(self, *a, **kw):
self.response.out.write(*a, **kw)
def render_str(self, template, **params):
t = jinja_environment.get_template(template)
return t.render(params)
def render(self, template, **kw):
self.write(self.render_str(template, **kw))
class Blog(Handler):
def get(self):
posts = db.GqlQuery("SELECT * FROM Post ORDER BY created DESC")
self.render('index.html', posts = posts)
# Render a single post
class Permalink(Handler):
def get(self, post_id):
post = Post.get_by_id(int(post_id))
self.render("index.html", posts = [post])
# Submission form
class NewPost(Handler):
def get(self):
self.render("newpost.html")
def post(self):
subject = self.request.get("subject")
content = self.request.get("content")
if subject and content:
post = Post(subject = subject, content = content)
key = post.put()
self.redirect("/blog/%d" % key.id())
else:
error = "Something went wrong. We need both a subject and content"
self.render("newpost.html",subject=subject, content=content, error=error)
app = webapp2.WSGIApplication([('/blog', Blog), ('/newpost', NewPost), ('/blog/(\d+)', Permalink)], debug=True)
还有我的 app.yaml:
application: 20-khz-udacity
version: 1
runtime: python27
api_version: 1
threadsafe: true
libraries:
- name: jinja2
version: latest
handlers:
- url: /blog/(\d+)
script: main.app
- url: /stylesheets
static_dir: stylesheets
- url: /.*
script: main.app
最后,用于索引的模板:
<!DOCTYPE html>
<html>
<head>
<link type="text/css" rel="stylesheet" href="stylesheets/styles.css" />
<title>CS 253 Blog</title>
</head>
<body>
<a href="/blog" class="main-title">Ray's Blog</a>
<div class="age">Queried 104973 seconds ago</div>
<div id="content">
{% for post in posts %}
<div class="post">
<div class="post-title">{{post.subject}}</div>
<div class="post-date">{{post.created}}</div>
<pre class="post-content">{{post.content}}</pre>
</div>
{% endfor %}
</div>
</body>
</html>
最后,可以在这里找到实际的应用程序:http: //20-khz-udacity.appspot.com/blog/
有人知道可能出了什么问题吗?