添加调试页面支持

CMakeLists.txt

@@ -74,6 +74,7 @@ include_directories(
   app_protocols/ #
   ./ #
   appdep/libs/libixwebsocket/include #
+  appdep/libs/
   appdep/libs/libhpdf/include)
 
 link_directories(appdep/libs/libixwebsocket/${ARCH}/
@@ -114,3 +115,16 @@ zadd_executable(
   ${APP_DEP_SRC}
   appsrc/appbase/utils/zsimplepdf.cpp
   ./test/testpdf.cpp)
+
+#
+# debugpage
+#
+zadd_executable(
+  TARGET
+  debugpage.out #
+  INSTALL
+  ./app/ #
+  SRC
+  ${APP_DEP_SRC}
+  appsrc/appbase/utils/zsimplepdf.cpp
+  ./test/debugpage.cpp)

appsrc/appcomponents/canchannel/com/zscanprotocol_com.cpp

@@ -203,7 +203,7 @@ shared_ptr<Receipt> ZSCanProtocolCom::callcmd(int32_t to, int32_t cmdid, uint8_t
     } catch (const appexception &e) {
       if (e.ecode() == err::kerr_overtime) {
         // sl
-        if (i != 0) logger->warn("callcmd cmdid[%d] to [%d] overtime, retry {}", cmdid, to, i);
+        if (i != 0) logger->warn("callcmd cmdid[{}] to [{}] overtime, retry {}", cmdid, to, i);
         usleep(100 * 1000);
         continue;
       }

appsrc/baseservice/debugpage/debugpage.cpp

@@ -0,0 +1,12 @@
+#include "debugpage.hpp"
+using namespace iflytop;
+using namespace std;
+
+void DebugPage::initialize() {
+  thread.reset(new Thread("DebugPage", [this]() {
+    logger->info("DebugPage::initialize");
+    Server svr;
+    svr.set_base_dir("./html/debug/");
+    svr.listen("0.0.0.0", 8081);
+  }));
+}

appsrc/baseservice/debugpage/debugpage.hpp

@@ -0,0 +1,50 @@
+//
+// Created by zwsd
+//
+
+#pragma once
+#include <fstream>
+#include <iostream>
+#include <list>
+#include <map>
+#include <memory>
+#include <set>
+#include <sstream>
+#include <string>
+#include <vector>
+
+#include "appbase/appbase.hpp"
+#include "appsetting/appsetting.hpp"
+#include "httplib/httplib.h"
+
+/**
+ * @brief
+ *
+ * service: FrontMsgProcesser
+ *
+ * 监听事件:
+ * 依赖状态:
+ * 依赖服务:
+ * 作用:
+ *
+ */
+
+namespace iflytop {
+using namespace std;
+using namespace core;
+using namespace httplib;
+
+class DebugPage {
+  THISCLASS(DebugPage)
+ private:
+  /* data */
+  unique_ptr<Thread> thread;
+
+ public:
+  DebugPage(/* args */) {}
+  ~DebugPage() {}
+
+  void initialize();
+};
+
+}  // namespace iflytop

appsrc/service/app_core.cpp

@@ -1,6 +1,7 @@
 #include "app_core.hpp"
 
 #include "baseservice/baseservice.hpp"
+#include "baseservice/debugpage/debugpage.hpp"
 #include "service/audit_mgr_service.hpp"
 #include "service/device_info_mgr_service.hpp"
 #include "service/disinfection_logs_service.hpp"
@@ -31,10 +32,10 @@ void AppCore::dosystem(string order, bool dump) {
 }
 
 void AppCore::initialize() {
-
-
   // FrontEnd
   BUILD_AND_REG_SERRVICE(IflytopFrontEndService);
+  BUILD_AND_REG_SERRVICE(DebugPage);
+
   // Data
   ProjectPort::ins().initialize();
   BUILD_AND_REG_SERRVICE(DBService);

buildpc.sh

@@ -11,14 +11,13 @@
 
 mkdir -p build && rm -rf build && mkdir build
 inittestdata.sh
+ln -s ../html build/html
 
 cd build
-cmake .. \
-    -DARCH=amd64
+cmake .. -DARCH=amd64
 
 make -j8
 
-cmake .. \
-    -DARCH=amd64
+cmake .. -DARCH=amd64
 make -j8
 make install

html/debug/ant-design-vue/reset.min.css

@@ -0,0 +1,8 @@
+/**
+ * Minified by jsDelivr using clean-css v5.3.2.
+ * Original file: /npm/ant-design-vue@4.2.3/dist/reset.css
+ *
+ * Do NOT use SRI with dynamically generated files! More information: https://www.jsdelivr.com/using-sri-with-dynamic-files
+ */
+body,html{width:100%;height:100%}input::-ms-clear,input::-ms-reveal{display:none}*,::after,::before{box-sizing:border-box}html{font-family:sans-serif;line-height:1.15;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;-ms-overflow-style:scrollbar;-webkit-tap-highlight-color:transparent}@-ms-viewport{width:device-width}body{margin:0}[tabindex='-1']:focus{outline:0}hr{box-sizing:content-box;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.5em;font-weight:500}p{margin-top:0;margin-bottom:1em}abbr[data-original-title],abbr[title]{-webkit-text-decoration:underline dotted;text-decoration:underline;text-decoration:underline dotted;border-bottom:0;cursor:help}address{margin-bottom:1em;font-style:normal;line-height:inherit}input[type=number],input[type=password],input[type=text],textarea{-webkit-appearance:none}dl,ol,ul{margin-top:0;margin-bottom:1em}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:500}dd{margin-bottom:.5em;margin-left:0}blockquote{margin:0 0 1em}dfn{font-style:italic}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}code,kbd,pre,samp{font-size:1em;font-family:SFMono-Regular,Consolas,'Liberation Mono',Menlo,Courier,monospace}pre{margin-top:0;margin-bottom:1em;overflow:auto}figure{margin:0 0 1em}img{vertical-align:middle;border-style:none}[role=button],a,area,button,input:not([type=range]),label,select,summary,textarea{touch-action:manipulation}table{border-collapse:collapse}caption{padding-top:.75em;padding-bottom:.3em;text-align:left;caption-side:bottom}button,input,optgroup,select,textarea{margin:0;color:inherit;font-size:inherit;font-family:inherit;line-height:inherit}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{padding:0;border-style:none}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=date],input[type=datetime-local],input[type=month],input[type=time]{-webkit-appearance:listbox}textarea{overflow:auto;resize:vertical}fieldset{min-width:0;margin:0;padding:0;border:0}legend{display:block;width:100%;max-width:100%;margin-bottom:.5em;padding:0;color:inherit;font-size:1.5em;line-height:inherit;white-space:normal}progress{vertical-align:baseline}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{outline-offset:-2px;-webkit-appearance:none}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}output{display:inline-block}summary{display:list-item}template{display:none}[hidden]{display:none!important}mark{padding:.2em;background-color:#feffe6}
+/*# sourceMappingURL=/sm/032064be2fa88a51346e05fa5ca38b80429a1c6e61fcfff40df882932818a4f1.map */

html/debug/dayjs/plugin/advancedFormat.js

@@ -0,0 +1 @@
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e||self).dayjs_plugin_advancedFormat=t()}(this,(function(){"use strict";return function(e,t){var r=t.prototype,n=r.format;r.format=function(e){var t=this,r=this.$locale();if(!this.isValid())return n.bind(this)(e);var s=this.$utils(),a=(e||"YYYY-MM-DDTHH:mm:ssZ").replace(/\[([^\]]+)]|Q|wo|ww|w|WW|W|zzz|z|gggg|GGGG|Do|X|x|k{1,2}|S/g,(function(e){switch(e){case"Q":return Math.ceil((t.$M+1)/3);case"Do":return r.ordinal(t.$D);case"gggg":return t.weekYear();case"GGGG":return t.isoWeekYear();case"wo":return r.ordinal(t.week(),"W");case"w":case"ww":return s.s(t.week(),"w"===e?1:2,"0");case"W":case"WW":return s.s(t.isoWeek(),"W"===e?1:2,"0");case"k":case"kk":return s.s(String(0===t.$H?24:t.$H),"k"===e?1:2,"0");case"X":return Math.floor(t.$d.getTime()/1e3);case"x":return t.$d.getTime();case"z":return"["+t.offsetName()+"]";case"zzz":return"["+t.offsetName("long")+"]";default:return e}}));return n.bind(this)(a)}}}));

