2016-10-27 9 views
0

私は現在、W3Schoolsスクリプトを使用しているGithub PagesのGithubに関するレポを作成しています。私のindex.htmlコードは次のようになります。common.htmlでGithub Pagesで有効なHTMLが許可されないのはなぜですか?

<!DOCTYPE html> 
<html> 
    <head> 
     <title>[my name] Witness Project</title> 
     <script src="http://w3schools.com/lib/w3data.js"></script> 
    </head> 
    <body> 
     <div w3-include-html="common.html"></div> 
     <div id="main"> 
      <h1 style="display:block">This will be my Witness Project soon!</h1> 
     </div> 
    </body> 
    <script> 
    w3IncludeHTML(); 
    </script> 
</html> 

、ヘッダーとフッターのコードがあります:

<link rel="stylesheet" href="common.css"> 
<div id="header"> 
    <nav> 
     <button type="button"><a href="index.html">Home</a></button> 
     <button type="button"><a href="#">Coming Soon</a></button> 
     <button type="button"><a href="#">Coming Soon</a></button> 
     <button type="button"><a href="#">Coming Soon</a></button> 
     <button type="button"><a href="#">Coming Soon</a></button> 
    </nav> 
</div> 

<div id="footer"> 
    Created as part of <i>The Witness Project</i> at The Key School<br> 
    <i>Content of website © 2016 by [my name]</i> 
</div> 

私がインポートできるようにhereを説明するスクリプトを利用しています他のHTMLファイル。私はCSSが関連しているとは思わない。しかし、Github Pagesページをロードすると、index.htmlの要素だけが表示されます。私のローカルファイルからページをロードすると、それが期待されるように見えるので、それは私のせいではありません。

画像:
オンライン:Online
ローカル:何が起こっているLocal ? Githubで外部JSを使用できませんか?

編集:私は、コンソールをチェックし、このメッセージを得た: Error

+0

私の推測:CSSは読み込まれません。 Dunnoなぜですか?しかし、ネットワークタブをチェックしてください。 – vlaz

+0

CDNからホストされていない場合はスクリプトを許可しない可能性があります –

+3

ページがhttpsの場合は、スクリプトも同じでなければなりません。彼らがcdnを奪うなら、w3foolsの本当の証明書を買うのがいいだろう – dandavis

答えて

3

あなたが取得しているエラー、Blocked loading mixed active content "http://w3schools.com/lib/w3data.js"を、あなたは「混在したコンテンツを」持っていることを示している - つまり、一部のコンテンツがhttpsや他のコンテンツの上にロードされ、 httpを不安定に読み込まれています。

このようなスクリプトをhttp経由で読み込むと、送信者と受信者の間で改ざんされる可能性があるため、セキュリティ上のリスクと考えられ、(一部の)ブラウザでブロックされます。

スクリプトにリンクするときは、プロトコルなしで<script src="//w3schools.com/lib/w3data.js"></script>を使用すると、ページをロードするために使用されたプロトコル(httpまたはhttps)を使用してscrptがロードされます。これでエラーが解消されます。

残念ながら、私はhttps://w3schools.com/lib/w3data.jsをテストし、それは私に証明書のエラーを与えた後、404 ... w3schoolsはそのスクリプトをhttpsで利用できるようにしていません。
その場合、コピーをローカルに保存し、w3schools CDNの代わりにそのコピーにリンクすることをお勧めします。

関連する問題