在Flask/WTForms/Google App Engine中格式化博客文章

Sea*_*ean 7 tinymce werkzeug jinja2 flask wtforms

这是简短的问题:

我的博客发表于......

http://www.seanbradley.biz/blog

......完全没有格式化.它们只是一大块明文.任何代码或HTML标记,例如/ n或<br /> ...更不用说h1,h2等......对文本在页面上的显示方式没有明显影响.

我正在使用部署在GAE上的WTForms运行Flask.我怎样才能解决这个问题?有没有办法在新的博客文章条目的表单字段中实现WYSGIWYG编辑器(如TinyMCE)?

我想要看起来像......一样简单优雅

http://www.quietwrite.com

要么

http://lucumr.pocoo.org/

...或者至少类似于Stackoverflow自己的编辑器.

格式化在发布时在上述所有帖子中呈现(而不是通过编辑器的grody overblown工具栏).

我不确定在我的帖子中禁止HTML标签的呈现是否与WTForms中的类的自定义有关,或者必须在GAE的数据存储中专门处理的内容,或者我需要在Flask中修复的内容(例如,模型为帖子).关于我 - 作为一个相对初级的开发者 - 可以将格式化到这些博客文章中的任何明确解决方案都能获得丰厚的回报.来自以下应用的具体代码......

注意:还有一个Flask-Markdown扩展,但我同样不确定如何集成它以实现我想要的效果.


详细问题,加上代码库中的代码片段

我在Google App Engine上运行Flask(当然还有Jinja模板/ Werkzeug路由),并且对于如何将WYSIWYG编辑器集成到我专门用于博客帖子的页面感到困惑...

我假设,如果合并TinyMCE,JavaScript的调用将放在模板的标题中......就像这样:

<script type="text/javascript" src="/static/js/tiny_mce/tiny_mce.js">
Run Code Online (Sandbox Code Playgroud)



但是,那么 - 因为,本身,模板或渲染页面本身没有 ,它不仅仅是 --TinyMCE的安装文档 - 也是在模板中添加以下代码块的问题......

<textarea cols="80" rows="10" id="articleContent" name="articleContent">
  &lt;h1&gt;Article Title&lt;/h1&gt;
  &lt;p&gt;Here's some sample text&lt;/p&gt;
</textarea>

<script type="text/javascript">
tinyMCE.init({
  theme : "advanced",
  theme_advanced_toolbar_location : "top",
  theme_advanced_toolbar_align : "left",
  mode : "exact",
  elements : "articleContent"
});
</script>
Run Code Online (Sandbox Code Playgroud)



目前,在模板文件的标签内......

<label for="title">{{ form.title.label }}</label>

{{ form.title|safe }}

{% if form.title.errors %}
    <ul class="errors">
        {% for error in form.title.errors %}
        <li>{{ error }}</li>
        {% endfor %}
    </ul>
{% endif %}

<label for="prose">{{ form.prose.label }}</label>

{{ form.prose|safe }}

...more WTForm validation / error handling...
Run Code Online (Sandbox Code Playgroud)



我怀疑问题是通过WTForms构建/管理表单的方式.WTForms位于我的/ packages/flaskext目录中.在某处需要以下内容......?

class wtforms.fields.TextAreaField(default field arguments, choices=[], coerce=????????, option_widget=????????)
Run Code Online (Sandbox Code Playgroud)


但TextAreaField是从(我不知道在哪里)导入的......并且不知道这是否是调整的正确位置/事物.是WTForm模块的init .py,file.py和/或html5.py中的答案吗?

如果我在帖子中包含的HTML标签在发布时呈现,我会很高兴...但是,对于那些不习惯使用HTML的人来说,轻松的方式可以让他们更容易理解他们的帖子.任何帮助我指向正确方向的人都非常感激!

如果需要,可以添加以下代码......



我的models.py中有以下课程...

class PostModel(db.Model):
    """New Post Model"""
    title = db.StringProperty(required = True)
    prose = db.TextProperty(required = True)
    when = db.DateTimeProperty(auto_now_add = True)
    author = db.UserProperty(required = True)
Run Code Online (Sandbox Code Playgroud)



我的forms.py中的以下课程......

class PostForm(wtf.Form):
    title = wtf.TextField('Title: something buzz-worthy...', validators=[validators.Required()])
    prose = wtf.TextAreaField('Content: something beautiful...', validators=[validators.Required()])
Run Code Online (Sandbox Code Playgroud)

Sea*_*ira 5

将 HTML 编码为 HTML 的问题很可能发生在呈现时而不是写入时。如果您的 HTML 仍然是 HTML 而不是 HTML,&lt;tag&gt;那么当您接收回数据并将其保存在数据存储中时,您需要将渲染标记为安全:

{% for post in posts %}
<h2>{{ post.title | safe }}<h2>
<article>{{ post.content | safe }}</article>
{% endfor %}
Run Code Online (Sandbox Code Playgroud)

此外,在 WTForms 中,Field.Label(如form.prose.label)实际上呈现了一个完整的标签(无需将对其的调用包装在预呈现的标签中。)