html/debug/dayjs/plugin/customParseFormat.js

@@ -0,0 +1 @@
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e||self).dayjs_plugin_customParseFormat=t()}(this,(function(){"use strict";var e={LTS:"h:mm:ss A",LT:"h:mm A",L:"MM/DD/YYYY",LL:"MMMM D, YYYY",LLL:"MMMM D, YYYY h:mm A",LLLL:"dddd, MMMM D, YYYY h:mm A"},t=/(\[[^[]*\])|([-_:/.,()\s]+)|(A|a|Q|YYYY|YY?|ww?|MM?M?M?|Do|DD?|hh?|HH?|mm?|ss?|S{1,3}|z|ZZ?)/g,n=/\d/,r=/\d\d/,i=/\d\d?/,o=/\d*[^-_:/,()\s\d]+/,s={},a=function(e){return(e=+e)+(e>68?1900:2e3)};var f=function(e){return function(t){this[e]=+t}},h=[/[+-]\d\d:?(\d\d)?|Z/,function(e){(this.zone||(this.zone={})).offset=function(e){if(!e)return 0;if("Z"===e)return 0;var t=e.match(/([+-]|\d\d)/g),n=60*t[1]+(+t[2]||0);return 0===n?0:"+"===t[0]?-n:n}(e)}],u=function(e){var t=s[e];return t&&(t.indexOf?t:t.s.concat(t.f))},d=function(e,t){var n,r=s.meridiem;if(r){for(var i=1;i<=24;i+=1)if(e.indexOf(r(i,0,t))>-1){n=i>12;break}}else n=e===(t?"pm":"PM");return n},c={A:[o,function(e){this.afternoon=d(e,!1)}],a:[o,function(e){this.afternoon=d(e,!0)}],Q:[n,function(e){this.month=3*(e-1)+1}],S:[n,function(e){this.milliseconds=100*+e}],SS:[r,function(e){this.milliseconds=10*+e}],SSS:[/\d{3}/,function(e){this.milliseconds=+e}],s:[i,f("seconds")],ss:[i,f("seconds")],m:[i,f("minutes")],mm:[i,f("minutes")],H:[i,f("hours")],h:[i,f("hours")],HH:[i,f("hours")],hh:[i,f("hours")],D:[i,f("day")],DD:[r,f("day")],Do:[o,function(e){var t=s.ordinal,n=e.match(/\d+/);if(this.day=n[0],t)for(var r=1;r<=31;r+=1)t(r).replace(/\[|\]/g,"")===e&&(this.day=r)}],w:[i,f("week")],ww:[r,f("week")],M:[i,f("month")],MM:[r,f("month")],MMM:[o,function(e){var t=u("months"),n=(u("monthsShort")||t.map((function(e){return e.slice(0,3)}))).indexOf(e)+1;if(n<1)throw new Error;this.month=n%12||n}],MMMM:[o,function(e){var t=u("months").indexOf(e)+1;if(t<1)throw new Error;this.month=t%12||t}],Y:[/[+-]?\d+/,f("year")],YY:[r,function(e){this.year=a(e)}],YYYY:[/\d{4}/,f("year")],Z:h,ZZ:h};function l(n){var r,i;r=n,i=s&&s.formats;for(var o=(n=r.replace(/(\[[^\]]+])|(LTS?|l{1,4}|L{1,4})/g,(function(t,n,r){var o=r&&r.toUpperCase();return n||i[r]||e[r]||i[o].replace(/(\[[^\]]+])|(MMMM|MM|DD|dddd)/g,(function(e,t,n){return t||n.slice(1)}))}))).match(t),a=o.length,f=0;f<a;f+=1){var h=o[f],u=c[h],d=u&&u[0],l=u&&u[1];o[f]=l?{regex:d,parser:l}:h.replace(/^\[|\]$/g,"")}return function(e){for(var t={},n=0,r=0;n<a;n+=1){var i=o[n];if("string"==typeof i)r+=i.length;else{var s=i.regex,f=i.parser,h=e.slice(r),u=s.exec(h)[0];f.call(t,u),e=e.replace(u,"")}}return function(e){var t=e.afternoon;if(void 0!==t){var n=e.hours;t?n<12&&(e.hours+=12):12===n&&(e.hours=0),delete e.afternoon}}(t),t}}return function(e,t,n){n.p.customParseFormat=!0,e&&e.parseTwoDigitYear&&(a=e.parseTwoDigitYear);var r=t.prototype,i=r.parse;r.parse=function(e){var t=e.date,r=e.utc,o=e.args;this.$u=r;var a=o[1];if("string"==typeof a){var f=!0===o[2],h=!0===o[3],u=f||h,d=o[2];h&&(d=o[2]),s=this.$locale(),!f&&d&&(s=n.Ls[d]),this.$d=function(e,t,n,r){try{if(["x","X"].indexOf(t)>-1)return new Date(("X"===t?1e3:1)*e);var i=l(t)(e),o=i.year,s=i.month,a=i.day,f=i.hours,h=i.minutes,u=i.seconds,d=i.milliseconds,c=i.zone,m=i.week,M=new Date,Y=a||(o||s?1:M.getDate()),p=o||M.getFullYear(),v=0;o&&!s||(v=s>0?s-1:M.getMonth());var D,w=f||0,g=h||0,y=u||0,L=d||0;return c?new Date(Date.UTC(p,v,Y,w,g,y,L+60*c.offset*1e3)):n?new Date(Date.UTC(p,v,Y,w,g,y,L)):(D=new Date(p,v,Y,w,g,y,L),m&&(D=r(D).week(m).toDate()),D)}catch(e){return new Date("")}}(t,a,r,n),this.init(),d&&!0!==d&&(this.$L=this.locale(d).$L),u&&t!=this.format(a)&&(this.$d=new Date("")),s={}}else if(a instanceof Array)for(var c=a.length,m=1;m<=c;m+=1){o[1]=a[m-1];var M=n.apply(this,o);if(M.isValid()){this.$d=M.$d,this.$L=M.$L,this.init();break}m===c&&(this.$d=new Date(""))}else i.call(this,e)}}}));

