IE11瀏覽器下cytoscape.js請求圖片不顯示

現象:項目中使用angularjs2+cytoscape.js繪製網絡拓撲圖,其中節點背景使用了圖片顯示,在windows環境下調測,所有瀏覽器都正常顯示,但是一放到Linux環境服務器上,IE11瀏覽器下訪問無法顯示,其他瀏覽器正常。

問題:通過對cytoscape.js源碼打印發現請求圖片是通過<img crossorigin="anonymous" src="assets/imgs/bird.jpg">方式去獲取圖片,打開nginx訪問日誌記錄,只要IE11瀏覽器發送的http圖片請求都會報302狀態碼。經分析,crossorigin屬性是爲了解決跨域問題使用,而我們項目中的圖片都是在相應服務器上,並不需要跨域獲取。

方法:將cytoscape.cjs.js中BRp.getCachedImage方法中如下內容

 var dataUriPrefix = 'data:';
    var isDataUri = url.substring(0, dataUriPrefix.length).toLowerCase() === dataUriPrefix;
    if (!isDataUri) {
      image.crossOrigin = crossOrigin; // prevent tainted canvas
    }

修改爲:

if(url.indexOf("http://")!== -1||url.indexOf("https://")!== -1){
        image.crossOrigin = crossOrigin; // prevent tainted canvas
    }

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章