2014-10-05 81 views
0

我想製作一個加載我的本地JS庫而不是託管在CDN上的插件的插件。例如加載我自己版本的腳本https://developers.google.com/speed/libraries/devguide?csw=1#Libraries加載託管在CDN上的JS庫的本地版本

我想過的一種方法是聽取所有請求,如下例所示,但我不知道如何告訴瀏覽器加載本地版本的庫。

appAPI.onRequest(function(resourceUrl, tabUrl) { 

    if (resourceUrl.match(/.*/)) { 
    //Load the local version of the libraries used by the website 

    } 
}); 

我也發現了類似的什麼,我想在試玩版中做一些事情,但我不知道這是否是一個可行的選擇。

appAPI.resources.addInlineJS('Resources/jquery-2.1.1.min.js'); 

回答

1

您對如何實現目標有正確的想法。原則上,您可以使用appAPI.webRequest.onRequest方法來阻止頁面資源並在其位置插入自己的版本。存在潛在的副作用,例如頁面加載腳本可能會影響其整體功能,而不按順序排列。

下面的代碼是按原樣提供的,未經測試。 另請注意,如果本地庫由於其最大字符串長度而更長,則在Internet Explorer上解決方案可能無法正常工作。

background.js

// Monitor page resource requests 
appAPI.webRequest.onRequest.addListener(function(details, opaque) {\ 
    // Check if the request is for loadable local resource 
    for (var i = 0; i < opaque.resource.length; i++) { 
     if (details.requestUrl.indexOf(opaque.resource[i].src) !== -1) { 
      // Load local resource 
      appAPI.resources.addInlineJS(opaque.resource[i].local); 
      // Block original request 
      return { 
       cancel: true 
      }; 
     } 
    } 
}, { 
    resource: [ // List of loadable local resources 
     { 
      src: '//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js', 
      local: 'local/jquery-2.1.1.min.js' 
     } 
    ] 
}); 

[披露:我是一個Crossrider員工]

+0

謝謝!另外,如果我嘗試使用'src:'jquery.min.js',local:'local/jquery-2.1.1.min.js''來讓它在更多情況下工作,那麼它會好嗎? – 2014-10-05 11:04:49

+0

完全取決於你如何選擇使用src。這個例子只是給你一個如何實現你的目標的想法。實際的實施取決於你。例如,您可以選擇使用比顯示的更復雜的測試條件來查看src是否與請求的URL匹配。 – Shlomo 2014-10-05 11:58:06