Highcharts 动态名称与 coldfusion

Question

我正在使用 Highcharts 来显示饼图。我正在尝试输出具有两个字段的 coldfusion 查询。分类名称和计数。我正在努力显示名称。当我将名称设置为 'Classification' 之类的名称时，它会起作用并根据计数构建图表。如果我将#classification# 变量添加到名称中，它不会显示任何内容。

这是我正在尝试但没有结果的方法。

series: [{
    name: 'Classification',
    colorByPoint: true,
    data: [
    <cfoutput query="qryCounts">
    {
        name: #classification#,
        y: #count#
    },
    </cfoutput>
  ]
}]

这是有效的方法，但每个分类都显示相同的名称。

series: [{
        name: 'Classification',
        colorByPoint: true,
        data: [
        <cfoutput query="qryCounts">
        {
            name: 'Classification',
            y: #count#
        },
        </cfoutput>
      ]
    }]

对我做错了什么有什么想法吗？

Answer 1

每当您将 cfml 变量输出为直接 Javascript 代码时，始终尝试使用 encodeForJavascript()。

这将确保：

字符串被正确转义，因此您的 Javascript 不会中断（例如，当撇号、反斜杠 , 换行符或其他特殊字符在你的字符串中)
您的应用程序更安全地抵御 XSS 攻击

要检测由 non-escaped 变量创建的此类 Javascript 错误，请查看浏览器 Web 开发工具中的控制台输出（正如其中一位评论者所提到的）。在那里你会看到代码和字符串打破了 Javascript 异常。

此外，如果您将 Javascript 注入到 html 属性中，例如 'onClick' 您最好也使用 encodeForHTMLAttribute() 进行编码，例如：

<cfsavecontent variable="alertText">
 "This text has linebreaks,
slashes like / or \ and apostrophes ' that
would break any javascript code on output" but also german umlaute lke ä or ö or ü
</cfsavecontent>
<cfoutput>

    <button onClick="alert('#encodeForHTMLAttribute( encodeForJavascript( alertText ) )#');">Working click me</button>

    <button onClick="alert('#alertText#');">Broken click me</button>

</cfoutput>

Highcharts 动态名称与 coldfusion

Highcharts dynamic name with coldfusion

coldfusion

highcharts