markdown文本显示

2025-03-25 21:20:25 +08:00
parent 49e8f6fe59
commit a665c4c100
9 changed files with 136 additions and 10 deletions
--- a/certs/localhost+5-key.pem
+++ b/certs/localhost+5-key.pem
@@ -0,0 +1,28 @@
+-----BEGIN PRIVATE KEY-----
+MIIEvQIBADANBgkqhkiG9w0BAQEFAASCBKcwggSjAgEAAoIBAQDENE4c0omaClrE
+9ATeew/OxE2ovlsJ5uwApK4Eh3h5iGCN5hye/FnYxG/38APuoR0h2o0RrUksS/7N
+nxtLJcG5GJ3lfyiAM1Stm8lP6PPiWC0VRXd7Hlnf327Y3kB4+C1VFyCrXd/vVtOG
+RgMSMpEH911dfvSeMWBQQ8Wf8VdWZSzjd8lZgcC9jEx3ckPJQK6fv2d4+PUw96A5
+axhTc5zZMbkd+yQC2jY44PTNkjSk6lQfHJQq7WYQPlw4y85RQnSfKhc4PS1s2BmA
+PBZF/JWpogFLM42wRMBfMoI0/K2F4hamCvrBpg3j2Ag50IGtvg9AGS/wNTlbNrNc
+Br4ay5/1AgMBAAECggEBAKx2qZ7ONePwbB8pu8nwdFG03eqRAKcwk4xxNQGILw7t
+IKo6djgN69ANw7o2AM7WUiw61ruODX7hgiUuUSh6FNHl4I0le+1MsYc1I/yY8R+p
+kF9dQ4w2fpu5486/df6fcAGWpcHcb4YLVT129yYcyr0s46XWfaE8F8QV/nX8B2BJ
+XWLi1c1pdw6x0l3v4F6ZSRidVmn8ViBDF/FHAAXIZ0ixtH3fSGsokN/CnpZUcy2L
+C1XqaH8eAtH8EI/44YY5ncsdnWZzWn6GBkMn3IilEhVlte3vgQKX1Qxb8vbdAf8j
+8McdCQvmzaQ/4ZQ+m3hQCZLWAeV40a+ElEETVtDO4dUCgYEA9Nn07u4UyQGm//m1
+IdPo5IdBHagn+rEVpp0iZ1DuNOD8z5LmgXYxWDHyhLvMpqoXRYYVxtjD6XQWAVUq
+r/8BbEGZMMPOuOV1Mq8mUMOwQhzxD5+AUXx1JYh9Eh6PxC1CpSoLMe0HdlhWlJM/
+kS4vZR12MWSuJ2MOWEv672Sg2LcCgYEAzSNOmUVZXjWucolYXsVmMGURmWVMEvy7
+tSnwJ3n2ZYQeXhYodTqCew9UA9aeZIXLEUKEqjdZh7O1+bNpOaoHh0n+RXOtVjDc
+eFO/pUVI/FqIpAvQv1QHq7T4e0l9jxpoj7q2XbTAv/ZG6/7WzIQuXsEAZJ6P52rg
+OAUDgtzEqLMCgYB6S/s49BXRqE+ffzvnn46txpjRlVIStyyXQdkTPasdIltj2n3j
+oANZh+kYPy0i+cYR5b0uyspf6qmrFLzzly1Awyse3k58r69wF2fN41BAVXBaW1Ke
+YMmqa5f82uL4G5s0H+Hjl/6oL8te/oU7oJPvr11/okgSSDm8BIdb1yk31QKBgECv
+04ctgSLeFqZzfPRVlwXHuSb/9F9AZwiXsu0f3nzgjprordVZn++iQ8H6GXRlZEWL
+Dj6Guaq7FrUoyBOw9DLLOG06Lvyw57Th49r/4CYDfncMasUKgGi65mgqInfPwg0g
+uYUPDID77h1Y/O7894pVngQcpBA7eXzwx8yqRTFVAoGAKmjDGfC0L3nKajTj3bGh
+gWOBC6vQ3S906sK68wQmj+9udApoFOJUdGKlCt8c3Ymm4sjDE658iJusc74Vsl7w
+Qybw2G3i+peZegXxH83i8+8Qg4LrgcTXVHN5L2JD/5jHxWMEoNjhDK/Th5DGIc2Y
+lvx/UwlqijUE6XHyl7etNwY=
+-----END PRIVATE KEY-----
--- a/certs/localhost+5.pem
+++ b/certs/localhost+5.pem
@@ -0,0 +1,25 @@
+-----BEGIN CERTIFICATE-----
+MIIEMjCCApqgAwIBAgIQH+x6HklUEOWO/bFtWxK3zDANBgkqhkiG9w0BAQsFADBb
+MR4wHAYDVQQKExVta2NlcnQgZGV2ZWxvcG1lbnQgQ0ExGDAWBgNVBAsMD3VidW50
+dUBzaWF0LW1pYzEfMB0GA1UEAwwWbWtjZXJ0IHVidW50dUBzaWF0LW1pYzAeFw0y
+NTAzMjMwOTE4MjBaFw0yNzA2MjMwOTE4MjBaMEMxJzAlBgNVBAoTHm1rY2VydCBk
+ZXZlbG9wbWVudCBjZXJ0aWZpY2F0ZTEYMBYGA1UECwwPdWJ1bnR1QHNpYXQtbWlj
+MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAxDROHNKJmgpaxPQE3nsP
+zsRNqL5bCebsAKSuBId4eYhgjeYcnvxZ2MRv9/AD7qEdIdqNEa1JLEv+zZ8bSyXB
+uRid5X8ogDNUrZvJT+jz4lgtFUV3ex5Z399u2N5AePgtVRcgq13f71bThkYDEjKR
+B/ddXX70njFgUEPFn/FXVmUs43fJWYHAvYxMd3JDyUCun79nePj1MPegOWsYU3Oc
+2TG5HfskAto2OOD0zZI0pOpUHxyUKu1mED5cOMvOUUJ0nyoXOD0tbNgZgDwWRfyV
+qaIBSzONsETAXzKCNPytheIWpgr6waYN49gIOdCBrb4PQBkv8DU5WzazXAa+Gsuf
+9QIDAQABo4GJMIGGMA4GA1UdDwEB/wQEAwIFoDATBgNVHSUEDDAKBggrBgEFBQcD
+ATAfBgNVHSMEGDAWgBQcyWg5ZO65GlNtgcNc0b6k6zaKrzA+BgNVHREENzA1ggls
+b2NhbGhvc3SHBH8AAAGHEAAAAAAAAAAAAAAAAAAAAAGHBKwUZ6uHBMCoqAOHBMCo
+qAQwDQYJKoZIhvcNAQELBQADggGBAH0UMevAJTOostyuEYpwwwNqQAo55RTvF04W
+M2WhxKRJTHkvslypqnYgK4OvzXueAMgvOy16acE1IgFe2Ww9u9VRaeR6bpicQWAv
+r3ZLxGDmg0ZEV1cN2MSmBhhg2164qwOAXtch87oaFBYo8Cvz37BKvqV21avrRJWq
+MLiQjuVX5ju4/L291ir0T9yUQAwVDDG8aUvJRjZzjQsXl1fccVAeimZ7xwdIDntx
+1ubXSuBxVGhhYJCUbHVwHG6Sg8lkmdZq8Y0bKS5W1GDloMSTvS9xy13/MAxLKvPu
+lpszrUwAWi74Wenj2NpZGkcGLnNoiMqAUJSgqHktjpRGRHVMoTtTVon0gqIRbDM8
+B/R0dINnyix3XYBVKi4r1OE5qfvd3D6I2s9BAI8RYVj7B5X+widdWMfQGOZmNNjF
+H6OwEOzyJh5HFN1LOuys1ngKWAOSyYUWrSqUosF8KbeQVJc54Yry4CWkquwlqOaO
+nlk2cTAY5meTWdZ/PstYV0XLnvZdzg==
+-----END CERTIFICATE-----
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,6 +12,7 @@
        "agora-rtc-sdk-ng": "^4.23.2",
        "axios": "^1.8.3",
        "element-plus": "^2.9.6",
