[心得] mud proxy server使用心得

看板mud作者 (別PK我)時間2年前 (2021/05/30 14:47), 編輯推噓6(601)
留言7則, 6人參與, 2年前最新討論串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幣的心得報告 分享給有需要的人 謝謝大家 -- ※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 118.168.136.91 (臺灣) ※ 文章網址: https://www.ptt.cc/bbs/mud/M.1622357229.A.3DE.html

05/30 16:52, 2年前 , 1F
感謝d大您發表的寶貴心得~~~ :D
05/30 16:52, 1F

05/30 16:53, 2年前 , 2F
已收錄於精華區z-4-20
05/30 16:53, 2F

05/30 19:05, 2年前 , 3F
05/30 19:05, 3F

05/30 21:57, 2年前 , 4F
typers大您的小貓web給予我很多啟發
05/30 21:57, 4F

05/31 01:44, 2年前 , 5F
推分享~
05/31 01:44, 5F

05/31 20:54, 2年前 , 6F
推一個
05/31 20:54, 6F

06/02 12:27, 2年前 , 7F
很厲害~讚~:)
06/02 12:27, 7F
文章代碼(AID): #1WipJjFU (mud)