web-dev-qa-db-ja.com

GitHubページからHTML拡張を削除

GitHubページを使用して最新のサイトをホストしています（ http://jasonhoffmann.github.io/ ）。サブページの末尾から.html拡張子を削除する方法（ http://jasonhoffmann.github.io/contact.html ）にアクセスできないため、サーバ。

githubgithub-pages
34
Jason Hoffmann

サブディレクトリを使用する必要があると思います（ただし、もっと簡単な方法があるかもしれません）。

/index.html            => http://jasonhoffmann.github.io
/contact/index.html    => http://jasonhoffmann.github.io/contact

ただし、CNAMEを使用してGitHubページを独自の domain にリダイレクトすることで、より細かく制御できる場合があります。申し訳ありませんが、明確な答えはありませんが、これであなたが始めることができれば幸いです。

14
Sam

すでに機能しており、何もする必要はありません

あなたがすでにそれを知っているかどうかはわかりませんが、GitHub Pagesから.html拡張子を削除するには、リンクから.html拡張子を削除するだけです。

つまり、すでに機能しており、何もする必要はありません。サブディレクトリ、CNAME、リダイレクト、Jekyll _config.yml、YAMLフロントマター、またはここでのすべての回答で提案されているその他のハックを使用する必要はありません。

例

たとえば、次のように使用できます。

の代わりに：

同じファイルを表示します。リンクのリンクを変更するだけです。

テスト

いくつかのテストを行って、リンクをクリックできる場所が実際にどのように機能するかを示し、特定の場合の安全でないリダイレクトに関する警告を含め、どのファイルがどのURLでロードされるかを強調しました。

Eaxampleの場合、リンク：

は、URLのtest1によって表示されることを示していますが、実際にはファイルtest1.htmlを表示します。 enter image description here

他のソリューションの問題

ここで他の回答で提案されているように、特別なサブディレクトリでindex.htmlのようなものを使用しても、example.com/name.htmlが要求されたときにexample.com/nameを提供するだけでは、期待どおりに動作しませんが、代わりに301リダイレクトが提供されます。 example.com/name/（末尾のスラッシュに注意）は、example.com/name/index.htmlファイルの内容を提供します。

これにより、次の問題が発生します。別のディレクトリにいて、同じレベルの他のページへのリンクに<a href="../name">の代わりに<a href="name">を使用する必要があり、すべてのアセット（または誰かが提案したように絶対パスを使用できますが、GitHubページ（特にプロジェクトページ）ではお勧めできません。フォークとプロジェクトの名前を変更した後は、すべてのHTMLファイルのすべてのリンクとjs/cssアセットを更新する必要があるためです。

もう1つは、すべてのナビゲーションに役に立たないリダイレクトがあることです。これにより、偶発的にHTTPSからHTTPにリダイレクトされます（スラッシュなしのセキュアURLからインセキュアスラッシュ付きのURL）へ、例えば見る：

これは（執筆時点で）以下にリダイレクトします。

および[〜＃〜]ではない[〜＃〜]：

あなたが期待するかもしれないので、あなたがそれを知っていることを確認してください。見る： - Insecure redirect （この画像は安全なHTTPS URLにリンクされていますが、安全でないHTTP接続を使用することに注意してください-それを確認するには、シークレットモードを使用する必要がある場合があります）

これは、2016年6月17日現在のヘッダーの形式です。

$ curl -I https://rsp.github.io/gh-pages-no-extension/dir
HTTP/1.1 301 Moved Permanently
Server: GitHub.com
Content-Type: text/html
Location: http://rsp.github.io/gh-pages-no-extension/dir/
...       ^^^^

うまくいけば、GitHubが将来的にそれを修正するでしょう。 （ほぼ1年前にこの回答を書いていたときに発見しましたが、この問題は2016年6月の時点でもまだ存在しています。）

奇妙なことに、2016年6月17日現在（この回答を更新しているときに最近気付いたため、いつもそうだったかどうかはわかりません）このURL：

リダイレクト：

それがあるべきように。ヘッダーを見る：

$ curl -I https://rsp.github.io/gh-pages-no-extension
HTTP/1.1 301 Moved Permanently
Server: GitHub.com
Content-Type: text/html
Location: https://rsp.github.io/gh-pages-no-extension/
...       ^^^^^