+        "markdown-it": "^14.1.0",
        "openai": "^4.87.3",
        "pinia": "^3.0.1",
        "vue": "^3.5.13",
@@ -1222,6 +1223,12 @@
      "integrity": "sha512-0ovZz1lbe30QraG1cU+ji7EnQ8aUu+Hf3F+a8xPml3wPOyUQEK6CTdxV9kMecr9t+fIDrGeW7wgJTsM1DQE7Nw==",
      "license": "ISC"
    },
+    "node_modules/argparse": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
+      "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==",
+      "license": "Python-2.0"
+    },
    "node_modules/async-validator": {
      "version": "4.2.5",
      "resolved": "https://registry.npmjs.org/async-validator/-/async-validator-4.2.5.tgz",
@@ -1711,6 +1718,15 @@
        "url": "https://github.com/sponsors/mesqueeb"
      }
    },
+    "node_modules/linkify-it": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/linkify-it/-/linkify-it-5.0.0.tgz",
+      "integrity": "sha512-5aHCbzQRADcdP+ATqnDuhhJ/MRIqDkZX5pyjFHRRysS8vZ5AbqGEoFIb6pYHPZ+L/OC2Lc+xT8uHVVR5CAK/wQ==",
+      "license": "MIT",
+      "dependencies": {
+        "uc.micro": "^2.0.0"
+      }
+    },
    "node_modules/lodash": {
      "version": "4.17.21",
      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
@@ -1743,6 +1759,23 @@
        "@jridgewell/sourcemap-codec": "^1.5.0"
      }
    },
