作者:Buff
出處:https://buff.cnblogs.com
本文版權歸作者和博客園共有,歡迎轉載,但未經作者同意必須保留此段聲明,且在文章頁面明顯位置給出原文鏈接。
頁面通過https://your.domain.com/path
訪問,其中頁面資源使用自適應協議加載//your.domain.com/assets/xxx
,但瀏覽器卻未加載資源,報錯為Mixed Content: xxx
。
排查發現,頁面中存在個base
標簽,來看下base
標簽的說明:
The base element allows authors to specify the document base URL for the purposes of resolving relative URLs, and the name of the default browsing context for the purposes of following hyperlinks.
可以點擊resolving relative URLs
看看 HTML5 規定解析 URL 的步驟,其中可以看到,若存在base
標簽,則解析相對路徑的時候是會用到base
標簽中設置的 URL 的信息。
自適應協議路徑是被當做相對路徑解析,解析的時候會引用base
標簽中設置的 URL 的scheme
,而這個scheme
在這里是 HTTP,所以通過 HTTPS 訪問的時候就會出現Mixed Content
錯誤。
知道了原因,解決就很簡單了,去掉base
標簽或是寫完整路徑https://your.domain.com/assets/xxx
,建議都用 HTTPS,大勢所趨。
附:
HTML5 Resolving URLs
Let url be the URL being resolved.
Let encoding be determined as follows:
If the URL had a character encoding defined when the URL was created or defined or when this algorithm was invoked
The URL character encoding is as defined.
If the URL came from a script (e.g. as an argument to a method)
The URL character encoding is the API URL character encoding specified by the script's settings object.
If the URL came from a DOM node (e.g. from an element)
The node has a Document, and the URL character encoding is the document's character encoding.If encoding is a UTF-16 encoding, then change the value of encoding to UTF-8.
If the algorithm was invoked with an absolute URL to use as the base URL, let base be that absolute URL.
Otherwise, let base be the element's base URL.Apply the URL parser to url, with base as the base URL, with encoding as the encoding.
If this returns failure, then abort these steps with an error.
Let parsed URL be the result of the URL parser.
Let serialized URL be the result of apply the URL serializer to parsed URL.
Return serialized URL as the resulting absolute URL and parsed URL as the resulting parsed URL.
作者:Buff
出處:https://buff.cnblogs.com
本文以學習、研究和分享為主,歡迎轉載,但未經作者同意必須保留此段聲明,且在文章頁面明顯位置給出原文鏈接。