唯一の違いは、プロジェクトルートURLであり、プロジェクト内のより深いディレクトリではないことです（ プロジェクト構造 を参照）。バグのあるリダイレクトは、プロジェクトのGitHubページ内のディープリンクにのみ存在するようです。 1つのブラウザーでシークレットモードを使用する場合にのみテストしました。

肝心なのは、注意する必要があるということです。私のアドバイスは、すべてのリダイレクトを完全に回避し、リダイレクトがまったく発生しないURLのみを使用することです。

92
rsp

これは、GitHub Pagesに組み込まれた静的サイトジェネレーターであるJekyllを使用して行うことができます。いくつかの permalink設定 は、_config.yml（サイトのすべてのページと投稿に影響します）または YAMLフロントマター のいずれかに設定できます。各ページ/投稿。

たとえば、次のコードをcontact.htmlファイルに追加できます。

---
permalink: contact/
---

これは<!DOCTYPE html>の前に挿入されますが、Jitkyllは、GitHub Pagesで提供されるときに削除するように注意します。これを行うと、jasonhoffman.github.io/contactではなくjasonhoffman.github.io/contact.htmlのページにアクセスできるようになります。 Jekyllが実際に行っているのは、contactというディレクトリを作成し、その中にindex.htmlファイルをcontact.htmlコンテンツとともに配置することです。 Jekyllをローカルにインストールして実行する の場合、次のようになります。

.
|- _config.yml (optional)
|- contact.html
|- index.html
|- css
   |- styles.css
|- img
   |- image.jpg
|- _site
   |- index.html
   |- contact
      |- index.html
   |- css
      |- styles.css
   |- img
      |- image.jpg

Jekyllをローカルにインストールしない場合は、_siteフォルダーを除いたすべてが表示されます。これをGitHubにプッシュすると、サーバーがJekyllを実行し、_siteフォルダーと同等のフォルダーを生成して提供します（ただし、GitHubリポジトリには表示されません）。

Jekyllをスキップして、内部にindex.htmlを含むcontactサブディレクトリを作成することもできます。どちらの方法でも、サイト内のアセット（img、css、js）へのリンクの前に/があることを確認する必要もあります。例えば、

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

代わりに

<link rel="stylesheet" href="/css/style.css">
7
nicksuch

私は ホッキョクギツネのテーマ を使用しています 次のリンク文字列を使用しています ：

<a class="page-link" href="{{ page.url | prepend: site.baseurl }}">{{ page.title }}</a>

解決策は、remove: '.html'をフィルターとして追加することです。

<a class="page-link" href="{{ page.url | remove: '.html' | prepend: site.baseurl }}">{{ page.title }}</a>

Jekyllでのローカルサービング は現在機能しませんが、Jekyll 3.0では約束されています： https://github.com/jekyll/jekyll/pull/3452

4
koppor

とりあえず、_permalink: /your-pretty-urlを追加するだけです。

他の答えは機能しません。私はもう試した。 「/」プレフィックスを追加する必要があります。

例えば：

---
layout: post
title:  "Welcome to Jekyll!"
date:   2017-04-29 22:04:31 +0700
categories: jekyll update
permalink: /welcome
---
4
Rizky Syaiful

パーマリンクを次のように変更して.html拡張子を削除しました

permalink: /:title/

最後を忘れないで/

3
muTheTechie

ユーザーrspは、かなりのパーマリンクがGitHub Pagesによってすでに実装されており、何もする必要がないと述べているため、Jekyllサーバーをローカルで実行する場合、またはデフォルトでJekyllで実行する場合、これは行われません。 GitHubにプッシュする前に、独自の非Githubページサイト（まだJekyllで提供されています）でJekyllを使用しているページからHTML拡張機能を削除するか、Githubページに類似したローカル開発サイトをできるだけ持っている場合は、

これを追加するだけです_config.ymlファイル：

permalink: pretty

これにより、すべての投稿に独自のフォルダーとindex.htmlという名前の投稿を作成することにより、リンクから.htmlが削除されます。

3
matrixanomaly