+    "node_modules/markdown-it": {
+      "version": "14.1.0",
+      "resolved": "https://registry.npmjs.org/markdown-it/-/markdown-it-14.1.0.tgz",
+      "integrity": "sha512-a54IwgWPaeBCAAsv13YgmALOF1elABB08FxO9i+r4VFk5Vl4pKokRPeX8u5TCgSsPi6ec1otfLjdOpVcgbpshg==",
+      "license": "MIT",
+      "dependencies": {
+        "argparse": "^2.0.1",
+        "entities": "^4.4.0",
+        "linkify-it": "^5.0.0",
+        "mdurl": "^2.0.0",
+        "punycode.js": "^2.3.1",
+        "uc.micro": "^2.1.0"
+      },
+      "bin": {
+        "markdown-it": "bin/markdown-it.mjs"
+      }
+    },
    "node_modules/math-intrinsics": {
      "version": "1.1.0",
      "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",
@@ -1752,6 +1785,12 @@
        "node": ">= 0.4"
      }
    },
+    "node_modules/mdurl": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/mdurl/-/mdurl-2.0.0.tgz",
+      "integrity": "sha512-Lf+9+2r+Tdp5wXDXC4PcIBjTDtq4UKjCPMQhKIuzpJNW0b96kVqSwW0bT7FhRSfmAiFYgP+SCRvdrDozfh0U5w==",
+      "license": "MIT"
+    },
    "node_modules/memoize-one": {
      "version": "6.0.0",
      "resolved": "https://registry.npmjs.org/memoize-one/-/memoize-one-6.0.0.tgz",
@@ -1966,6 +2005,15 @@
      "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==",
      "license": "MIT"
    },
+    "node_modules/punycode.js": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/punycode.js/-/punycode.js-2.3.1.tgz",
+      "integrity": "sha512-uxFIHU0YlHYhDQtV4R9J6a52SLx28BCjT+4ieh7IGbgwVJWO+km431c4yRlREUAsAmt/uMjQUyQHNEPf0M39CA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
    "node_modules/rfdc": {
      "version": "1.4.1",
      "resolved": "https://registry.npmjs.org/rfdc/-/rfdc-1.4.1.tgz",
@@ -2079,6 +2127,12 @@
        "node": "*"
      }
    },
+    "node_modules/uc.micro": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-2.1.0.tgz",
+      "integrity": "sha512-ARDJmphmdvUk6Glw7y9DQ2bFkKBHwQHLi2lsaH6PPmz/Ka9sFOBsBluozhDltWmnv9u/cF6Rt87znRTPV+yp/A==",
+      "license": "MIT"
+    },
    "node_modules/undici-types": {
      "version": "5.26.5",
      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz",
--- a/package.json
+++ b/package.json
@@ -4,7 +4,7 @@
  "version": "0.0.0",
  "type": "module",
  "scripts": {
-    "dev": "vite --port 3000",
+    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview"
  },
@@ -13,6 +13,7 @@
    "agora-rtc-sdk-ng": "^4.23.2",
    "axios": "^1.8.3",
    "element-plus": "^2.9.6",
+    "markdown-it": "^14.1.0",
    "openai": "^4.87.3",
    "pinia": "^3.0.1",
    "vue": "^3.5.13",
--- a/src/components/chat/ChatMessage.vue
+++ b/src/components/chat/ChatMessage.vue
@@ -1,15 +1,18 @@
 <template>
  <div class="chat-message" :class="{ 'user-message': isUser, 'ai-message': !isUser }">
    <div class="message-content">
-      <div class="message-text">{{ message.content }}</div>
+      <div class="message-text" v-html="parsedContent"></div>
      <div class="message-time">{{ formattedTime }}</div>
    </div>
  </div>
 </template>

 <script>
+import MarkdownIt from 'markdown-it';
 import { computed } from 'vue';

+const md = new MarkdownIt();
+
 export default {
  name: 'ChatMessage',
  
@@ -32,10 +35,18 @@ export default {
      const date = new Date(props.message.timestamp);
      return date.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
    });
-    
+
+    const parsedContent = computed(() => {
+      if (props.message.sender === 'user') {
+        return props.message.content;
+      }
+      return md.render(props.message.content);
+    });
+
    return {
      isUser,
-      formattedTime
+      formattedTime,
+      parsedContent
    };
  }
 };
