0

ページダウンエディターを使用しています。プレビューを生成するために使用しているコードは次のとおりです。

$(document).ready(function () {
    var previewConverter = Markdown.getSanitizingConverter();
    var editor = new Markdown.Editor(previewConverter);
    editor.run();
});

入力にテキストを入力している間:

ここに画像の説明を入力

動的に生成された出力プレビューは期待どおりになり、次のようになります。

ここに画像の説明を入力

次に、コンテンツ (以下に示す純粋な入力テキスト) がデータベースに保存されます。

"http://www.google.com\n\n<script>alert('hi');</script>\n\n[google][4]\n\n\n  [1]: http://www.google.com"

サーバー側では、ページがレンダリングされる前に、このmarkdownsharp ライブラリ v1.13.0.0を使用して、データベース テキストから取得したテキストを変換しています。変換後、ここで見つけた Jeff Atwood のコードを使用して html をサニタイズしています。

    private static Regex _tags = new Regex("<[^>]*(>|$)",
    RegexOptions.Singleline | RegexOptions.ExplicitCapture | RegexOptions.Compiled);
private static Regex _whitelist = new Regex(@"
    ^</?(b(lockquote)?|code|d(d|t|l|el)|em|h(1|2|3)|i|kbd|li|ol|p(re)?|s(ub|up|trong|trike)?|ul)>$|
    ^<(b|h)r\s?/?>$",
    RegexOptions.Singleline | RegexOptions.ExplicitCapture | RegexOptions.Compiled | RegexOptions.IgnorePatternWhitespace);
private static Regex _whitelist_a = new Regex(@"
    ^<a\s
    href=""(\#\d+|(https?|ftp)://[-a-z0-9+&@#/%?=~_|!:,.;\(\)]+)""
    (\stitle=""[^""<>]+"")?\s?>$|
    ^</a>$",
    RegexOptions.Singleline | RegexOptions.ExplicitCapture | RegexOptions.Compiled | RegexOptions.IgnorePatternWhitespace);
private static Regex _whitelist_img = new Regex(@"
    ^<img\s
    src=""https?://[-a-z0-9+&@#/%?=~_|!:,.;\(\)]+""
    (\swidth=""\d{1,3}"")?
    (\sheight=""\d{1,3}"")?
    (\salt=""[^""<>]*"")?
    (\stitle=""[^""<>]*"")?
    \s?/?>$",
    RegexOptions.Singleline | RegexOptions.ExplicitCapture | RegexOptions.Compiled | RegexOptions.IgnorePatternWhitespace);


/// <summary>
/// sanitize any potentially dangerous tags from the provided raw HTML input using 
/// a whitelist based approach, leaving the "safe" HTML tags
/// CODESNIPPET:4100A61A-1711-4366-B0B0-144D1179A937
/// </summary>
public static string Sanitize(string html)
{
    if (String.IsNullOrEmpty(html)) return html;

    string tagname;
    Match tag;

    // match every HTML tag in the input
    MatchCollection tags = _tags.Matches(html);
    for (int i = tags.Count - 1; i > -1; i--)
    {
        tag = tags[i];
        tagname = tag.Value.ToLowerInvariant();

        if(!(_whitelist.IsMatch(tagname) || _whitelist_a.IsMatch(tagname) || _whitelist_img.IsMatch(tagname)))
        {
            html = html.Remove(tag.Index, tag.Length);
            System.Diagnostics.Debug.WriteLine("tag sanitized: " + tagname);
        }
    }

    return html;
}

変換とサニタイズ プロセスは次のとおりです。

    var md = new MarkdownSharp.Markdown();            
    var unsafeHtml = md.Transform(content);
    var safeHtml = Sanitize(unsafeHtml);
    return new HtmlString(safeHtml);

unsafeHtml含む

"<p>http://www.google.com</p>\n\n<script>alert('hi');</script>\n\n<p><a href=\"http://www.google.com\">google</a></p>\n"

safeHtml含む

"<p>http://www.google.com</p>\n\nalert('hi');\n\n<p><a href=\"http://www.google.com\">google</a></p>\n"

これは次のようにレンダリングされます。

ここに画像の説明を入力

したがって、サニタイズと 2 番目のリンクは期待どおりに変換されました。残念ながら、最初のリンクはもはやリンクではなく、単なるテキストです。これを修正するには?

おそらくより良いアプローチは、サーバー側の変換を使用するのではなく、javascript を使用してページにマークダウン テキストをレンダリングすることですか?

4

1 に答える 1

0

関数Markdown.Converter.jsを見つけることができます。飾り気のない生のハイパーリンク_DoAutoLinks(text)を自動的に追加<し、その周りに自動リンクするセクションがあります。これが理由です><http://example.com>

http://www.google.com

最初に次のように変換されます:

<http://www.google.com> 

そして、次のようにします。

<a href="http://www.google.com">http://www.google.com</a>

私の一時的な回避策は、c# 側で同様のことを行うことです。

var unsafeHtml = DoAutolinks(md.Transform(content));

private static string DoAutolinks(string content)
{            
    /* url pattern - from msdn.microsoft.com/en-us/library/ff650303.aspx */
    const string url = @"(ht|f)tp(s?)\:\/\/[0-9a-zA-Z]([-.\w]*[0-9a-zA-Z])*(:(0-9)*)*(\/?)([a-zA-Z0-9\-\.\?\,\'\/\\\+&amp;%\$#_]*)?";
    const string pattern = @"<p>(?<url>" + url + ")</p>";
    var result = Regex.Replace(content, pattern, "<p><a href=\"${url}\">${url}</a></p>");
    return result;
}

そのような機能 - 飾られていないリンクの変換を担当するものは、 markdownsharp に含める必要がありますか?

于 2012-09-21T14:23:07.233 に答える