javascript - ACE 文本编辑器显示文本字符代替空格

Question

我编写了以下 Javascript:

(function () {
    var computationModule = (function foo1(stdlib, foreign, heap) {
        "use asm";
        var sqrt = stdlib.Math.sqrt,
            heapArray = new stdlib.Int32Array(heap),
            outR = 0.0,
            outI = 0.0;

        function computeRow(canvasWidth, canvasHeight, limit, max, rowNumber, minR, maxR, minI, maxI) {
            canvasWidth = +canvasWidth;
            canvasHeight = +canvasHeight;
            limit = +limit;
            max = max | 0;
            rowNumber = +rowNumber;
            minR = +minR;
            maxR = +maxR;
            minI = +minI;
            maxI = +maxI;

            var columnNumber = 0.0,
                zReal = 0.0,
                zImaginary = 0.0,
                numberToEscape = 0;
            var columnNumberInt = 0;

            // Compute the imaginary part of the numbers that correspond to pixels in this row.
            zImaginary = +(((maxI - minI) * +rowNumber) / +canvasHeight + minI);
            // Iterate over the pixels in this row.
            // Compute the number of iterations to escape for each pixel that will determine its color.
            for (columnNumber = +0; + columnNumber < +canvasWidth; columnNumber = +(+columnNumber + 1.0)) {
                // Compute the real part of the number for this pixel.
                zReal = +(((maxR - minR) * +columnNumber) / +canvasWidth + minR);
                numberToEscape = howManyToEscape(zReal, zImaginary, max, limit) | 0;
                columnNumberInt = columnNumberInt + 1 | 0;
                heapArray[(columnNumberInt * 4) >> 2] = numberToEscape | 0;
            }
        }

        // Function to determine how many iterations for a point to escape.
        function howManyToEscape(r, i, max, limit) {
            r = +r;
            i = +i;
            max = max | 0;
            limit = +limit;

            var j = 0,
                ar = 0.0,
                ai = 0.0;
            ar = +r;
            ai = +i;
            for (j = 0;
                (j | 0) < (max | 0); j = (j + 1) | 0) {
                iteratingFunction(ar, ai, r, i)
                ar = outR;
                ai = outI;
                if (+(ar * ar + ai * ai) >= +(limit * limit))
                    return j | 0;
            }
            return j | 0;
        }

        // The iterating function defining the fractal to draw
        // r and i are the real and imaginary parts of the value from the previous iteration
        // r0 and i0 are the starting points
        function iteratingFunction(r, i, r0, i0) {
            r = +r;
            i = +i;
            r0 = +r0;
            i0 = +i0;
            computePower(r, i, 2);
            // Set the output from this function to t
            outR = +(r0 + outR);
            outI = +(i0 + outI);
        }

        // Compute the result of [r,i] raised to the power n.
        // Place the resulting real part in outR and the imaginary part in outI.
        function computePower(r, i, n) {
            // Tell asm.js that r, i are floating point and n is an integer.
            r = +r;
            i = +i;
            n = n | 0;

            // Declare and initialize variables to be numbers.
            var rResult = 0.0;
            var iResult = 0.0;
            var j = 0;
            var tr = 0.0;
            var ti = 0.0;

            // Declare and initialize variables that will be used only in the
            // event we need to compute the reciprocal.
            var abs = 0.0;
            var recr = 0.0;
            var reci = 0.0;

            if ((n | 0) < (0 | 0)) {
                // For n less than 0, compute the reciprocal and then raise it to the opposite power.
                abs = +sqrt(r * r + i * i);
                recr = r / abs;
                reci = -i / abs;
                r = recr;
                i = reci;
                n = -n | 0;
            }

            rResult = r;
            iResult = i;

            for (j = 1;
                (j | 0) < (n | 0); j = (j + 1) | 0) {
                tr = rResult * r - iResult * i;
                ti = rResult * i + iResult * r;
                rResult = tr;
                iResult = ti;
            }

            outR = rResult;
            outI = iResult;
        } // end computePower

        return {
            computeRow: computeRow
        };
    })(self, foreign, heap);

    // Return computationModule that we just defined.
    return computationModule;
})();

除了我想让我的 Web 应用程序在 ACE 文本编辑器 (http://ace.c9.io/) 中显示 Javascript 以便用户可以在运行时修改代码外，这个 Javascript 没有什么特别不寻常的地方。

我使用 jQuery AJAX 加载 Javascript，然后将 ACE 编辑器的内容设置为 Javascript 代码。用户修改代码后，可以点击按钮运行代码。 (这使用 eval)

我遇到的问题是 ACE 显示的是奇怪的字符而不是空格。

奇怪的是，如果我尝试从 ACE 编辑器中复制文本，奇怪的字符会消失，而空格是正常的。此外，即使显示这些奇怪的字符，代码也能正常运行。

我还注意到，使用 Firefox 时不会出现该问题，但会出现在 Chrome 和 IE 11 中。

最后，只有当我将代码放在真实的网络服务器上时才会出现问题。它不会在我的开发环境中重现。

再看一下，我发现这不仅仅是我通过 AJAX 加载的文本。即使我键入新空格，也会出现更多文本字符!

可能出了什么问题导致文本无法正确显示？

这是应用程序的链接:http://danielsadventure.info/html5fractal/

Answer 1

使用 charset="utf-8"在包含 ace 的脚本标记中。

<script src="path/to/ace.js" charset="utf-8">

这可能与此有关:

When no explicit charset parameter is provided by the sender, media subtypes of the "text" type are defined to have a default charset value of "ISO-8859-1" when received via HTTP. Data in character sets other than "ISO-8859-1" or its subsets MUST be labeled with an appropriate charset value. See section 3.4.1 for compatibility problems.

http://www.w3.org/Protocols/rfc2616/rfc2616-sec3.html#sec3.7.1

所以传递给脚本的字符串的编码不同于 ACE(或一般的 JS)所期望的编码，即 UTF-8 .