[心得] mud proxy server使用心得

看板mud (網路地下城/文字遊戲)作者dontpkme (別PK我)時間3年前 (2021/05/30 14:47)推噓8(8推 0噓 2→)

留言10則, 7人參與討論串1/1

Hi all 近期防疫持續WFH中，意外地多了許多空檔整理一些筆記發發廢文，以下是今年我嘗試架設mud web proxy和mud web client的筆記與心得，不是什麼新技術，但爬了一下版似乎沒有討論過，就來洗個發文數了題外話，這個東東同時也是之前版主t大有分享過的一個國外mud網站，該網站上所提供的技術傳送門 https://www.ptt.cc/bbs/mud/M.1590814246.A.294.html 【前言】這是以網頁方式連線並遊玩mud的解決方案，現今已有許多mud server支援可直接供網頁連線遊玩，但有更多mud並無提供此選擇， mud proxy server作為一個中介，可以把網頁端websocket的資料轉送給mud的telnet server，而mud web client擔任前端跟mud proxy server連線，輸入mud指令與輸出畫面，由此達成透過網頁瀏覽器跟各mud遊戲連線的效果。【環境準備】需先安裝 Node.js 和 npm 【實裝步驟】 1.安裝proxy server 他是一個開放的github project，可以在這裡clone： https://github.com/plamzi/MUDPortal-Web-App 安裝步驟在該頁面中有指令可以照打 2.安裝web client 同樣是github上的開源項目，請在此clone： https://github.com/houseofmaldorne/mud-web-client 安裝步驟在該頁面中有指令可以照打 3.加入https憑證檔或是關閉https連線由於預設的連線方式是採用https啟動proxy server，使網頁採用wss的通訊協定連上proxy，所以按照原本的安裝的proxy server程式，我們是需要對應的https憑證檔案才能正常啟動server的，但是git專案中並不會提供憑證檔給你測試，所以如果直接啟動的話會出現找不到憑證檔的錯誤假設你可以產出你網頁需要的憑證檔案，請把檔案放置在proxy server資料夾根目錄中，並修改wsproxy.js這隻檔案169~170行的cert和key cert: fs.readFileSync('./cert.pem'), key: fs.readFileSync('./privkey.pem'), 假設你沒有要採用https加密，可以把這167~176行這段拿掉，改採http方式啟動proxy server /* if (fs.existsSync('./server.cer') && fs.existsSync('./private.key')) { webserver = https.createServer({ cert: fs.readFileSync('./cert.pem'), key: fs.readFileSync('./privkey.pem'), }); } else { // TODO: maybe fallback to non secure connection console.log('Could not find cert and/or privkey files, exiting.'); process.exit(); } */ webserver = http.createServer(); // 加入這行 webserver.listen(srv.ws_port, function() { srv.log('(ws) server listening: port ' + srv.ws_port); }); 4.修改網頁端設定檔開啟web client網頁檔案目錄中的 src/config.js 主要需先修改 host 和 port 以及 proxy 三個參數，修改成你想要連線的mud位置和port號，以及要使用的proxy server位置，這邊要注意如果你的proxy server採用https， proxy位置要用wss://；若無則用ws:// 以原始物語為範例，可以修改成 host: 'psmud.ddns.net', port: '6789', ... proxy: 'ws://localhost:6200/', // 這邊是你的proxy server位置 5.在client端首先發送一個{connect:1} 這段說明和範例寫在wsproxy.js的檔頭註解中，然而實際上我們要修改的是web client檔案的 src/socket.js 在該檔案46行之後加入 var init_json = '{ host: "' + Config.host + '", port: ' + Config.port + ', connect: 1 }'; ws.send(init_json); 整體看起來會像這樣 var onOpen = function(evt) { log('Socket: connected'); connected = 1; var init_json = '{ host: "' + Config.host + '", port: ' + Config.port + ', connect: 1 }'; // 加入這個 ws.send(init_json); // 加入這個 if (!o.proxy && o.type == 'telnet') { ... 6.修改文字編碼到目前為止，你的proxy server已經可以遊玩英文mud了，但如果你要玩台灣常見的big5中文mud，還需要回到wsproxy.js檔案，修改402行，把 latin1 改成 big5 看起來像這樣 data = iconv.encode(data, 'big5'); 這幫助你把client端丟出去的文字轉換成big5編碼，讓原本的mud server能看得懂同理，接收訊息也要能支援big5，找到425行，在後面加一行 data = iconv.decode(Buffer.from(data), 'big5'); 整段看起來像這樣 .on('data', function(data) { data = iconv.decode(Buffer.from(data), 'big5'); srv.sendClient(s, data); }) 這段是幫你把mud server丟回來的文字用big5轉成utf8再丟還給網頁端顯示到這裡為止，所有的設定就完成了 7.啟動proxy server 在 cmd 模式下，先進入proxy server的根目錄，輸入 node wsproxy.js 指令啟動 proxy server 有看到 (ws) server listening: port 6200 就是成功了 8.連上網頁假如你有自己的網頁伺服器，就把web client那包檔案丟到你的server上，連到index.html這隻檔案，就可以從任何地方開始遊玩網頁版mud了，如果沒有自己的伺服器也沒關係，直接開啟瀏覽器，把index.html這隻檔案拖進去，也可以本地端執行喔【實際DEMO】以上實作的運行結果可以參考原始物語的WEB版入口，當然我還有後續作一些版面或功能上的調整並未列在上述內容中，傳送門在此→ http://psmud.ddns.net/client 註：網站暫不支援https連線【心得】我個人認為使用網頁連線，對於大多數老手來說並沒有什麼明顯的好處 (汗) 首先bot相關的功能就跟Zmud沒得比，再來連線多過一層proxy又要處理轉碼對於執行速度來說，多少還是有影響的，只是目前我體感覺得影響不大就是了，可能是因為玩家數太少 (倒) 然而對比較新的玩家來說，使用官方已經tune好的網頁版面，會比從制式化的mud連線工具連進去友善得多，新玩家不用從頭研究怎麼對這個MUD設定做調適，網頁排版可以預先規劃好，如顏色顯示，字體大小，字型選用，編碼設定這些通通不用管，網頁打開就可以直接體驗到官方想呈現的理想狀態同時因為不需要另外安裝client程式，只要有瀏覽器就能直接進入遊戲遊玩，對於推坑新人或許會是個助力，當然至少還是要先安裝瀏覽器啦，不過IE都能跑，所以這應該不構成門檻，對於上班族來說，可以把遊戲藏在瀏覽器的某個分頁裡，應該也比開著看起來有點可疑的Zmud程式來得更不引人耳目，這點是我自己之前玩小貓的世界Web版的心得XD 以上是我騙P幣的心得報告分享給有需要的人謝謝大家 -- 本篇文撰寫感謝從去年重開機後長期支持原始物語的tong技術諮詢 -- ※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 118.168.136.91 (臺灣) ※ 文章網址: https://www.ptt.cc/bbs/mud/M.1622357229.A.3DE.html