私の目的は、
README.md
1) GitHubリポジトリのファイルからMarkdownソースを読み取ります。
2)マークダウンをHTMLコードに変換します。
3)出力HTMLをに適用します<div>
。
クライアント側のテクノロジーのみを使用します。
jQueryを使用してMarkdownコードをHTMLに変換する方法は知っていますが、GitHubリポジトリのREADME.mdファイルからMDソースを動的に読み取る方法がわかりません。
http://markdown.io/<url_readme_file>
。私のreadme.mdファイルのURLが。であるとしましょうhttp://raw.github.com/pankajparashar/nerdy-css/master/README.md
。したがって、新しいURLは次のようになります。http://markdown.io/http://raw.github.com/pankajparashar/nerdy-css/master/README.md
#md-content
、ページのIDからコンテンツを抽出します。ここで利用可能な上記の手順の完全なデモ-機能していないリンクが削除されました
README.md
ファイルをクリックしますrawファイルは、ロードする実際のURLです。
load.php
リモートファイル(RAWファイルなど)をロードするために特別に呼び出されるPHP(または使用しているサーバー側言語)ファイルを作成します。PHPスクリプトは変数を受け入れ$_GET['url']
ます。変数をに渡し、file_get_contents()
結果を出力します。以下のコードは非常に単純な例であることに注意してください。
echo file_get_contents($_GET['url']);
ここで、load
jQueryの関数を使用して、PHPファイルからデータコンテンツを取り込みます。あなたのURLはおそらくこれのようにフォーマットされます...
.load("load.php?url=https://raw.github.com/user/project/master/README.md")
最後に、すでに説明した手段を使用して、Markdownに変換します。
file_get_contents()
: http: //php.net/manual/en/function.file-get-contents.phpload()
:http ://api.jquery.com/load/あなたはチェックアウトする必要があります:
https://github.com/zmckinnon/jquery-gh-readme
GitHub APIを使用して、次の呼び出しを使用してreadmeのコンテンツを取得します。
GET / repos /:owner /:repo / readme
次に、base64で暗号化されたコンテンツを変換します。
次に、markedを使用してマークダウンコンテンツをhtmlに変換します。
HTMLがReadMe.mdファイルで機能することを理解することは注目に値します。この明確な理解により、ReadMeファイルで太字フォントを作成する方法、画像を挿入する方法など、そのような質問の多くは自動的に回答されると思います。また、使用しているアプリケーション/テキストエディタに大きく依存することに注意してください。 OSにもたくさんあります。最近、GithubのReadme.mdファイルに空白行の文字を挿入するのに問題がありました。
私は個人的に<br/>タグを好んでおり、同じことを説明する完全な投稿があります:http ://www.w3lc.com/2017/05/new-line-in-readme-file-github-fixing.html
投稿で説明されているGithubリポジトリのgitcommitの変更を示しました。この理解は、質問を処理し、おそらくそれを行う必要がある理由の他の多くの使用法を見つけるためにも非常に必要です!
さらに、質問に直接答えるには、次の2つの手順が必要です。1。RawバージョンのReadMe.mdファイルのURLを見つけます。たとえば、https ://raw.githubusercontent.com/Anwar-Faiz/forkrap/master/README.mdを参照してください 。2。サーバー側でphpのfile_gets_contentなどを使用する場合は、URLをロードできます。または、jqueryを使用する場合は、Load()を使用できます。
また、Raw URLページのソースを表示すると、プレーンテキストが表示されることにも注意してください。したがって、テキストの解析もそれほど行う必要はありません:)これは朗報です。
次に、エスケープ解除関数またはcodebeautifyなどのツールを使用して、「<」などのHTMLのルックアンドフィールで変更できる文字をエスケープ解除できます。