## 1. Назначение
Для облегчения процесса публикации можно использовать формат разметки текста [Markdown](https://www.markdownguide.org/basic-syntax/).
Для этого, нужно использовать один из перечисленных ниже визуализатор на клиентской стороне, т.е. выполняемый скрипт JS на сторне WEB-браузера и [подключаемый в виде библиотеки JS](https://stackoverflow.com/a/28225314) :
* [marked](https://marked.js.org),
* [showdown](https://github.com/showdownjs/showdown),
При этом, часто рекомендуемые более сложный варианты с обработкой на сервере используя в качетсве транспорта _AJAX_ может быть трудно реализуемым из-за отсутствия реализовать такую возможность на сервере или сам сервер является минимальным, чтобы лишь обеспечить передачу файлов по протоколу _HTTP(S)_ .
## 2. Использование
### 2.1 marked + fetch
Самое простое казалось использовать [marked](https://marked.js.org/#usage) со встроенной JS-функцией [fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch) , для того чтобы загрузить контент из файла и затем передать к marked.parse() . Что-то подобное этому :
fetch("/md-files/markdown-test.md") // The path to the raw Markdown file
.then(response => response.blob()) // Unwrap to a blob...
.then(blob => blob.text()) // ...then to raw text...
.then(markdown => { // ...then pass the raw text into marked.parse
document.getElementById("content").innerHTML = marked.parse(markdown);
});
Что оказалось весьма затруднительно, потому что многие широко используемые браузеры, например, такой как Chrome блокируют , потому что следуют [политики CORS](https://portswigger.net/web-security/cors/access-control-allow-origin) со следующим сообщением:
>> Access to f``:wetch at 'file:///md-files/markdown-test.md' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, isolated-app, chrome-extension, chrome, https, chrome-untrusted.
Поэтому прищлось отказаться, т.к. вносить [какие-либо изменения на сервере в обаботку запросов](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Origin) или [заставлять пользователя устанавливать плагины на браузер](https://stackoverflow.com/questions/48728173/how-do-i-fix-cors-issue-in-fetch-api) -- в одном случае показалось невозможным, а в другом -- глупым .
### 2.2 Только marked
Поэтому мне пришлось отказаться от этой идеи и включать текст, который вы видите непосредственно в страницу html следующим образом ():
В узел документа, в котором будет отображаться конветрированный в HTML текст нужно внести код в формате markdown и присвоить ему метку _id = 'content'_ :
[marked](https://github.com/markdown-it/markdown-it) is *great*
because:
- it\'s easy to use\n' +
- it\'s extensible\n' +
- fine works on client-side, eg: WEB-browser';
Следом определить два узела \ , в атрибуте которого определить где находится подключаемый модуль _src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"_ и затем уже сами опреации с используемым модулем marked :
...
import { marked } from "https://cdn.jsdelivr.net/npm/marked/lib/marked.esm.js";
var rawtxt = document.getElementById('content').innerHTML;
document.getElementById('content-id').innerHTML = marked.parse(rawtxt)
...
### 2.3 Showdown
Этот [конвертор](https://github.com/showdownjs/showdown) применяется также образом как и [marked]()
var rawtxt = '[**Showdown**](http://www.showdownjs.com) is *great*\n' +
'because:\n\n' +
' - it\'s easy to use\n' +
' - it\'s extensible\n' +
' - works in the server and in the browser';;
var converter = new showdown.Converter();
var html = converter.makeHtml(rawtxt);
Но, применение [marked](https://github.com/markdown-it/markdown-it) является более предпочтительным, т.к. [showdown](https://github.com/showdownjs/showdown) похоже уже не поддеерживается, потому что последнее внесенное изменение в проект состоялось уже давно.