掃二維碼與項(xiàng)目經(jīng)理溝通
我們?cè)谖⑿派?4小時(shí)期待你的聲音
解答本文疑問(wèn)/技術(shù)咨詢/運(yùn)營(yíng)咨詢/技術(shù)建議/互聯(lián)網(wǎng)交流
在幾個(gè)月前我們?cè)谖?gòu)網(wǎng)絡(luò)官網(wǎng)上面發(fā)布過(guò)一篇名為《基于七牛云JavaScript SDK一行代碼實(shí)現(xiàn)大文件分片斷點(diǎn)續(xù)傳》的文章,這篇文章在網(wǎng)上應(yīng)該至少被數(shù)百人次查閱過(guò),也接到好幾個(gè)人進(jìn)一步的問(wèn)題咨詢。其中有一個(gè)問(wèn)題是一個(gè)共性問(wèn)題,都認(rèn)為這里面的代碼有問(wèn)題,在IE瀏覽器上面執(zhí)行不了。我們一般寫(xiě)博客文章分享的時(shí)候,都是僅提供核心代碼,而不是完整的項(xiàng)目代碼;主要是兩個(gè)原因:1、在一篇短文中貼出所有代碼,不能突出核心問(wèn)題所在;2、我們是比較反感完完全全的伸手黨的。
如果僅僅按照文章中的核心代碼,直接去跑demo,那么在ie瀏覽器下確實(shí)會(huì)出現(xiàn)上傳無(wú)效,打開(kāi)控制臺(tái)就可以看到報(bào)錯(cuò)信息。
原因在于在七牛云JavaScript SDK qiniu.min.js中使用了includes()方法,這個(gè)方法用于判斷字符串是否包含指定的子字符串, 如果找到匹配的字符串則返回 true,否則返回 false。瀏覽器的支持情況如下:
很顯然在IE瀏覽器上默認(rèn)是不被支持的,那么應(yīng)該怎么辦呢?
解決辦法一:使用其他方法屬性代替includes()
這種方法適合自己手寫(xiě)的局部代碼,如果是使用SDK等現(xiàn)成的,我們不太建議修改其核心源代碼。
解決方法二:使得IE瀏覽器支持includes,也就是另外些一個(gè)這個(gè)方法
以下自己構(gòu)建includes方法的代碼參考網(wǎng)絡(luò)其他資料而來(lái),其他IE不支持的方法也可以參考如下代碼實(shí)現(xiàn)。
if (!Array.prototype.includes) { Object.defineProperty(Array.prototype, "includes", { value: function(valueToFind, fromIndex) { if (this == null) { throw new TypeError('"this" is null or not defined'); } var o = Object(this); var len = o.length >>> 0; if (len === 0) { return false } var n = fromIndex | 0; var k = Math.max(n >= 0 ? n : len - Math.abs(n), 0); function sameValueZero(x, y) { return (x === y || (typeof x === "number" && typeof y === "number" && isNaN(x) && isNaN(y))) } while (k < len) { if (sameValueZero(o[k], valueToFind)) { return true } k++ } return false } }) }
當(dāng)然,這種方法也適用于其他js庫(kù)使用了includes()方法的場(chǎng)景,也是一樣的道理,就是自己“外掛”構(gòu)造實(shí)現(xiàn)includes的方法。
這也說(shuō)明,我們?cè)谶x擇技術(shù)實(shí)現(xiàn)方案的時(shí)候,一定要根據(jù)我們開(kāi)發(fā)項(xiàng)目的實(shí)際場(chǎng)景選擇。而不是一味地追求技術(shù)的新穎,而不管三七二十一一頓亂上,這樣或許會(huì)留下填不完的坑。
我們?cè)谖⑿派?4小時(shí)期待你的聲音
解答本文疑問(wèn)/技術(shù)咨詢/運(yùn)營(yíng)咨詢/技術(shù)建議/互聯(lián)網(wǎng)交流