iT邦幫忙

2

node與socket聊天室

我自製了一個運用node、socket、html的聊天室。
然後我遇到一個麻煩
當客戶端在接收與傳輸訊息時,我是用append將文字貼上,也因此如果有人在裡面輸入程式碼的話,也會被執行,請問該如何清除這個效果呢?

看更多先前的討論...收起先前的討論...
weiclin iT邦高手 4 級 ‧ 2018-11-08 12:35:03 檢舉
先用這個處理過:
https://www.npmjs.com/package/js-htmlencode
多謝,真的可以
淺水員 iT邦新手 5 級 ‧ 2018-11-08 15:29:46 檢舉
其實瀏覽器用 textContent 寫入時
就可以避免掉標籤的問題
https://www.w3schools.com/jsref/prop_node_textcontent.asp

如果是 jQuery 可以參考下面的例子
=====================================
<!--顯示訊息區域-->
<div id="client"></div>
<script>
//寫入訊息時,以文字方式寫入即可
$("#client").append("<div></div>") //產生新的 div 作為容器
.find("div:last") //取得剛剛產生的 div
.text("<script>alert('hi')</script>"); //以文字方式寫入
</script>
weiclin iT邦高手 4 級 ‧ 2018-11-08 16:45:02 檢舉
樓上的方法不錯
好,那我在試驗一下,多謝了

1 個回答

1
淺水員
iT邦新手 5 級 ‧ 2018-11-10 02:13:54

下面是利用 textContent 與 innerHTML 的特性做成 html 特殊字元的轉換
至於函數名稱就沿用 https://www.npmjs.com/package/js-htmlencode

function htmlEncode(str)
{
    var tmp=document.createElement("div");
    tmp.textContent=str;
    return tmp.innerHTML;
}

function htmlDecode(str)
{
    var tmp=document.createElement("div");
    tmp.innerHTML=str;
    return tmp.textContent;
}

使用範例

var test_str="<script>alert('hi')</script>";

console.log(htmlEncode(test_str));
//輸出:&lt;script&gt;alert('hi')&lt;/script&gt;

console.log(htmlDecode(htmlEncode(test_str)));
//輸出:<script>alert('hi')</script>;

我要發表回答

立即登入回答