先说一下实现的原理,当然此文章主要讲了我的实现,当然还有其他的实现方式,原理都是差不多的。
首先,我们需要安装kramdown解释器,这个很好理解吧,和php一样,他的特点标签能够实现渲染肯定需要解释器来解析,这里kramdown解释器的官网为http://kramdown.gettalong.org/installation.html,这是安装界面,根据自己的系统安装即可,不过他需要安装ruby依赖。然后我通过nginx的url转发,将.md的文档转发给一个php文件来处理,这个php文件,就调用kramdown解释器来解析对应文档即可。
原理很简单吧,看下具体实现步骤吧,
1、安装kramdown解释器
代码如下 | 复制代码 |
sudo aptitude install ruby rubygems sudo gem install kramdown |
安装完,(ruby可以直接yum安装),可以写一个md的测试文件,使用kramdown命令试一下。
2、制作kramdown解析程序
这里我用的是php,当然也可以用其他语言,只要可以调用linux的system命令即可,当然php安装有的时候会屏蔽这些敏感函数,注意要释放一下。
文件发一下
代码如下 | 复制代码 |
<?php $file = @$_GET['file']; if(!is_file($file)) header("HTTP/1.0 404 Not Found"); header("Content-type: text/html; charset=utf-8"); date_default_timezone_set('Asia/Shanghai'); $filename = strrchr($file,'/'); $filename = ltrim($filename,'/'); $odir = rtrim($file,$filename); ?> <head> <title><?php echo $filename;?></title> <link href="/github-59da74dcbe2f1d555e306461652274f8741238a64e7b1fe8cc5a286232044835.css" media="all" rel="stylesheet" type="text/css"> <link href="/github2-22a0054564248c6dd87336e91bca068b1ab49e28ee1062519b3a0722d29da804.css" media="all" rel="stylesheet" type="text/css"> </head> <body> <div class="header header-logged-in true" role="banner"> <div class="container clearfix"> <a class="header-logo-invertocat" href="/" data-hotkey="g d" aria-label="Homepage" ga-data-click="Header, go to dashboard, icon:logo"> </a> <ul class="header-nav left" role="navigation"> <li class="header-nav-item explore"> <a class="header-nav-link" href="/" data-ga-click="Header, go to explore, text:explore">站点首页</a> </li> <li class="header-nav-item"> <a class="header-nav-link" href="/archives/category/lovephp/" data-ga-click="Header, go to gist, text:gist">我爱php</a> </li> <li class="header-nav-item"> <a class="header-nav-link" href="/archives/category/tj/" data-ga-click="Header, go to gist, text:gist">推荐文章</a> </li> <li class="header-nav-item"> <a class="header-nav-link" href="/xiangce/" target="_blank" data-ga-click="Header, go to blog, text:blog">相册</a> </li> <li class="header-nav-item"> <a class="header-nav-link" href="/flink/" data-ga-click="Header, go to blog, text:blog">兄弟链</a> </li> <li class="header-nav-item"> <a class="header-nav-link" href="/message/" data-ga-click="Header, go to help, text:help">关于我</a> </li> </ul> </div> </div> <div class="container"> <div id="js-repo-pjax-container" class="repository-content context-loader-container" data-pjax-container=""> <div class="file-wrap"> <table class="files" data-pjax=""> <tbody> <?php $dir = opendir($odir); while (($f = readdir($dir)) !== false){ if('.' !=$f && '..' != $f){ $href = $f; $type = 'File'; if(is_dir($odir.$f)){ $href = $f.'/index.md';//目录的话默认访问里面的index.md $type = 'Dir'; } $time = date('Y-m-d H:i:s',filemtime($odir.$f)); ?> <tr> <td class="icon"> </td> <td class="content"> <span class="css-truncate css-truncate-target"><a href="<?php echo $href;?>" class="js-directory-link" title=""><?php echo $f;?></a></span> </td> <td class="message"> <span class="css-truncate css-truncate-target"> <?php echo $type;?> </span> </td> <td class="age"> <span class="css-truncate css-truncate-target"><?php echo $time;?></span> </td> </tr> <?php } } ?> </tbody> </table> </div> <div class="file-box"> <div class="file"> <div class="meta clearfix"> <div class="info file-name"> <span><?php echo $filename;?></span> </div> </div> <div id="readme" class="blob instapaper_body"> <article class="markdown-body entry-content" itemprop="mainContentOfPage"> <?php echo system('/usr/bin/kramdown '.$file); ?> </article> </div> </div> </div> </div> </div> </body> |
实现了一些简单的文件遍历和样式,这个可以随意制作,我是用的github的样式
3、nginx配置url重写
当然这里就根据自己的喜好了,当然也可以制作soket服务,不过php毕竟做服务的话不太好,还有配合shell监控,所以不如直接使用url重写了
代码如下 | 复制代码 |
location ~ ^(.+\.md)(.*) { rewrite .* /md.php?file=$document_root$fastcgi_script_name last; } |
4、另外
最后在nginx的web服务加上个默认页
index index.html index.htm index.php index.md default.html default.htm default.php;
这样就可以默认访问index.md文件了
这样就实现了自己网站的markdown文件解析了,以后可以写md文档了
时间: 2024-09-21 10:52:20