-
-
Save ScottJWalter/fdd76a9c4299eee81b3d34acd4f7c838 to your computer and use it in GitHub Desktop.
Nginx config to render markdown files (client side) #nginx #markdown
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
location /__special { | |
internal; | |
allow all; | |
root /usr/share/nginx/html/__special; | |
} | |
location = /__md_file { | |
internal; | |
allow all; | |
add_header 'Vary' 'Accept'; | |
default_type text/html; | |
alias /usr/share/nginx/html/__special/md-renderer.html; | |
} | |
location ~* \.md { | |
error_page 418 = /__md_file; | |
add_header 'Vary' 'Accept'; | |
if (!-f $request_filename) { | |
break; | |
} | |
# if no "text/markdown" in "accept" header: | |
# redirect to /__md_file to serve html renderer | |
if ($http_accept !~* "text/markdown") { | |
return 418; | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/milligram/1.3.0/milligram.min.css"> | |
<script type="application/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/marked/0.3.19/marked.min.js"></script> | |
<style rel="stylesheet">code.error {line-height:2rem;font-size:2rem;color:#F43;padding:2rem;display: block;}</style> | |
<script> | |
const FILENAME = location.pathname; | |
const set = (t) => document.getElementById('content').innerHTML = t; | |
const pull = fetch(FILENAME, {headers: {'Accept': 'text/markdown'}}) | |
.then((res) => { | |
if (!res.ok) | |
throw new Error(`${res.statusText} (${res.status})`); | |
return res.text() | |
}) | |
</script> | |
<script defer> | |
pull.then((text) => set(marked(text))) | |
.catch((err) => set(`<code class="error">Failed to load ${FILENAME}: ${err.message}</code>`)) | |
</script> | |
</head> | |
<body> | |
<div class="container box" style="margin:5rem auto;padding:4rem"> | |
<div id="content"></div> | |
</div> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment