diff --git a/app/appearance/langs/en_US.json b/app/appearance/langs/en_US.json
index 84cdeb44a..936d6db16 100644
--- a/app/appearance/langs/en_US.json
+++ b/app/appearance/langs/en_US.json
@@ -1,4 +1,5 @@
 {
+  "clearMessage": "Clear all messages",
   "freeSub": "Free Trial Subscription",
   "sortByUpdateTimeDesc": "Descending by update time",
   "sortByUpdateTimeAsc": "Ascending by update time",
diff --git a/app/appearance/langs/fr_FR.json b/app/appearance/langs/fr_FR.json
index 211b50543..7262178c8 100644
--- a/app/appearance/langs/fr_FR.json
+++ b/app/appearance/langs/fr_FR.json
@@ -1,4 +1,5 @@
 {
+  "clearMessage": "Effacer tous les messages",
   "freeSub": "Abonnement d'essai gratuit",
   "sortByUpdateTimeDesc": "Descendant par heure de mise à jour",
   "sortByUpdateTimeAsc": "Croissant par heure de mise à jour",
diff --git a/app/appearance/langs/zh_CHT.json b/app/appearance/langs/zh_CHT.json
index 9f97b0db6..16000f442 100644
--- a/app/appearance/langs/zh_CHT.json
+++ b/app/appearance/langs/zh_CHT.json
@@ -1,4 +1,5 @@
 {
+  "clearMessage": "清空所有消息",
   "freeSub": "免費試用訂閱",
   "sortByUpdateTimeDesc": "更新時間降序",
   "sortByUpdateTimeAsc": "更新時間升序",
diff --git a/app/appearance/langs/zh_CN.json b/app/appearance/langs/zh_CN.json
index 238909147..0133b69f1 100644
--- a/app/appearance/langs/zh_CN.json
+++ b/app/appearance/langs/zh_CN.json
@@ -1,4 +1,5 @@
 {
+  "clearMessage": "清空所有消息",
   "freeSub": "免费试用订阅",
   "sortByUpdateTimeDesc": "更新时间降序",
   "sortByUpdateTimeAsc": "更新时间升序",
diff --git a/app/src/dialog/message.ts b/app/src/dialog/message.ts
index 93fc538b2..0f5ccfc1c 100644
--- a/app/src/dialog/message.ts
+++ b/app/src/dialog/message.ts
@@ -4,8 +4,8 @@ export const initMessage = () => {
     const messageElement = document.getElementById("message");
     messageElement.innerHTML = `<div class="fn__flex-1"></div>
 <div class="fn__hr fn__flex-shrink"></div>
-<button class="fn__flex-center b3-button b3-button--cancel">
-    ${window.siyuan.languages.close}
+<button class="fn__flex-center b3-button b3-button--outline">
+    <svg><use xlink:href="#iconTrashcan"></use></svg> ${window.siyuan.languages.clearMessage}
 </button>`;
     messageElement.addEventListener("click", (event) => {
         let target = event.target as HTMLElement;
@@ -16,7 +16,7 @@ export const initMessage = () => {
                 break;
             } else if (target.isSameNode(messageElement.lastElementChild)) {
                 target.parentElement.classList.add("fn__none");
-                target.parentElement.innerHTML = "";
+                target.parentElement.firstElementChild.innerHTML = "";
                 event.preventDefault();
                 break;
             }
@@ -25,8 +25,8 @@ export const initMessage = () => {
     });
 };
 
-export const showMessage = (message: string, timeout = 6000, type = "info") => {
-    const id = genUUID();
+export const showMessage = (message: string, timeout = 6000, type = "info", messageId?: string) => {
+    const id = messageId || genUUID();
     let messageHTML = `<div data-id="${id}" class="b3-snackbar${type === "error" ? " b3-snackbar--error" : ""}"><div class="b3-snackbar__content">${message}</div>`;
     if (timeout === 0) {
         messageHTML += '<svg class="b3-snackbar__close"><use xlink:href="#iconClose"></use></svg>';
@@ -40,6 +40,10 @@ export const showMessage = (message: string, timeout = 6000, type = "info") => {
         messagesElement.parentElement.classList.remove("fn__none");
     }
     messagesElement.insertAdjacentHTML("afterbegin", messageHTML + "</div>");
+    if (messagesElement.firstElementChild.nextElementSibling &&
+        messagesElement.firstElementChild.nextElementSibling.innerHTML === messagesElement.firstElementChild.innerHTML) {
+        messagesElement.firstElementChild.nextElementSibling.remove();
+    }
     messagesElement.scrollTop = 0;
     return id;
 };
diff --git a/app/src/util/processMessage.ts b/app/src/util/processMessage.ts
index d34115ef9..279ad2c6d 100644
--- a/app/src/util/processMessage.ts
+++ b/app/src/util/processMessage.ts
@@ -1,13 +1,17 @@
-import {showMessage} from "../dialog/message";
+import {hideMessage, showMessage} from "../dialog/message";
 import {exportLayout} from "../layout/util";
 import {isMobile} from "./functions";
 
 export const processMessage = (response: IWebSocketData) => {
     if ("msg" === response.cmd) {
-        showMessage(response.msg, response.data.closeTimeout, response.code === 0 ? "info" : "error");
+        showMessage(response.msg, response.data.closeTimeout, response.code === 0 ? "info" : "error", response.data.id);
         return false;
     }
     if ("cmsg" === response.cmd) {
+        hideMessage(response.data.id);
+        return false;
+    }
+    if ("cprogress" === response.cmd) {
         const progressElement = document.getElementById("progress");
         if (progressElement) {
             progressElement.remove();