javascript - Bigcommerce模板: Javascript Error "Object doesn' t support property or method 'assign' "in Windows Safari and IE

Question

不确定发生了什么，但此错误导致页面无法显示。

错误消息指向我的bundle.js 文件(带有 webpack、babel 等的模板包)，特别是 stencil-utils 包中的 Object.assign() 方法。这是 @bigcommerce/stencil-utils/src/lib/request.js

的第 27 行

这是产生错误的代码部分。

const defaultOptions = {
    method: 'GET',
    remote: false,
    requestOptions: {
        formData: null,
        params: {},
        config: {},
        template: [],
    },
};
const options = Object.assign({}, defaultOptions, opts);
const data = options.requestOptions.formData ? options.requestOptions.formData : options.requestOptions.params;
const headers = {
    'stencil-config': options.requestOptions.config ? JSON.stringify(options.requestOptions.config) : '{}',
    'stencil-options': '{}',
};

有什么想法可能导致这种情况吗？

Answer 1

碰巧您正在使用 Object.assign方法，并非所有浏览器都支持。 Internet Explorer 和 Safari(适用于 Windows)均不再进行正式更新。

无论如何，在这个page中有一个Object.assign的polyfill 。您可以将其应用到代码顶部。

这是我自己的polyfill，它可以选择性地避免创建对象/数组引用(使用任何附加接口(interface)(如Image等的对象除外)。

typeof Object.assign !== "function" &&

(function() {

    /**
     * Return main instance of value.
     * @param {...} value
     * @returns 
     */
    function getMainInstance(value) {
        // get instance in this format: [object Instance]
        var ic = Object.prototype.toString.call(value);
        // returns string between '[object ' and ']'
        return ic.substring(ic.indexOf(" ") + 1, ic.lastIndexOf("]")).toLowerCase();
    }


    Object.assign = function(target) {

        /* check if target isn't a object */
        if (typeof target !== "object") target = {};

        /* last target path */
        var lastPath = target;

        /* list containing target paths */
        var locations = [];

        /* consume specific array/object */
        function consume(source) {
            /* iterate each property to copy */
            for (var i in source) {
                var instance = getMainInstance(source[i]);
                if (instance === "object" || instance === "array") {
                    lastPath =
                    lastPath[i] =
                    locations[locations.length] = (instance === "array" ? [] : {})

                    consume(source[i]);

                } else {
                    lastPath[i] = source[i];
                }
            }

            var len = -- locations.length;
            lastPath = locations[--len] || target;

        }

        for (var i = 1, source; source = arguments[i]; i++) {
            if (typeof source === "object") consume(source);
        }

        return target;
    };

})();