--- a/src/services/agora.js
+++ b/src/services/agora.js
@@ -10,8 +10,8 @@ class AgoraService {
    this.volumeIndicator = null;
    // 加入同一RTC频道
    this.appid = '01a1debc964a4c6a8df1de2a6ce7aa4d';
-    this.token = '007eJxTYDC9tPXind6STazfWV8ybkn1Sf8y+aTB8UeBYe+ZpmyoePlYgcHAMNEwJTUp2dLMJNEk2SzRIiUNyDdKNEtONU9MNEk5N/9eekMgI4OTki4rIwMEgvgiDMn5eWWJmUCyOD8nNd7QxMLMyJKBAQCzZyhC';
-    this.channel = 'convaiconsole_148629';
+    this.token = '007eJxTYPA68Gbmv42hM7z3+veJM6q3Nu/SOzQ9RtfhWmU8d3SNf6YCg4FhomFKalKypZlJokmyWaJFShqQb5RolpxqnphokvJh2aP0hkBGhsuKzayMDBAI4oswJOfnlSVmAsni/JzUeEMzQ0MjSwYGAKjIJdg=';
+    this.channel = 'convaiconsole_161129';

    this.isListening = false;     // 是否正在监听
    this.isSpeaking = false;      // 用户是否正在说话
--- a/src/services/api.js
+++ b/src/services/api.js
@@ -24,10 +24,10 @@ class ApiService {
      const response = await this.client.post(
        `${this.baseUrl}/projects/${this.projectId}/join/`,
        {
-          "name": "convaiconsole_148629",
+          "name": "convaiconsole_161129",
          "properties": {
-            "channel": "convaiconsole_148629",
-            "agent_rtc_uid": "66542",
+            "channel": "convaiconsole_161129",
+            "agent_rtc_uid": "39027",
            "remote_rtc_uids": [
              "*"
            ],
@@ -82,7 +82,7 @@ class ApiService {
              "enable_metrics": true,
              "audio_scenario": "default"
            },
-            "token": "007eJxTYDC9tPXind6STazfWV8ybkn1Sf8y+aTB8UeBYe+ZpmyoePlYgcHAMNEwJTUp2dLMJNEk2SzRIiUNyDdKNEtONU9MNEk5N/9eekMgI4OTki4rIwMEgvgiDMn5eWWJmUCyOD8nNd7QxMLMyJKBAQCzZyhC",
+            "token": "007eJxTYPA68Gbmv42hM7z3+veJM6q3Nu/SOzQ9RtfhWmU8d3SNf6YCg4FhomFKalKypZlJokmyWaJFShqQb5RolpxqnphokvJh2aP0hkBGhsuKzayMDBAI4oswJOfnlSVmAsni/JzUeEMzQ0MjSwYGAKjIJdg=",
            "advanced_features": {
              "enable_aivad": false
            }
--- a/src/stores/chat.js
+++ b/src/stores/chat.js
@@ -1,6 +1,8 @@
 import { defineStore } from 'pinia';
 import apiService from '../services/api.js';
 import agoraService from '../services/agora.js';
+import { marked } from 'marked';
+

 export const useChatStore = defineStore('chat', {
  state: () => ({
--- a/vite.config.js
+++ b/vite.config.js
@@ -1,6 +1,7 @@
 import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
 import path from 'path'
+import fs from 'fs'

 // https://vite.dev/config/
 export default defineConfig({
@@ -11,6 +12,10 @@ export default defineConfig({
    },
  },
  server: {
+    // https:{
+    //   key: fs.readFileSync(path.resolve(__dirname, './certs/localhost+5-key.pem')),
+    //   cert: fs.readFileSync(path.resolve(__dirname, './certs/localhost+5.pem')),
+    // },
    host: '0.0.0.0',
    port: 3000,
    open: false,