搭建了 ctfd 的朋友可能都知道,ctfd 中如果题目多起來了,就會在一個頁面中顯示所有的題目,這個時候就需要一個分類分頁插件,從互聯網上搜索之後,發現有一個項目可以滿足要求,效果類似於 ctfshow、buuoj。
項目地址:https://github.com/frankli0324/ctfd-pages-theme
看了一下,這個項目很多人都 npm 報錯,我也嘗試了好幾次,也是 npm 報錯,那些報錯我也不知道是什麼意思,雖然報錯了,但是可以不管報錯,同樣可以達到需要的效果。
這裡就寫下搭建的一個流程,我是直接在ctfd-pages-theme
的基礎上修改的core
目錄下的文件,只需要替換掉兩個文件即可。
1、CTFd/themes/core/assets/js/pages/challenges.js
2、CTFd/themes/core/templates/challenges.html
如果你是直接修改的 core 目錄下的challenges.*
文件的話,ctfd-pages-theme項目說的將webpack.config.js替換為倉庫中的webpack.config.js 然後利用npm構建
可以忽略,直接使用原先的webpack.config.js
文件即可。
前置工作好了之後,就可以開始通過 npm 構建了。
1、安裝 npm
sudo apt install npm
2、安裝完 npm 之後,設置 npm 源
npm config set registry https://registry.npm.taobao.org
3、構建
npm i && npm run build
4、如果構建報錯如下,說明 npm 構建有問題
但是如果報錯信息上面還有綠字信息。
說明 pages 分類頁面可以使用了,為什麼報錯呢?看了下,可能和admin theme
主題有關,但這個消息可以忽略。
5、最後一步,就是重新docker-compose
和重啟ctfd容器
。
sudo docker-compose up -d
sudo docker restart 13d
效果如下:
end...