PHP和Composer做语法转化东西
原文地址：https://www.mengze2.cn/post/5/
最近不是把博客的一些文章从和HTML转到Markdown了吗，由于之前换到了wordpress所以是HTML，可是这些文章再typecho无法被解析，于是就计划开发一个Markdown2HTML东西
下面使我的开发笔记，或许比较迷糊
项目结构
一般情况下，我不会这么干，可是为了文章，仍是需求界说的项目结构：
markdown2html/
│
├── index.php
├── convert.php
├── styles/
│ └── bootstrap.min.css
└── js/
└── bootstrap.bundle.min.js
index.php: 前端页面，包括输入框和按钮。convert.php: 后端逻辑处理，将HTML转化为Markdown或将Markdown转化为HTML。styles/: 寄存CSS文件。js/: 寄存JavaScript文件。
准备工作
下载Bootstrap
从Bootstrap官方网站下载最新版别的Bootstrap，并将bootstrap.min.css放入styles/文件夹，将bootstrap.bundle.min.js放入js/文件夹。也便是所谓的按需导入
编写前端页面 (index.php)
编写前端页面，包括一个文本输入框和两个按钮，别离用于将HTML转化为Markdown和将Markdown转化为HTML。这儿不要求美观，并且需求快速开发呼应式页面，所以挑选bootstrap
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>转化东西</title>
<link rel="stylesheet" href="styles/bootstrap.min.css">
</head>
<body>
<div class="container mt-5">
<h1 class="text-center">转化东西</h1>
<form id="convertForm" method="post">
<div class="mb-3">
<label for="inputText" class="form-label">Input Text</label>
<textarea class="form-control" id="inputText" name="inputText" rows="10"></textarea>
</div>
<div class="d-flex justify-content-between">
<button type="button" class="btn btn-primary" onclick="convert('html2markdown')">HTML转Markdown</button>
<button type="button" class="btn btn-secondary" onclick="convert('markdown2html')">Markdown转HTML</button>
</div>
<div class="mt-3">
<label for="outputText" class="form-label">Output Text</label>
<textarea class="form-control" id="outputText" name="outputText" rows="10" readonly></textarea>
</div>
</form>
</div>
<script src="js/bootstrap.bundle.min.js"></script>
<script>
function convert(action) {
const form = document.getElementById('convertForm');
const formData = new FormData(form);
formData.append('action', action);
fetch('convert.php', {
method: 'POST',
body: formData
})
.then(response => response.text())
.then(data => {
document.getElementById('outputText').value = data;
});
}
</script>
</body>
</html>
编写后端逻辑 (convert.php)
接下来，编写后端逻辑，将HTML转化为Markdown或将Markdown转化为HTML。
<?php
require 'vendor/autoload.php'; // 运用Composer加载依靠
use League\HTMLToMarkdown\HtmlConverter;
use Michelf\Markdown;
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
$inputText = $_POST['inputText'];
$action = $_POST['action'];
if ($action === 'html2markdown') {
$converter = new HtmlConverter();
$outputText = $converter->convert($inputText);
} elseif ($action === 'markdown2html') {
$outputText = Markdown::defaultTransform($inputText);
}
echo $outputText;
}
?>
增加依靠
需求装置两个PHP库来完成转化功用：
Composer是一个包管理器，相似node的npm，和我发现PHP和Vue有异曲同工之妙
league/html-to-markdown: 将HTML转化为Markdown。michelf/php-markdown: 将Markdown转化为HTML。
在项目根目录下创立一个composer.json文件，内容如下：
{
"require": {
"league/html-to-markdown": "^5.0",
"michelf/php-markdown": "^1.9"
}
}
然后运转composer install来装置这些依靠。
composer install
终究作用
发动本地服务器（例如运用php -S localhost:8000），拜访http://localhost:8000/，就可以看到转化东西的界面了。
