Q&A
Closed
上記のように表示され、URLも出てこないままの状態です。
https://sakata-ponsuke.github.io/mokumoku-farm.com/がURLなのですが、アルファベットに間違いはないです。
日にちを置いてリロードしたり、Settingsで調べながら調整したのですが上手くいきませんでした。index.htmlは配置しており、CSSファイルも格納されています。
Branchもmainで/docsなのですが、URLが表示されませんでした。
個人的には、画像が多くimgファイルに格納されているのでその影響も出ている？のかなと思います。GitHub PagesでWebサイトを公開した経験のある方、GitHubについて詳しい方がいましたら、アドバイス等よろしくお願いします。
Branchもmainで/docsなのですが
リポジトリの設定画面の Pages タブで以下の項目を /docs に設定しているという意味ですよね？
これはリポジトリの /docs ディレクトリ以下から web ページのソースを探すようにする指示です。
今のリポジトリではソースが /docs ではなく / （ルートディレクトリ）に置かれているので、上記の設定を / (root) に変更してください。
@sakata_ponsuke
Questioner
コメントありがとうございます。
/(root)に変更しましたが、まだ404エラーが表示されます。
今はimgタグの修正をしているのですが、HTMLではimg/example.pngと書いており、imgフォルダにまとめています。
エディタで書いた時はこれで表示されましたが、GitHub Pagesに記載した途端エラーになりました。
その他、修正案などご提案していただけると幸いです。
「サイトの公開」は設定されたのでしょうか？
↓こちらが参考になります。
@sakata_ponsuke
Questioner
コメントありがとうございます。
Webサイトを公開はしたのですが、「Visit Site」というメッセージが表示されず、今はURLの確認をしています。
404 応答が返ってくるということは、名前解決ができてクライアントからの要求はサーバーに届き、サーバーで url に指定されているリソースを探したが見つからなかったということです。原因はほとんどが指定した url が間違っているということです。なのでそこを調べてください。
間違いには、単純なスペルミス、相対パスの使い方の間違い、サーバーでのルーティングの間違い、要求先サーバーを間違えたなどがあります。ほとんどは質問者さんでないと分からないことです。
@sakata_ponsuke
Questioner
コメントありがとうございます。
もう一度、URLについて確認してみますが、「指定したURL」とは具体的にどこを指しますか？教えていただけると幸いです。
「指定したURL」とは具体的にどこを指しますか？教えていただけると幸いです。
質問者さんが自分で質問に書いた、
https://sakata-ponsuke.github.io/mokumoku-farm.com/がURLなのですが、アルファベットに間違いはないです。
の url のことです。
Web サーバーによって違うかもしれませんが、例えば IIS では、上の url のようにトレーリングスラッシュが付いていると、mokumoku-farm.com はディレクトリとみなされ、そのディレクトリにある既定のドキュメントを応答として返すという動きになります。
ただし、今回の 404 応答は、その前に、mokumoku-farm.com が存在しない（もしくはサーバー内で正しくルーティングできない）という話ではなかろうかと思います。
@sakata_ponsuke
Questioner
試しにトレーリングスラッシュを削除したところ、無事にWebサイトを公開することができました！
Branchの設定（docsとrootについてなど）理解不足な所を補うことができました！
貴重なご意見ありがとうございました。
試しにトレーリングスラッシュを削除したところ、無事にWebサイトを公開することができました！
トレーリングスラッシュの問題ではなく、最初の設定から何か変更したからでは？ @uasi さんの回答にあったこととか。
https://sakata-ponsuke.github.io/mokumoku-farm.com/ を試してみましたが、今は 404 エラーにはならず、以下の結果になります。（最初に質問を見た時点で試した時は質問に書いてある通りの 404 エラー）
トレーリングスラッシュなしで試してみると、以下のようにトレーリングスラッシュをつけた url にリダイレクトされます。ほとんどの Web サーバーでは mokumoku-farm.com がディレクトリの場合はそうなるはずです。
原因をきちんと把握されることをお勧めします。
@sakata_ponsuke
Questioner
@usai さんの意見を参考に、docsからrootに変更して、トレーリングスラッシュを消したら反映されるようになりました。ですが、以前制作したWebサイトとフォルダの構造は同じなので、docsで大丈夫なはずだとは思っていました。
先ほど、もう一度docsに変更したところ「Visit Site」と表示され、URLも出てきました。
しかし、トレーリングスラッシュを付けても、付けなくても表示されるので、どう考えたらいいか悩んでいます。
トレーリングスラッシュを付けても、付けなくても表示されるので、どう考えたらいいか悩んでいます。
付けないと Web サーバーがトレーリングスラッシュを付けた url にリダイレクトしてくれるからです。mokumoku-farm.com はディレクトリなので。
上の私のコメントに書いた「トレーリングスラッシュなしで試してみると、以下のようにトレーリングスラッシュをつけた url にリダイレクトされます。ほとんどの Web サーバーでは mokumoku-farm.com がディレクトリの場合はそうなるはずです」 を読んで、その下の Fiddler による要求・応答のキャプチャ画像を見てください。
それで分かると思いますが。
もう一つ。
上の私の回答で「例えば IIS では、上の url のようにトレーリングスラッシュが付いていると、mokumoku-farm.com はディレクトリとみなされ、そのディレクトリにある既定のドキュメントを応答として返すという動きになります。」と書きましたが、そこは読みましたか？
質問者さんの web サーバーでもそこは同様なようで、index.html が既定のドキュメントとしてサーバーから返されています。
@sakata_ponsuke
Questioner
末尾に/がついていると、mokumoku-farm.comをディレクトリ（フォルダ）であると判断し、そのディレクトリ内にある「既定のドキュメント」を返すように動作するという流れは把握しました。
最初の設定から、HTMLのファイルなどはいじっていません。Consoleにエラーが出ているのですが、Webサーバーの知識がないので、どう修正すればいいかが分かりません。
404 エラーは解決して、当方の環境からでもブラウザから要求を出せば、
https://sakata-ponsuke.github.io/mokumoku-farm.com/
でも、
https://sakata-ponsuke.github.io/mokumoku-farm.com/index.html
でも、期待通り応答が返ってきてブラウザに表示されるようになってます。
すなわちこのスレッドの問題 404 エラーは解決したはず。
Consoleにエラーが出ているのですが、
というのは以下の以下の画像のものだと思いますが、そうだとすると今回の質問の 404 エラーとは別の話で、script.js というファイルで出ている JavaScript のエラーです。エラーメッセージは 8 行目の 1 文字目にある $ が定義されてないと言ってます。
script.js は以下の内容の JavaScript のファイルですが自分で作って配置したのではないのですか？ jQuery を使っているので jQuery.js がないと動きません。
@sakata_ponsuke
Questioner
確認したところ、削除し忘れたjQueryのコードが残ったままでした。
SourcesでjQueryのコードを削除したいのですが、切り取りをしてリロードしてもすぐ元に戻ってしまいます。
スクリプトエラーやその修正方法はこのスレッドの課題「GitHub Pagesで404Errorと表示され、Webサイトが公開されません」とは別の話です。
このスレッドの課題は回答で解決できたのだからここはクローズして、別の課題に関する質問は新たに別のスレッドを立ててそちらで質問願います。
一つの問題が解決したら次の問題が出てきて、次から次へと一つのスレッドの中で質問を繰り返すのは避けてください。わけがわからなくなりますので。あとから検索などでここを訪れる閲覧者にとっては特に。
「ガイドとヘルプ」の「about」に以下のように書いてあります。
"Qiitaはエンジニアにとって再利用性・汎用性の高い他のユーザーにとっても役にたつ、学びのある情報が多く集まっている場であり続けたいと考えています。Qiitaは記事を読むこと、記事を書くことを通して、読む側・書く側それぞれがお互いに関わり合いを持ち、情報をみんなで育てていくことで、今後同じようなことを学んだり、悩んだりするエンジニアが使う時間を減らし、エンジニアの成長や生産性をスピードアップさせることを目指します。"
ここに限らず、大多数の Q&A サイトは上記のような目的、一言でいうと「技術者同士の情報交換や相互サポートの場」という目的を持っているはずです。
スレッドの内容は、一つの課題に対して一つの質問とするのがその趣旨に沿っていると思います。
