明明是 HTTPS，怎么就 Mixed Content 了

页面通过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
本文以学习、研究和分享为主，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文链接。