HTTPS以及如何引用文件和图像 [英] HTTPS and how to reference files and images

问题描述

如何从安全区域的网页引用我的css文件（位于非安全区域）。我考虑过复制它（将其移入安全区域），但这似乎非常低效。

How should I reference my css file (which is in the non-secure area) from a webpage in the secure area. I've considered duplicating it (moving one in to the secure area) but this seems very inefficient.

任何建议都非常感激。
（ps很可能会有一些后续问题哈哈）

Any advice much appreciated. (p.s. there will most likely be a few follow up questions ha ha)

推荐答案

你可以随时避免这个问题使用相对/根路径：

You can always avoid the issue by using a relative/rooted path:

<link rel="stylesheet" href="/css/screen.css">

如果您必须使用完整的网址，我不确定为什么你不能使用https协议（这是正确的解决方案），但还有一个选择：根本不指定协议。

If you must use a full URL, I'm not sure why you can't use the https protocol (which is the correct solution), but there's one more option: don't specify a protocol at all.

<link rel="stylesheet" href="//example.com/css/screen.css">

http://paulirish.com/2010/the-protocol-relative-url/

如果浏览器通过HTTPS查看当前页面，那么它将使用HTTPS协议请求该资产，否则它通常会*通过HTTP请求它。这可以防止IE中出现此页面包含安全和非安全项目错误消息，将所有资产请求保留在同一协议中。

If the browser is viewing that current page in through HTTPS, then it'll request that asset with the HTTPS protocol, otherwise it'll typically* request it with HTTP. This prevents that awful "This Page Contains Both Secure and Non-Secure Items" error message in IE, keeping all your asset requests within the same protocol.

但是：

警告：用于< link> ; 或@import为样式表，IE7和IE8下载文件两次。但是，所有其他用途都没问题。

Caveat: When used on a <link> or @import for a stylesheet, IE7 and IE8 download the file twice. All other uses, however, are just fine.

因此，如果您必须指定完整的URL，最佳/正确的方法是：

So if you must specify a full URL, the best/proper way is this:

<link rel="stylesheet" href="https://example.com/css/screen.css">

真的别无选择。 CSS文件本身中图像和资源的相对路径应该适用于任何一种方法，并且不会触发安全性错误。如果您需要CSS文件中的绝对URL，那么您可以使用相同的技巧。

There's really no alternative. Relative paths to images and resources in the CSS file itself should work just fine with either approach, and won't trigger the security error. If you need absolute URLs in the CSS file, then you can use the same trick.

这篇关于HTTPS以及如何引用文件和图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！