【问题标题】:JSON2 Error / Conflict with another scriptJSON2 错误/与另一个脚本冲突
【发布时间】:2012-01-08 01:24:20
【问题描述】:

我正在使用 JSON2 库以便使用 JSON.stringify 将一些 JSON 数据发送到我的 MVC 控制器。

当我在视图中包含另一个脚本 (Telerik MVC) 时,我开始在使用 IE7 时遇到脚本冲突。

当我单击网格中的刷新按钮时,出现以下错误:

Line: 191
Error: Object doesn't support this property or method

String.prototype.toJSON      =
    Number.prototype.toJSON  =
    Boolean.prototype.toJSON = function (key) {
        return this.valueOf();
    };

错误发生在以下行:

return this.valueOf();

有没有人知道为什么会发生这种冲突以及如何解决它?具体来说,为什么这在 IE8/Chrome 中有效,但在 IE7 中失败。什么会导致错误?两个脚本是否都试图定义相同的方法,这就是它失败的原因,或者如果不挖掘大量代码就无法判断?

编辑:
这是我说的 json2.js 库:https://github.com/douglascrockford/JSON-js

【问题讨论】:

  • 您在 IE8/Chrome 中没有看到此错误的原因是他们 natively support JSON,这是外部实现通常在连接自己的逻辑之前寻找的东西。

标签: asp.net-mvc json telerik-grid telerik-mvc


【解决方案1】:

可能回复太晚了,但我认为值得回复,因为这可能会挽救一些宝贵的生命;)

如果存在现有实现(本机或包含),则 JSON2 脚本不会初始化/扩展 JSON 对象。但是,如果 JSON 对象不存在,脚本将创建该对象并为其附加一些方法(准确地说是 JSON.stringify 和 JSON.parse)。然而,为了使这些方法起作用,还有其他对象(如 Date、String、Number 和 Boolean 对象)需要扩展以支持某些方法(如 toJSON 方法)。 JSON2 脚本也负责扩展所需的对象。

现在来到这里(Telerik MVC)的具体问题。在与 Telerik 合作进行其中一个项目时,我遇到了同样的问题。但是我能够追踪它。可能的原因是 Telerik 脚本和当前 JSON2 脚本之间的冲突。 Date 和 Boolean Objects 的 toJSON 方法在某种程度上与 Telerik 对这两个对象的相同方法的实现相冲突,这在某些地方会破坏 Telerik 脚本。我已经修改了 JSON2 库以进行更强大的检查,该检查在任何情况下都不会失败(即使在页面上使用 Telerik MVC 时也是如此)。我已经测试了脚本,它对我来说很好,但是如果有人发现任何进一步的冲突,请回复。