html/debug/dayjs/plugin/localeData.js

@@ -0,0 +1 @@
+!function(n,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(n="undefined"!=typeof globalThis?globalThis:n||self).dayjs_plugin_localeData=e()}(this,(function(){"use strict";return function(n,e,t){var r=e.prototype,o=function(n){return n&&(n.indexOf?n:n.s)},u=function(n,e,t,r,u){var i=n.name?n:n.$locale(),a=o(i[e]),s=o(i[t]),f=a||s.map((function(n){return n.slice(0,r)}));if(!u)return f;var d=i.weekStart;return f.map((function(n,e){return f[(e+(d||0))%7]}))},i=function(){return t.Ls[t.locale()]},a=function(n,e){return n.formats[e]||function(n){return n.replace(/(\[[^\]]+])|(MMMM|MM|DD|dddd)/g,(function(n,e,t){return e||t.slice(1)}))}(n.formats[e.toUpperCase()])},s=function(){var n=this;return{months:function(e){return e?e.format("MMMM"):u(n,"months")},monthsShort:function(e){return e?e.format("MMM"):u(n,"monthsShort","months",3)},firstDayOfWeek:function(){return n.$locale().weekStart||0},weekdays:function(e){return e?e.format("dddd"):u(n,"weekdays")},weekdaysMin:function(e){return e?e.format("dd"):u(n,"weekdaysMin","weekdays",2)},weekdaysShort:function(e){return e?e.format("ddd"):u(n,"weekdaysShort","weekdays",3)},longDateFormat:function(e){return a(n.$locale(),e)},meridiem:this.$locale().meridiem,ordinal:this.$locale().ordinal}};r.localeData=function(){return s.bind(this)()},t.localeData=function(){var n=i();return{firstDayOfWeek:function(){return n.weekStart||0},weekdays:function(){return t.weekdays()},weekdaysShort:function(){return t.weekdaysShort()},weekdaysMin:function(){return t.weekdaysMin()},months:function(){return t.months()},monthsShort:function(){return t.monthsShort()},longDateFormat:function(e){return a(n,e)},meridiem:n.meridiem,ordinal:n.ordinal}},t.months=function(){return u(i(),"months")},t.monthsShort=function(){return u(i(),"monthsShort","months",3)},t.weekdays=function(n){return u(i(),"weekdays",null,null,n)},t.weekdaysShort=function(n){return u(i(),"weekdaysShort","weekdays",3,n)},t.weekdaysMin=function(n){return u(i(),"weekdaysMin","weekdays",2,n)}}}));

