在 C# Razor 中将字符串呈现为 HTML

Posted 2023-03-05

【中文标题】在 C# Razor 中将字符串呈现为 HTML

【英文标题】：Render a string as HTML in C# Razor

【发布时间】：2015-02-01 18:49:11

【问题描述】：

我正在尝试从我的模型中呈现地址。该字符串包含我用中断标记替换的换行符。虽然，它在页面上呈现为字符串而不是 html。如何强制我的字符串呈现为 HTML？

尝试：

<span id="addressLine">
    @Model.MyData.Address.Replace("\r\n", "<br />");
</span>

页面上的结果：

Address Top<br />Street Name<br />City<br />PostCode

应显示为：

Address Top
Street Name
City
PostCode

【问题讨论】：

你应该拆分字符串。

@DanielA.White - 对不起，伙计，第一天使用 C#。所以我应该将它拆分并保存为不同的变量并在不同的行上渲染它们？

使用@Html.Raw(Model.MyData.Address.Replace("\r\n", "<br />"))

@Dom - 干杯，工作完美。发布为答案。

<br/> 在<span> 内？畏缩！

【参考方案1】：

使用 css 保留空白

HTML

<div id="addressLine">
  @Model.MyData.Address;
</div>

CSS

#addressLine 
  white-space: pre;

【讨论】：

您也可以使用默认具有此空白行为的<pre> 标签。例如。 <pre>Model.MyData.Address</pre>。见w3schools.com/tags/tag_pre.asp。此外，您不应该使用HtmlRaw，它仅在 Model.MyData.Address 包含要包含在输出中的文字 HTML 时使用而不转义。

这个答案也更好，因为你不再需要使用Html.Raw。

这个答案只是关于 css，而不是关于 html 编码或像剃刀一样呈现 html。这发生在服务器端，在这种情况下与 css 关系不大。

【参考方案2】：

使用@Html.Raw(Model.MyData.Address.Replace("\r\n", "<br />"))

【讨论】：

小心使用这个，如果用户的地址是1234 <script>alert('a')</script> lane，就会有xss问题

@JohnKoerner - 别担心，我们会清除所有内容并格式化地址，然后再将其保存到数据库中。不过感谢您的提醒。

这不再是最佳答案。下面的几个答案使用避免使用Html.Raw 的CSS/HTML 策略。换行符的问题是 CSS/HTML 问题，现代浏览器可以控制（使用 CSS/HTML）以按照您的意愿行事。

【参考方案3】：

您应该使用 CSS whitespace 属性来代替它。 更多详情，请访问http://www.w3schools.com/cs-s-ref/pr_text_white-space.asp

它还可以帮助您避免跨站点脚本 (http://en.wikipedia.org/wiki/Cross-site_scripting)

【参考方案4】：

使用

@(new HtmlString(@Model.MyData.Address))

更安全，让您避免潜在的 xss 攻击

看到这个帖子： Rendering HTML as HTML in Razor

【讨论】：

如何避免潜在的 xss 攻击？它只是一个字符串的包装，表示当在视图上使用时，内容不应被编码，因此任何不受信任的内容都将显示为与 Html.Raw 相同。

【参考方案5】：

要在 blazor 上呈现 HTML，您可以使用 MarkupString => @((MarkupString)here your string) 这会将字符串呈现为 HTML

<span id="addressLine">
    @((MarkupString)@Model.MyData.Address.Replace("\r\n", "<br />"));
</span>