var JSON;
if (!JSON) {
    JSON = {};
}
(function () {
    'use strict';
    function f(n) {
        // Format integers to have at least two digits.
        return n < 10 ? '0' + n : n;
    }
    if (typeof Date.prototype.toJSON !== 'function') {
        Date.prototype.toJSON = function (key) {
            return isFinite(this.valueOf())
                ? this.getUTCFullYear()             + '-' +
                    f(this.getUTCMonth() + 1)       + '-' +
                    f(this.getUTCDate())            + 'T' +
                    f(this.getUTCHours())           + ':' +
                    f(this.getUTCMinutes())         + ':' +
                    f(this.getUTCSeconds())         + /*added - start*/ '.'+
                    f(this.getUTCMilliseconds())    + /*added - end*/ 'Z'
                : null;
        };

        //pushed the below code outside current if block
        // String.prototype.toJSON      =
            // Number.prototype.toJSON  =
            // Boolean.prototype.toJSON = function (key) {
                // return this.valueOf();
            // };
    }

    /*added - start*/ 
     if (typeof String.prototype.toJSON !== 'function') {
      String.prototype.toJSON = function (key) {
                    return ((typeof this.valueOf === 'function') ? this.valueOf(): this.toString());
                };
     }

     if (typeof Number.prototype.toJSON !== 'function') {
      Number.prototype.toJSON = function (key) {
                    return ((typeof this.valueOf === 'function') ? this.valueOf(): this.toString());
                };
     }
     if (typeof Boolean.prototype.toJSON !== 'function') {
      Boolean.prototype.toJSON = function (key) {
                    return ((typeof this.valueOf === 'function') ? this.valueOf(): this.toString());
                };
     }
     /*added - end*/

    var cx = /[\u0000\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g,
        escapable = /[\\\"\x00-\x1f\x7f-\x9f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g,
        gap,
        indent,
        meta = {    // table of character substitutions
            '\b': '\\b',
            '\t': '\\t',
            '\n': '\\n',
            '\f': '\\f',
            '\r': '\\r',
            '"' : '\\"',
            '\\': '\\\\'
        },
        rep;

    function quote(string) {
// If the string contains no control characters, no quote characters, and no
// backslash characters, then we can safely slap some quotes around it.
// Otherwise we must also replace the offending characters with safe escape
// sequences.
        escapable.lastIndex = 0;
        return escapable.test(string) ? '"' + string.replace(escapable, function (a) {
            var c = meta[a];
            return typeof c === 'string'
                ? c
                : '\\u' + ('0000' + a.charCodeAt(0).toString(16)).slice(-4);
        }) + '"' : '"' + string + '"';
    }

    function str(key, holder) {
// Produce a string from holder[key].
        var i,          // The loop counter.
            k,          // The member key.
            v,          // The member value.
            length,
            mind = gap,
            partial,
            value = holder[key];
// If the value has a toJSON method, call it to obtain a replacement value.
        if (value && typeof value === 'object' &&
                typeof value.toJSON === 'function') {
            value = value.toJSON(key);
        }
// If we were called with a replacer function, then call the replacer to
// obtain a replacement value.
        if (typeof rep === 'function') {
            value = rep.call(holder, key, value);
        }
// What happens next depends on the value's type.
        switch (typeof value) {
        case 'string':
            return quote(value);
        case 'number':
// JSON numbers must be finite. Encode non-finite numbers as null.
            return isFinite(value) ? String(value) : 'null';
        case 'boolean':
        case 'null':
// If the value is a boolean or null, convert it to a string. Note:
// typeof null does not produce 'null'. The case is included here in
// the remote chance that this gets fixed someday.
            return String(value);
// If the type is 'object', we might be dealing with an object or an array or
// null.
        case 'object':
// Due to a specification blunder in ECMAScript, typeof null is 'object',
// so watch out for that case.
            if (!value) {
                return 'null';
            }
// Make an array to hold the partial results of stringifying this object value.
            gap += indent;
            partial = [];
// Is the value an array?
            if (Object.prototype.toString.apply(value) === '[object Array]') {
// The value is an array. Stringify every element. Use null as a placeholder
// for non-JSON values.
                length = value.length;
                for (i = 0; i < length; i += 1) {
                    partial[i] = str(i, value) || 'null';
                }
// Join all of the elements together, separated with commas, and wrap them in
// brackets.
                v = partial.length === 0
                    ? '[]'
                    : gap
                    ? '[\n' + gap + partial.join(',\n' + gap) + '\n' + mind + ']'
                    : '[' + partial.join(',') + ']';
                gap = mind;
                return v;
            }
// If the replacer is an array, use it to select the members to be stringified.
            if (rep && typeof rep === 'object') {
                length = rep.length;
                for (i = 0; i < length; i += 1) {
                    if (typeof rep[i] === 'string') {
                        k = rep[i];
                        v = str(k, value);
                        if (v) {
                            partial.push(quote(k) + (gap ? ': ' : ':') + v);
                        }
                    }
                }
            } else {
// Otherwise, iterate through all of the keys in the object.
                for (k in value) {
                    if (Object.prototype.hasOwnProperty.call(value, k)) {
                        v = str(k, value);
                        if (v) {
                            partial.push(quote(k) + (gap ? ': ' : ':') + v);
                        }
                    }
                }
            }
// Join all of the member texts together, separated with commas,
// and wrap them in braces.
            v = partial.length === 0
                ? '{}'
                : gap
                ? '{\n' + gap + partial.join(',\n' + gap) + '\n' + mind + '}'
                : '{' + partial.join(',') + '}';
            gap = mind;
            return v;
        }
    }
// If the JSON object does not yet have a stringify method, give it one.
    if (typeof JSON.stringify !== 'function') {
        JSON.stringify = function (value, replacer, space) {
// The stringify method takes a value and an optional replacer, and an optional
// space parameter, and returns a JSON text. The replacer can be a function
// that can replace values, or an array of strings that will select the keys.
// A default replacer method can be provided. Use of the space parameter can
// produce text that is more easily readable.
            var i;
            gap = '';
            indent = '';
// If the space parameter is a number, make an indent string containing that
// many spaces.
            if (typeof space === 'number') {
                for (i = 0; i < space; i += 1) {
                    indent += ' ';
                }
// If the space parameter is a string, it will be used as the indent string.
            } else if (typeof space === 'string') {
                indent = space;
            }
// If there is a replacer, it must be a function or an array.
// Otherwise, throw an error.
            rep = replacer;
            if (replacer && typeof replacer !== 'function' &&
                    (typeof replacer !== 'object' ||
                    typeof replacer.length !== 'number')) {
                throw new Error('JSON.stringify');
            }
// Make a fake root object containing our value under the key of ''.
// Return the result of stringifying the value.
            return str('', {'': value});
        };
    }

// If the JSON object does not yet have a parse method, give it one.
    if (typeof JSON.parse !== 'function') {
        JSON.parse = function (text, reviver) {
// The parse method takes a text and an optional reviver function, and returns
// a JavaScript value if the text is a valid JSON text.
            var j;
            function walk(holder, key) {
// The walk method is used to recursively walk the resulting structure so
// that modifications can be made.
                var k, v, value = holder[key];
                if (value && typeof value === 'object') {
                    for (k in value) {
                        if (Object.prototype.hasOwnProperty.call(value, k)) {
                            v = walk(value, k);
                            if (v !== undefined) {
                                value[k] = v;
                            } else {
                                delete value[k];
                            }
                        }
                    }
                }
                return reviver.call(holder, key, value);
            }

// Parsing happens in four stages. In the first stage, we replace certain
// Unicode characters with escape sequences. JavaScript handles many characters
// incorrectly, either silently deleting them, or treating them as line endings.
            text = String(text);
            cx.lastIndex = 0;
            if (cx.test(text)) {
                text = text.replace(cx, function (a) {
                    return '\\u' +
                        ('0000' + a.charCodeAt(0).toString(16)).slice(-4);
                });
            }
// In the second stage, we run the text against regular expressions that look
// for non-JSON patterns. We are especially concerned with '()' and 'new'
// because they can cause invocation, and '=' because it can cause mutation.
// But just to be safe, we want to reject all unexpected forms.
// We split the second stage into 4 regexp operations in order to work around
// crippling inefficiencies in IE's and Safari's regexp engines. First we
// replace the JSON backslash pairs with '@' (a non-JSON character). Second, we
// replace all simple value tokens with ']' characters. Third, we delete all
// open brackets that follow a colon or comma or that begin the text. Finally,
// we look to see that the remaining characters are only whitespace or ']' or
// ',' or ':' or '{' or '}'. If that is so, then the text is safe for eval.
            if (/^[\],:{}\s]*$/
                    .test(text.replace(/\\(?:["\\\/bfnrt]|u[0-9a-fA-F]{4})/g, '@')
                        .replace(/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g, ']')
                        .replace(/(?:^|:|,)(?:\s*\[)+/g, ''))) {
// In the third stage we use the eval function to compile the text into a
// JavaScript structure. The '{' operator is subject to a syntactic ambiguity
// in JavaScript: it can begin a block or an object literal. We wrap the text
// in parens to eliminate the ambiguity.
                j = eval('(' + text + ')');
// In the optional fourth stage, we recursively walk the new structure, passing
// each name/value pair to a reviver function for possible transformation.
                return typeof reviver === 'function'
                    ? walk({'': j}, '')
                    : j;
            }
// If the text is not JSON parseable, then a SyntaxError is thrown.
            throw new SyntaxError('JSON.parse');
        };
    }
}());

注意: 上面的代码不是我的实现。它来自源 https://github.com/douglascrockford/JSON-js 我刚刚对其进行了一些修改以避免与 Telerik 或其他任何冲突。

【讨论】:

    【解决方案2】:

    我也遇到过同样的问题。 除了按照您的建议编辑 json2.js 文件外,我找不到任何其他解决方案,谢谢。

    但是,我发现这可以解决 IE7 的问题,并且仍然可以在 IE8/9 和 firefox 中工作,但它现在停止在 Chrome 中工作(“this” for [this.valueOf === 'function']未定义)。

    您是否也遇到过这个问题,或者您的问题在 Chrome 中是否有效?我试图弄清楚这是否与我的数据或 Telerik-internal 有关。

    感谢您的帖子!

    编辑: 现在,如果“this”未定义/为空(在所有三个函数中),我刚刚返回空。似乎适用于所有浏览器,并允许 Telerik 网格重新绑定而不会出现问题。 不过,我不知道这在 json2.js .toJSON 方法的全局上下文中有多正确。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2011-10-07
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多