學習Java的神器已上線，面向廣大Java愛好者！
之前寫的一篇：打造一款 刷Java 知識的小程序（一）
一、第二版做了什么？
- 第一版小程序只具有初級展示功能，知識點都是hardcode在代碼里面的。
- 這一次進行了大升級，知識點從后端（小程序雲開發）獲取
- 知識點都是用Markdown語言寫的，支持將Markdown內容無縫轉換成小程序頁面。
二、C端與后端的交互邏輯
mark
2.1、功能跳轉
- 首頁點擊Java基礎圖標進入到Java基礎知識列表頁面
- 列表頁點擊“查看”按鈕進入詳情頁面
2.2、准備工作
1.雲開發存儲上傳一個markdown文件
2.雲開發數據庫插入兩條記錄
2.2、代碼實現
- 調用 自己編寫的雲函數 getJavaQuestionList 獲取列表；
- 調用 自己編寫的雲函數 getJavaQuestionDetail 獲取詳情的 Markdown文件路徑；
- 調用 系統自帶的雲函數 downloadFile 下載 Markdown文件保存為臨時文件；
- 調用 小程序自帶的 saveFileSync 將臨時文件保存到本地；
- 調用 小程序自帶的 readFileSync 將本地文件讀入緩存（注意：開發者工具上不需要保存到本地也可以正常讀取）；
- 使用 towxml 開源組件將緩存中markdown內容轉成小程序可以識別的元素
- 給 圖片元素添加預覽事件
三、我與Markdown大戰一天一晚
痛點：Markdown轉小程序頁面很難受，小程序頁面並不能識別Markdown標記。
方案一、用Typora工具將 Markdown文件復制為html內容直接粘貼到表字段里面
mark
遇到的問題，發現復制的HTML代碼都不包含樣式，而用小程序富文本組件后，在WXSS文件定義樣式對富文本里面的標簽元素是不生效的。於是只能自己加樣式，那就用正則匹配標簽來加style吧。寫着寫着發現好多style要加。比如h1,h2,image。最坑的是Markdown轉為html是code標簽，小程序不識別code標簽，所以將code標簽轉為div標簽，然后還得處理換行，而且針對代碼需要有不同的高亮顯示，這太麻煩了。但基本上已經不影響閱讀了。
mark
方案二、將Markdown文件復制為markdown格式內容直接粘貼到表字段里面
找到一個開源組件可以將markdown 標記轉為小程序元素，叫做wemark。
於是就把markdown 內容復制到數據庫中，但發現存到數據庫的是沒有換行的，所以讀取之后需要做換行處理，這里就又用到正則表達式了。處理完了也能正常顯示了，但圖片不能放大看，這個就比較難受了。
方案三、將Markdown文件存到某個地方，比如COS，阿里雲，七牛雲，自己搭建的服務器
這里是將文件上傳到小程序雲開發的存儲里面，而且小程序提供了對應的下載雲存儲文件的SDK，非常方便。
然后使用towxml開源組件將markdown轉為小程序元素，和wemark相比優勢如下：
1.支持自定義towxml組件哪些功能開放，比如轉換markdown的圖表、數學公式等
2.支持自定義towxml 支持哪些code格式高亮
3.支持綁定小程序元素事件（這個功能太棒了）
大戰一天一晚完美解決Markdown轉小程序的問題
4. 后續計划
貌似直接用小程序雲開發就夠用了，但雲開發的訪問次數，存儲空間有限制。另外直接操作雲開發控制台不方便，做個后台操作起來更方便、更安全。之前搭建的一個服務器因到期被回收了，又得重新搭一套了。另外會先在本地把后端服務和Portal先跑起來。
掃描二維碼關注
領取架構師資料
更多內容
- 打造一款 刷Java 知識的小程序（一）
- 07.深入淺出 Spring Boot - 數據訪問之Mybatis（附代碼下載）
- 06.深入淺出 Spring Boot - 數據訪問之Druid（附代碼下載）
- 05.深入淺出 Spring Boot - 數據訪問之JDBC（源碼分析+代碼下載）
- 每天玩轉3分鍾 MyBatis-Plus - 6. select 用法