blocks|key|1265193|text|如果使用相对路径(并且内容在同一个域中)，则内容应使用请求页面时使用的任何协议。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1265194|但是，如果要跨域访问CDN或资源站点，或者需要使用绝对路径，则需要使用服务器端脚本更改链接，或者始终使用https://|1265195|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|F|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|G|8|@]|9|@]|A|$]]|$1|D|3|-4|5|6|7|H|8|@]|9|@]|A|$]]]|E|$]]

<p>If you use relative paths ( and the content is on the same domain) then the content should use whichever protocol the page was requested in.</p>

<p>However if you are going across domain to a CDN or resource site, or if you need to use absolute paths, then you will need to use server side script to change the links, or always use https://</p>


blocks|key|1050549|text|使用协议相对路径。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1050550|因此不会|1050551|<link+rel="stylesheet"+href="http://example.com/style.css">
<script+src="http://example.com/script.js"></script>|code-block|syntax|javascript|1050552|但就是这样|1050553|<link+rel="stylesheet"+href="//example.com/style.css">
<script+src="//example.com/script.js"></script>|1050554|然后它将使用父页面的协议。|1050555|entityMap^0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|R|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|S|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|T|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|U|8|@]|9|@]|A|$G|H]]|$1|M|3|N|5|6|7|V|8|@]|9|@]|A|$]]|$1|O|3|-4|5|6|7|W|8|@]|9|@]|A|$]]]|P|$]]

<p>Use protocol-relative paths.</p>

<p>Thus not</p>

<pre><code>&lt;link rel="stylesheet" href="http://example.com/style.css"&gt;
&lt;script src="http://example.com/script.js"&gt;&lt;/script&gt;
</code></pre>

<p>but so</p>

<pre><code>&lt;link rel="stylesheet" href="//example.com/style.css"&gt;
&lt;script src="//example.com/script.js"&gt;&lt;/script&gt;
</code></pre>

<p>then it will use the protocol of the parent page.</p>


blocks|key|1265267|text|纽特和詹姆斯·韦斯特盖特在评论后一个答案时是对的。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1265268|如果我们看一看杂乱无章的工业级外部javascript包含，成功的使用了document.location.protocol嗅探和脚本元素注入并使用了适当的协议。|1265269|所以你可以使用类似这样的东西：|1265270|<script+type="text/javascript">
++var+protocol+=+(
++++++("https:"+==+document.location.protocol)+
++++++?+"https"+
++++++:+"http"
++);
++document.write(
++++++unescape(
++++++++++"%253Cscript"
++++++++++++++%2B+"+src='"
++++++++++++++++++%2B+protocol+
++++++++++++++++++%2B+"://"
++++++++++++++++++%2B+"your.domain.tld"
++++++++++++++++++%2B+"/your/script.js"
++++++++++++++%2B+"'"
++++++++++++++%2B+"+type='text/javascript'
++++++++++%2B+"%253E"
++++++++++%2B+"%253C/script%253E"
++++++)+//+this+HAS+to+be+escaped,+otherwise+it+would+
++++++++//+close+the+actual+(not+injected)+<script>+element
++);
</script>|code-block|syntax|javascript|1265271|对于外部CSS包含也可以这样做。|1265272|顺便说一句:注意在CSS中只使用相对url()路径，否则可能仍然会收到"mixed+secure+And+unsecure“警告。|1265273|entityMap^0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|R|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|S|8|@]|9|@]|A|$]]|$1|F|3|G|5|H|7|T|8|@]|9|@]|A|$I|J]]|$1|K|3|L|5|6|7|U|8|@]|9|@]|A|$]]|$1|M|3|N|5|6|7|V|8|@]|9|@]|A|$]]|$1|O|3|-4|5|6|7|W|8|@]|9|@]|A|$]]]|P|$]]

<p>nute &amp; James Westgate are right when comenting on the later answer.</p>

<p>If we take a look at miscelanous industry-grade external javascript includes, the successfull ones use both document.location.protocol sniffing and script element injection tu use the proper protocol.</p>

<p>So you could use something like :</p>

<pre><code>&lt;script type="text/javascript"&gt;
  var protocol = (
      ("https:" == document.location.protocol) 
      ? "https" 
      : "http"
  );
  document.write(
      unescape(
          "%3Cscript"
              + " src='"
                  + protocol 
                  + "://"
                  + "your.domain.tld"
                  + "/your/script.js"
              + "'"
              + " type='text/javascript'
          + "%3E"
          + "%3C/script%3E"
      ) // this HAS to be escaped, otherwise it would 
        // close the actual (not injected) &lt;script&gt; element
  );
&lt;/script&gt;
</code></pre>

<p>The same can be done for external CSS includes.</p>

<p>And by the way: be careful to only use relative url() path in your CSS, if any, otherwise you might still get the "mixed secure and unsecure" warning....</p>


blocks|key|1265306|text|与转义响应(也可以工作)相矛盾的是，您可以跳过该部分，并使用正确的方式将节点添加到dom树中：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1265307|<script+type="text/javascript"+language="javascript">
++++var+fileref=document.createElement('script');
++++fileref.setAttribute("type","text/javascript");
++++fileref.setAttribute("src",+document.location.protocol+%2B+'//www.mydomain.com/script.js');
++++document.getElementsByTagName("head")[0].appendChild(fileref);
</script>|code-block|syntax|javascript|1265308|但是相对于协议的路径将是可行的。|1265309|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>In contradiction to the escaped response (which will also work) you could skip that part and use the correct way to add nodes to your dom tree:</p>

<pre><code>&lt;script type="text/javascript" language="javascript"&gt;
    var fileref=document.createElement('script');
    fileref.setAttribute("type","text/javascript");
    fileref.setAttribute("src", document.location.protocol + '//www.mydomain.com/script.js');
    document.getElementsByTagName("head")[0].appendChild(fileref);
&lt;/script&gt;
</code></pre>

<p>But the protocol-relative path would be the way to go.</p>


<p>I am adding an external CSS file and an external JS file to my headers and footers.
When loading an HTTPS page, some browsers complain that I am loading unsecured content.</p>

<p>Is there an easy way to make the browser load the external content via HTTPS when the page itself is HTTPS?</p>


How to Include CSS and JS files via HTTPS when needed?

服务器

我正在向我的页眉和页脚添加一个外部CSS文件和一个外部JS文件。加载HTTPS页面时，一些浏览器会抱怨我加载的是不安全的内容。当页面本身是HTTPS时，有没有简单的方法让浏览器通过HTTPS加载外部内容？

问如何在需要时通过HTTPS包含CSS和JS文件？
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在需要时通过HTTPS包含CSS和JS文件？EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在需要时通过HTTPS包含CSS和JS文件？
EN