烧瓶和Jinja2漂白剂，图像HTML不工作 [英] Flask and Jinja2 with bleach, image HTML not working

问题描述

我已经为一个项目创建了一个小博客，只有我作为用户可以访问发布页面。我以前一直在使用Flask教程，它的最终产品使您能够使用漂白和Markdown将HTML传递并通过Jinja2模板传递。

在我的 models.py 文件中，这些是允许的标签。

  @staticmethod 
 
 def on_changed_body（target，value，oldvalue，initiator）：
 allowed_tags = ['a'，'abbr '，'首字母缩略词'，'b'，'blockquote'，'code'，
'em'，'i'，'li'，'ol'，'pre'，'strong'，'ul'， 
'h1'，'h2'，'h3'，'p'，'img'，'video'，'div'，'iframe'，'p'，'br'，'span'，'hr '，'src'，'class'] 
 target.body_html = bleach.linkify（bleach.clean（
 markdown（value，output_format ='html'），
 tags = allowed_tags，strip = False））
  

我添加了一些img和嵌入标签，因为这些对我的博客很重要。我有一个由一些文本和图像组成的示例文章，它正在被保存到（SQLAlchemy MySQL）数据库，正是我写的。下面是直接从数据库。

 < p>你好< / p> 
 
< img src =https://catastrophicfindings.files.wordpress.com/2012/07/moomin-childhood-memories-260482_829_494.jpg> 
 
< marquee> Bye< / marquee> 
  

另外，我的博客文章下方还有一个字段，显示了HTML的预览。图片显示的是预期的，所以我知道这很好，< marquee>< / marquee> 标签显示为标记。

在我的模板文件中，我传递了这样的body_html。

  {％if post.body_html ％} 
 {{post.body_html |安全}} 
 {％else％} 
 {{post.body}} 
 {％endif％} 
  

当我在浏览器中导航到该文章时，该图像根本不出现。然而，选取框标签显示为< marquee> Bye< / marquee> ，并且在开发者控制台中进一步检查，< img> / code>标签出现在HTML中，没有'src'属性。



有什么方法可以解决这个问题吗？这是Jinja的配置吗？有没有办法来声明允许的属性，如果这是解决方案？

谢谢。

解决方案

从漂白文档中直接取得了成果：

属性kwarg是属性的白名单。它可以是一个列表，在这种情况下，任何标签或字典都允许使用这些属性，在这种情况下，这些键是标签名称（或通配符：*表示所有标签），值是允许的属性列表。因此，我在 models.py
$ $ $ $ $ c $ @ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ allowed_tags = ['a'，'abbr'，'acronym'，'b'，'blockquote'，'code'，
'em'，'i'，'li'，'ol'，'pre' ，'strong'，'ul'，
'h1'，'h2'，'h3'，'p'，'img'，'video'，'div'，'iframe'，'p'，' br'，'span'，'hr'，'src'，'class']
allowed_attrs = {'*'：['class']，
'a'：['href'，' rel']，
'img'：['s rc'，'alt']}
target.body_html = bleach.linkify（bleach.clean（
markdown（value，output_format ='html'），
tags = allowed_tags，strip = False ，attributes = allowed_attrs））


这非常有效。我会调整它以适应嵌入。

I have been creating a small blog for myself for a project, only I, as the user, can access the posting page. I had previously been following a Flask tutorial, the end product of which enables you to post HTML and pass it through the Jinja2 templating, using bleach and Markdown.

In my models.py file, these are the allowed tags.

@staticmethod

def on_changed_body(target, value, oldvalue, initiator):
    allowed_tags = ['a', 'abbr', 'acronym', 'b', 'blockquote', 'code',
                    'em', 'i', 'li', 'ol', 'pre', 'strong', 'ul',
                    'h1', 'h2', 'h3', 'p', 'img', 'video', 'div', 'iframe', 'p', 'br', 'span', 'hr', 'src', 'class']
    target.body_html = bleach.linkify(bleach.clean(
        markdown(value, output_format='html'),
        tags=allowed_tags, strip=False))

I have added some img and embedding tags, as these are important to my blog. I have an example post consisting of some text and an image, which is being saved to the (SQLAlchemy MySQL) database exactly how I have written it. Below is taken straight from the database.

<p>Hello</p>

<img src="https://catastrophicfindings.files.wordpress.com/2012/07/moomin-childhood-memories-260482_829_494.jpg">

<marquee>Bye</marquee>

Also, I have a field below my blog post form that displays a preview of the HTML. The image appears as intended, so I know this is fine, and the <marquee></marquee> tag appears as markup.

In my template file, I am passing this body_html like so.

{% if post.body_html %}
    {{ post.body_html | safe }}
{% else %}
    {{ post.body }}
{% endif %}

When I then navigate to the post in my browser, the image does not appear at all. However the marquee tag appears as <marquee>Bye</marquee>, and on further inspection in the developer console, an <img> tag is appearing in the HTML, just without the 'src' attribute.

Is there any way to fix this? Would this be something in the configuration of Jinja? Is there a way to declare allowed attributes, if this was the solution?

Thank you.

解决方案

A little more patience and some googling proved fruitful, taken straight from the bleach docs:

The attributes kwarg is a whitelist of attributes. It can be a list, in which case the attributes are allowed for any tag, or a dictionary, in which case the keys are tag names (or a wildcard: * for all tags) and the values are lists of allowed attributes.

So, I added a dict of desired attributes into my bleach.clean function in models.py:

 @staticmethod
    def on_changed_body(target, value, oldvalue, initiator):
        allowed_tags = ['a', 'abbr', 'acronym', 'b', 'blockquote', 'code',
                        'em', 'i', 'li', 'ol', 'pre', 'strong', 'ul',
                        'h1', 'h2', 'h3', 'p', 'img', 'video', 'div', 'iframe', 'p', 'br', 'span', 'hr', 'src', 'class']
        allowed_attrs = {'*': ['class'],
                        'a': ['href', 'rel'],
                        'img': ['src', 'alt']}
        target.body_html = bleach.linkify(bleach.clean(
            markdown(value, output_format='html'),
            tags=allowed_tags, strip=False, attributes=allowed_attrs))

And this works fantastically. I will be adjusting it to accommodate embedding also.

这篇关于烧瓶和Jinja2漂白剂，图像HTML不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！