html/debug/dayjs/plugin/quarterOfYear.js

@@ -0,0 +1 @@
+!function(t,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n():"function"==typeof define&&define.amd?define(n):(t="undefined"!=typeof globalThis?globalThis:t||self).dayjs_plugin_quarterOfYear=n()}(this,(function(){"use strict";var t="month",n="quarter";return function(e,i){var r=i.prototype;r.quarter=function(t){return this.$utils().u(t)?Math.ceil((this.month()+1)/3):this.month(this.month()%3+3*(t-1))};var s=r.add;r.add=function(e,i){return e=Number(e),this.$utils().p(i)===n?this.add(3*e,t):s.bind(this)(e,i)};var u=r.startOf;r.startOf=function(e,i){var r=this.$utils(),s=!!r.u(i)||i;if(r.p(e)===n){var o=this.quarter()-1;return s?this.month(3*o).startOf(t).startOf("day"):this.month(3*o+2).endOf(t).endOf("day")}return u.bind(this)(e,i)}}}));

html/debug/dayjs/plugin/weekOfYear.js

@@ -0,0 +1 @@
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e||self).dayjs_plugin_weekOfYear=t()}(this,(function(){"use strict";var e="week",t="year";return function(i,n,r){var f=n.prototype;f.week=function(i){if(void 0===i&&(i=null),null!==i)return this.add(7*(i-this.week()),"day");var n=this.$locale().yearStart||1;if(11===this.month()&&this.date()>25){var f=r(this).startOf(t).add(1,t).date(n),s=r(this).endOf(e);if(f.isBefore(s))return 1}var a=r(this).startOf(t).date(n).startOf(e).subtract(1,"millisecond"),o=this.diff(a,e,!0);return o<0?r(this).startOf("week").week():Math.ceil(o)},f.weeks=function(e){return void 0===e&&(e=null),this.week(e)}}}));

