圖像資源的位置

我有一個插件，運行我的客戶的網站。該插件位於http://mycompany.com/Tool.js，需要插入一些圖像。問題是，JavaScript似乎試圖從客戶的網站，而不是從我自己的網站拉圖像。這裏是JS：圖像資源的位置

button.style.cssText = 'position:absolute;top:-20px;right:-20px;background-image:url(/Resource/Button.png);

在上面的JS，檢索URL是CUSTOMER.com/Resource/Button.png（其中插件運行的網站），而不是我的網站mycompany.com/Resource /Button.png。

請注意，我不能使用絕對路徑，因爲他們成爲環境（測試/ PROD），也因爲我的圖像檢索必須使用基於客戶端環境HTTP/HTTPS（否則你就錯誤，如果使用HTTP上之間的疼痛一個https站點）。

來源

2011-02-24 Mary Rawson

我對加載/運行從哪裏略有不清楚。你能更仔細地解釋一下嗎？ – thirtydot 2011-02-24 02:01:21

我的javascript被客戶端的服務器作爲外部資源加載。考慮1000個客戶都從我的服務器拉我的JS，並進一步需要圖像來自我的服務器。 – 2011-02-24 02:03:47

[Scheme relative URLs]（http://stackoverflow.com/questions/3583103/scheme-relative-urls）可能對您瞭解這裏有所幫助。 – thirtydot 2011-02-24 02:04:06

只是 background-image:url(http://mycompany.com/Resource/Button.png);

來源

2011-02-24 01:57:14

我可以也不可以這樣做。上面的格式在測試和prod（我顯然喜歡相同的代碼）和http和https（我們的插件在兩者上運行，並且如果客戶端使用https時必須使用https）之間變成一種痛苦。 – 2011-02-24 01:58:29

您可以創建一個Http處理程序，它攔截js文件的請求，讀取js文件的內容，檢查主機名，方案（http或https），編譯選項（調試或釋放），然後將'url（'替換爲適當的方案和域名，例如'url（https://mycompany.com）'並將其發佈到客戶端 – 2011-02-24 02:09:25

絕對路徑應該包含取代它！

switch (window.location.protocol) { 

case "http:": 
button.style.cssText = 'position:absolute;top:-20px;right:-20px;background-image:url(http://yourcompany.com/Resource/Button.png);break; 

case "https:": 
button.style.cssText = 'position:absolute;top:-20px;right:-20px;background-image:url(https://yourcompany.com/Resource/Button.png);break; 

}

來源

2011-02-24 01:57:42 DrStrangeLove

請參閱下面我的評論中的問題... – 2011-02-24 01:59:54

的JavaScript將在上下文中運行它運行，而不是它是從哪裏下載。如果資源URL不是絕對的，則該域將被認爲是您的瀏覽器當前正在訪問的域。

您將需要一個絕對URL。例如。 http://mycompany.com/Resource/Button.png

來源

2011-02-24 02:00:15 misteraidan

而不是使用JavaScript或任何你能實際上只是用//樣式表中的URL之前，它會使用http或https取決於客戶端如何來到現場。當您將樣式錶鏈接到頁面時，您可以在HTML頁面上執行相同的操作。所以，你的HTML頁面將是：

<link href="//mycompany.com/stylesheet" />

而在你的樣式表，你可以有

background-image:url(//mycompany.com/Resource/Button.png);

編輯

我忘了提，你可以做同樣的時將javascript文件附加到頁面上。

例如：<script type="text/javascript" src="//mycompany.com/javascript"></script>

來源

2011-02-24 02:19:26 sarcastyx

+1。。（http：// stackoverflow。5099542 /位置的圖像資源的COM /問題/） – thirtydot 2011-02-24 03:40:55

圖像資源的位置

回答

相關問題