☰

Nginx 未在 https 中載入 css/js/images - 阻止載入混合活動內容

tag-icon • tag-icon nginx ubuntu-14.04 ansible
Nginx 未在 https 中載入 css/js/images - 阻止載入混合活動內容

我正在運行 ubuntu 14.04 和 Nginx 1.8.0。在 https 中開啟網頁時，由於 css/js/images 未加載，頁面似乎已損壞。我收到此錯誤“ Blocked loading mixed active content”

這是我的nginx.conf：https://github.com/adithyakhamithkar/ansible/blob/master/roles/nginx/templates/nginx.j2

這是我的虛擬主機檔案： https://github.com/adithyakhamithkar/ansible/blob/master/roles/nginx/templates/virtualhost_ssl.j2

有人可以指導我如何解決這個問題嗎？

答案1

無法透過 nginx 設定修復

考慮以下 html 檔案：

  <html>
    <head>
    </head>
    <body>
      <img src="http://example.com/some/image.png">
    </body>
  </html>

如果這個 html 檔案透過 https 提供 - 它將總是產生混合內容警告。嘗試修復後續請求/some/image.png將不起作用，該請求被瀏覽器阻止，無法到達伺服器。

修復 html

唯一有效的解決方案是修復主請求的 html 來源，以便它https://也請求所有資源，即將 html 更改為：

  <html>
    <head>
    </head>
    <body>
      <img 
        src="/some/image.png" 
        alt="same domain and port as this html page please"
      />
    </body>
  </html>

或這個：

  <html>
    <head>
    </head>
    <body>
      <img 
        src="https://example.com/some/image.png" 
        alt="explicit https" 
      />
    </body>
  </html>

在評論中，您提到了 WordPress 作為範例；對於 WordPress 安裝，唯一需要的是（原則上，在實踐中預計會有一些混亂）更改網站網址這樣 WordPress 就會被認為https://example.com是安裝的根 url。

答案2

現在，混合活動內容在 Firefox 23 及更高版本中預設被封鎖。不確定其他瀏覽器是否如此

什麼是混合內容？

當使用者造訪透過 HTTP 提供服務的頁面時，他們的連線會受到竊聽和中間人 (MITM) 攻擊。當使用者造訪透過 HTTPS 提供的頁面時，他們與 Web 伺服器的連線將透過 SSL 進行身份驗證和加密，從而防止竊聽和 MITM 攻擊。

但是，如果 HTTPS 頁麵包含 HTTP 內容，則攻擊者可以讀取或修改 HTTP 部分，即使主頁是透過 HTTPS 提供的。當 HTTPS 頁麵包含 HTTP 內容時，我們將該內容稱為「混合」。使用者正在造訪的網頁僅部分加密，因為某些內容是透過 HTTP 檢索的，未加密。混合內容阻止程式會封鎖 HTTPS 頁面上的某些 HTTP 請求。

聽起來您正在連結非 ssl 靜態內容。您應該連結您的內容，例如

<a href='//host.com/file.png>

如果您需要從其他主機連結。

相關內容