html/debug/dayjs/plugin/weekYear.js

@@ -0,0 +1 @@
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e||self).dayjs_plugin_weekYear=t()}(this,(function(){"use strict";return function(e,t){t.prototype.weekYear=function(){var e=this.month(),t=this.week(),n=this.year();return 1===t&&11===e?n+1:0===e&&t>=52?n-1:n}}}));

html/debug/dayjs/plugin/weekday.js

@@ -0,0 +1 @@
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e||self).dayjs_plugin_weekday=t()}(this,(function(){"use strict";return function(e,t){t.prototype.weekday=function(e){var t=this.$locale().weekStart||0,i=this.$W,n=(i<t?i+7:i)-t;return this.$utils().u(e)?n:this.subtract(n,"day").add(e,"day")}}}));

html/debug/index.html

@@ -0,0 +1,199 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <title>TMP</title>
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <script src="./vue.global.js"></script>
+  <script src="./dayjs/dayjs.min.js"></script>
+  <script src="./dayjs/plugin/customParseFormat.js"></script>
+  <script src="./dayjs/plugin/weekday.js"></script>
+  <script src="./dayjs/plugin/localeData.js"></script>
+  <script src="./dayjs/plugin/weekOfYear.js"></script>
+  <script src="./dayjs/plugin/weekYear.js"></script>
+  <script src="./dayjs/plugin/advancedFormat.js"></script>
+  <script src="./dayjs/plugin/quarterOfYear.js"></script>
+  <script src="./ant-design-vue/antd.min.js"></script>
+  <link href="./ant-design-vue/reset.min.css" rel="stylesheet">
+</head>
+
+<body>
+  <div id="app" class="h-full">
+    <a-row class="h-full">
+      <a-col :span="6">
+        <div style="display:flex;padding:5px;">
+          <a-input v-model:value="wsUrl" style="margin-right:5px;"></a-input>
+          <a-button v-if="null === ws" @click="actionConnect">Connect</a-button>
+          <a-button v-else @click="actionDisconnect">DisConnect</a-button>
+        </div>
+        <a-menu mode="inline" :items="actionMenuItems" @click="actionGroupMenuItemClick"></a-menu>
+      </a-col>
+      <a-col :span="12" style="background-color: #f1f1f1;display:flex;flex-direction: column;">
+        <div v-if="null !== actionActiveGroup"
+          style="height:0;flex-grow: 1;overflow-y: auto;margin-bottom: 10px;padding: 10px;">
+          <div v-for="item in actionActiveGroup.items" class="action" style="margin-bottom: 5px;">
+            <div style="margin-right:5px;">
+              <a-input :value="item.fnName" disabled />
+            </div>
+            <div v-for="param in item.params">
+              <a-input v-model:value="item.values[param]" :placeholder="param" />
+            </div>
+            <a-button style="margin-left:5px;" @click="actionActionExecute(item)">DOIT</a-button>
+          </div>
+        </div>
+        <div style="padding:10px;">
+          <a-textarea v-model:value="rawRequestContent" style="margin-bottom: 5px;"></a-textarea>
+          <div>
+            <a-button @click="actionSendRawRequest">Send</a-button>
+          </div>
+        </div>
+      </a-col>
+      <a-col :span="6" style="overflow-y: auto;height: 100%;">
+        <a-collapse v-model:activeKey="activeKey">
+          <a-collapse-panel v-for="(entry,index) in logs" :key="index" :header="entry.title">
+            <div style="white-space: pre-wrap;">
+              {{entry.content}}
+            </div>
+          </a-collapse-panel>
+        </a-collapse>
+      </a-col>
+    </a-row>
+  </div>
+  <script>
+    const { createApp } = Vue
+    createApp({
+      data() {
+        return {
+          actions: [],
+          actionActiveGroup: null,
+          rawRequestContent: '',
+          logs: [],
+          wsUrl: "ws://" + window.location.hostname + ":19001",
+          ws: null,
+          wsMessageIndex: 0,
+          requests: {},
+        }
+      },
+      computed: {
+        actionMenuItems() {
+          return this.actions.map(i => ({ key: i.key, label: i.key }));
+        }
+      },
+      methods: {
+        // connect
+        actionConnect() {
+          this.ws = new WebSocket(this.wsUrl);
+          this.ws.onclose = () => this.ws = null;
+          this.ws.onmessage = event => {
+            let data = JSON.parse(event.data);
+            let responseEntry = {};
+            responseEntry.title = `${data.messageType}`;
+            responseEntry.content = JSON.stringify(data, null, 2);
+            this.logs.push(responseEntry);
+            if ('Ack' === data.messageType && 'FNScheduler' === data.fromClass && 'geFnList' === data.fromFn) {
+              this.actionListReload(data);
+            }
+          };
+          this.ws.onopen = () => {
+            this.wsMessageIndex++;
+            let request = {};
+            request.messageId = this.wsMessageIndex;
+            request.timeStamp = Math.floor(Date.now() / 1000);
+            request.messageType = 'Command';
+            request.className = 'FNScheduler';
+            request.fnName = 'geFnList';
+            request.params = {};
+            this.wsCall(request);
+          }
+        },
+
+        // disconnect
+        actionDisconnect() {
+          this.ws.close();
+        },
+
+        // action list reload
+        actionListReload(response) {
+          let data = response.rely;
+          if (undefined === data) {
+            return;
+          }
+
+          this.actions = [];
+          for (let action of data.fnlist) {
+            let group = this.actions.find(i => i.key === action.className);
+            if (undefined === group) {
+              group = { key: action.className, items: [] };
+              this.actions.push(group);
+            }
+            item = structuredClone(action);
+            item.values = {};
+            group.items.push(item);
+          }
+        },
+
+        // action group menu item click
+        actionGroupMenuItemClick(event) {
+          this.actionActiveGroup = this.actions.find(i => i.key === event.key);
+        },
+
+        // action execute
+        actionActionExecute(item) {
+          this.wsMessageIndex++;
+
+          let request = {};
+          request.messageId = this.wsMessageIndex;
+          request.timeStamp = Math.floor(Date.now() / 1000);
+          request.messageType = 'Command';
+          request.className = item.className;
+          request.fnName = item.fnName;
+          request.params = {};
+          for (let i = 0; i < item.params.length; i++) {
+            let param = item.params[i];
+            let type = item.paramsTypeInfo[i];
+            let value = item.values[param];
+            switch (type) {
+              case 'int32_t': value *= 1; break;
+              case 'string': /* nothing to do here */ break;
+              default: /* throw an exception is required. */
+            }
+            request.params[param] = value;
+          }
+          this.wsCall(request);
+        },
+
+        // raw request send
+        actionSendRawRequest() {
+          let request = JSON.parse(this.rawRequestContent);
+          this.wsCall(request);
+        },
+
+        // ws call
+        wsCall(request) {
+          if (null === this.ws) {
+            return;
+          }
+          let requestEntry = {};
+          requestEntry.title = `${request.messageType} : ${request.className}.${request.fnName}`;
+          requestEntry.content = JSON.stringify(request, null, 2);
+          this.logs.push(requestEntry);
+          this.ws.send(JSON.stringify(request));
+        },
+      },
+    })
+      .use(antd)
+      .mount('#app');
+  </script>
+  <style>
+    .h-full {
+      height: 100%;
+    }
+
+    .action {
+      display: flex;
+      flex-direction: row;
+    }
+  </style>
+</body>
+
+</html>

test/debugpage.cpp

@@ -0,0 +1,40 @@
+/*
+ * << Haru Free PDF Library 2.0.0 >> -- font_demo.cpp
+ *
+ * Copyright (c) 1999-2006 Takeshi Kanno <takeshi_kanno@est.hi-ho.ne.jp>
+ *
+ * Permission to use, copy, modify, distribute and sell this software
+ * and its documentation for any purpose is hereby granted without fee,
+ * provided that the above copyright notice appear in all copies and
+ * that both that copyright notice and this permission notice appear
+ * in supporting documentation.
+ * It is provided "as is" without express or implied warranty.
+ *
+ */
+#include <assert.h>
+#include <iconv.h>
+#include <stdio.h>
+#include <stdlib.h>
+#include <string.h>
+
+#include <fstream>
+#include <functional>
+#include <iostream>
+#include <list>
+#include <map>
+#include <memory>
+#include <set>
+#include <sstream>
+#include <string>
+#include <vector>
+
+#include "httplib/httplib.h"
+
+using namespace std;
+using namespace httplib;
+
+int main() {
+  Server svr;
+  svr.set_base_dir("./html/debug/");
+  svr.listen("0.0.0.0", 8081);
+}