Question

所以我从这个jsfiddle尝试了其他人http site。

HTML

<div id="mainContent">
        <h1>This is an According Example</h1>           
    </div>
    <div id="accordion">
        <h3><a href="#">Heading for first sentence</a></h3>
        <div>
        <p>This is the first sentence.</p>
        </div>          
        <h3><a href="#">Heading for second sentence</a></h3>            
        <div>
        <p>This is the second sentence.</p>
        </div>
        <h3><a href="#">Heading for third sentence</a></h3>
        <div>
        <p>This is the third sentence.</p>
        </div>
    </div>

JS

$(document).on('ready', function(){
$("#accordion").accordion();
});

当jsfiddle位于https中时，它不起作用。

Same as above

这与我在PC（最新的Chrome，Windows 10）中进行开发时的情况完全相同，例如： file：/// C：/path/to/projectname/index.html（显示https版本）。我可以知道如何解决这个问题？

Answer 1

Google Chrome控制台解释了这个问题：

混合内容：“https://fiddle.jshell.net/z6MJN/show/”的页面是通过HTTPS加载，但请求一个不安全的脚本 'http://code.jquery.com/ui/1.9.2/jquery-ui.js'。这个要求已经堵塞;内容必须通过HTTPS提供。

和

混合内容：页面位于 “https://fiddle.jshell.net/z6MJN/show/”是通过HTTPS加载的，但是请求一个不安全的样式表 'http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css'。这个请求已被阻止;内容必须通过HTTPS提供。

MDN explains very well the problem

如果HTTPS页面包含通过常规检索的内容，明文HTTP，然后连接只是部分加密：嗅探器可以访问未加密的内容，并且可以通过修改中间人攻击，因此连接不是保护了。当网页表现出这种行为时，就是这样称为混合内容页面。

您可以使用语法//而不是http://或https://，浏览器将使用当前页面协议加载这些链接。

https://jsfiddle.net/g0s4rj77/1/

为什么http中的html组件无法在https中运行

1 个答案: