2013-04-18 88 views

回答

5

你不打算喜歡這個答案。你無法做到這一點,如果你想出了一個辦法,那麼Chrome團隊將被視爲一個安全漏洞。

打包應用程序的部分設計目標是在上傳到網上商店時使整個應用程序可以靜態分析。這意味着,當用戶決定是否從商店安裝應用程序時,該決定基於代碼的實際作用(它包含這些腳本,此CSS和這些圖像,並要求獲得這些權限),而是而不是您是否信任開發人員或網站。 www.example.com今天可能看起來值得信賴,但明天它可能會出售給新的所有者,或者受到損害。所以決定「我信任example.com嗎?」很難。打包應用程序使決策更容易;在大多數情況下,您信任的「事物」就在您​​的面前,就在您剛剛下載的CRX中。

如果你瞭解這個設計目標,那麼你就明白爲什麼打包應用程序的設計不允許自修改代碼(這是你想要做的通用術語)。如果你的代碼可以生成代碼,那麼靜態分析就很難確定應用程序可以做什麼(有意或者是通過bug)。同樣,內容安全策略對打包的應用程序也相當嚴格,不能設置爲限制較少的策略,這就是eval()在腳本中不起作用的原因。

您的JavaScript無法設置您的DOM元素的樣式屬性是否有原因?這應該給你靈活性,而不會碰到平臺安全模型的邊界。

編輯:剛看到your other question,這看起來很像這個。你在建立一個CSS編輯器嗎?還是你想修改你自己的應用程序的CSS?我上面的答案假設了第二種情況。如果我誤解了你的問題,然後澄清,我會嘗試改進答案。

+0

真的很棒的信息。肯定地看着構建我的應用程序的錯誤方式。我正在構建一個CSS編輯器,但它需要是本地的。我真的不想學習一種新語言,並希望它成爲基於桌面的獨立應用程序。任何建議在下一步都會很棒。我一直在研究node-webkit,它使我能夠在使用webkit瀏覽器時將文件提交到文件系統。 – darylhedley 2013-04-20 08:58:26

+0

其實node-webkit真的很棒!我會建議任何人尋找類似的東西來看待這個。文檔不是很好,但說實話並不需要,因爲大部分工作都是用純節點完成的。玩了一個小時後,我就可以覆蓋現有的CSS文件並重新加載。 – darylhedley 2013-04-20 09:10:56

+1

我明白了。聽起來很好玩。如果您回到Chrome打包應用程序,則有三種不同的API用於編寫文件:HTML5文件系統API,chrome.fileSystem和chrome.syncFileSystem。簡而言之,鉻。fileSystem適合讀/寫用戶挑選的單個文件。 chrome.syncFileSystem刪除了用戶手勢要求並添加了雲同步,但如果您需要真正的文件供用戶在其他地方使用並使用,則需要chrome.fileSystem將其從同步文件系統中導出。玩node-webkit! – sowbug 2013-04-20 15:31:40

3

雖然@潮蟲的答案是技術上糾正,你不能改變你的應用程序打包內容,在OP仍然能達到什麼本質上是一樣的。

保存CSS:

var someCSSCode = 'a { color:#de0 }'; 
webkitRequestFileSystem(PERSISTENT, 1024*1024, function(fileSystem) { 
    fileSystem.root.getFile('my.css', {create:true}, function(file) { 
     file.createWriter(function(writer) { 
      this.onwriteend = function() { 
       this.onwriteend = null; 
       this.truncate(this.position); //in case a longer file was already here 
      }; 
      writer.write(new Blob([someCSSCode], {type:'text/plain'})); 
     }); 
    }); 
}); 

加載CSS:

webkitRequestFileSystem(PERSISTENT, 0, function(fileSystem) { 
    fileSystem.root.getFile('my.css', {}, function(file) { 
     var elem = document.createElement('link'); 
     elem.rel = 'stylesheet'; 
     elem.type = 'text/css'; 
     elem.href = file.toURL(); 
     document.head.appendChild(elem); //or document.body 
    }); 
}); 

請注意,此代碼不包含任何錯誤處理。

相關問題