diff --git a/im-uniapp/common/emotion.js b/im-uniapp/common/emotion.js index 7e301e0..cdacb8a 100644 --- a/im-uniapp/common/emotion.js +++ b/im-uniapp/common/emotion.js @@ -26,7 +26,11 @@ let transform = (content, extClass) => { let textToPath = (emoText) => { let word = emoText.replace(/\#|\;/gi, ''); let idx = emoTextList.indexOf(word); - return `/static/emoji/${idx}.gif`; + let baseUrl = "/" + // #ifdef H5 + baseUrl = window.location.pathname; + // #endif + return `${baseUrl}static/emoji/${idx}.gif`; } diff --git a/im-uniapp/common/url.js b/im-uniapp/common/url.js new file mode 100644 index 0000000..db2fb61 --- /dev/null +++ b/im-uniapp/common/url.js @@ -0,0 +1,15 @@ +let replaceURLWithHTMLLinks = (content, color) => { + // 使用正则表达式匹配更广泛的URL格式 + const urlRegex = /(?:https?:\/\/[^\s]+|www\.[^\s]+)/g; + return content.replace(urlRegex, (url) => { + // 如果URL不以http(s)://开头,则添加http://前缀 + if (!url.startsWith("http")) { + url = "http://" + url; + } + return `${url}`; + }); +} + +export default { + replaceURLWithHTMLLinks +} \ No newline at end of file diff --git a/im-uniapp/components/chat-message-item/chat-message-item.vue b/im-uniapp/components/chat-message-item/chat-message-item.vue index 1b4a3dc..48632f4 100644 --- a/im-uniapp/components/chat-message-item/chat-message-item.vue +++ b/im-uniapp/components/chat-message-item/chat-message-item.vue @@ -17,7 +17,8 @@ - + + @@ -47,7 +48,8 @@ - + {{ JSON.parse(msgInfo.content).duration + '"' }} @@ -162,10 +164,10 @@ export default { onShowReadedBox() { this.$refs.chatGroupReaded.open(); }, - emit(){ - this.$emit("audioStateChange",this.audioPlayState,this.msgInfo); + emit() { + this.$emit("audioStateChange", this.audioPlayState, this.msgInfo); }, - stopPlayAudio(){ + stopPlayAudio() { if (this.innerAudioContext) { this.innerAudioContext.stop(); this.innerAudioContext = null; @@ -230,6 +232,11 @@ export default { isNormal() { const type = this.msgInfo.type; return this.$msgType.isNormal(type) || this.$msgType.isAction(type) + }, + nodesText() { + let color = this.msgInfo.selfSend ? 'white' : ''; + let text = this.$url.replaceURLWithHTMLLinks(this.msgInfo.content, color) + return this.$emo.transform(text, 'emoji-normal') } } diff --git a/im-uniapp/im.scss b/im-uniapp/im.scss index f6d4dd6..4059c19 100644 --- a/im-uniapp/im.scss +++ b/im-uniapp/im.scss @@ -174,19 +174,19 @@ button[size='mini'] { } .emoji-large { - width: 64rpx; - height: 64rpx; - vertical-align: bottom; + width: 64rpx !important; + height: 64rpx !important; + vertical-align: bottom !important; } .emoji-normal { - width: 54rpx; - height: 54rpx; - vertical-align: bottom; + width: 54rpx !important; + height: 54rpx !important; + vertical-align: bottom !important; } .emoji-small { - width: 36rpx; - height: 36rpx; - vertical-align: bottom; + width: 36rpx !important; + height: 36rpx !important; + vertical-align: bottom !important; } \ No newline at end of file diff --git a/im-uniapp/main.js b/im-uniapp/main.js index be8e65b..608d78e 100644 --- a/im-uniapp/main.js +++ b/im-uniapp/main.js @@ -1,6 +1,7 @@ import App from './App' import request from './common/request'; import emotion from './common/emotion.js'; +import url from './common/url.js'; import * as enums from './common/enums.js'; import * as date from './common/date'; import * as socketApi from './common/wssocket'; @@ -39,6 +40,7 @@ export function createApp() { app.config.globalProperties.$wsApi = socketApi; app.config.globalProperties.$msgType = messageType; app.config.globalProperties.$emo = emotion; + app.config.globalProperties.$url = url; app.config.globalProperties.$enums = enums; app.config.globalProperties.$date = date; app.config.globalProperties.$rc = recorder; diff --git a/im-web/src/api/url.js b/im-web/src/api/url.js new file mode 100644 index 0000000..db2fb61 --- /dev/null +++ b/im-web/src/api/url.js @@ -0,0 +1,15 @@ +let replaceURLWithHTMLLinks = (content, color) => { + // 使用正则表达式匹配更广泛的URL格式 + const urlRegex = /(?:https?:\/\/[^\s]+|www\.[^\s]+)/g; + return content.replace(urlRegex, (url) => { + // 如果URL不以http(s)://开头,则添加http://前缀 + if (!url.startsWith("http")) { + url = "http://" + url; + } + return `${url}`; + }); +} + +export default { + replaceURLWithHTMLLinks +} \ No newline at end of file diff --git a/im-web/src/components/chat/ChatMessageItem.vue b/im-web/src/components/chat/ChatMessageItem.vue index 8ec04e9..f2a7582 100644 --- a/im-web/src/components/chat/ChatMessageItem.vue +++ b/im-web/src/components/chat/ChatMessageItem.vue @@ -22,7 +22,7 @@
+ v-html="htmlText">
@@ -51,10 +51,10 @@
- - + + {{ msgInfo.content }}
@@ -203,6 +203,11 @@ export default { isNormal() { const type = this.msgInfo.type; return this.$msgType.isNormal(type) || this.$msgType.isAction(type) + }, + htmlText() { + let color = this.msgInfo.selfSend ? 'white' : ''; + let text = this.$url.replaceURLWithHTMLLinks(this.msgInfo.content, color) + return this.$emo.transform(text) } } } @@ -472,4 +477,4 @@ export default { } } - + \ No newline at end of file diff --git a/im-web/src/main.js b/im-web/src/main.js index 3039ea5..a2ed843 100644 --- a/im-web/src/main.js +++ b/im-web/src/main.js @@ -9,6 +9,7 @@ import httpRequest from './api/httpRequest'; import * as socketApi from './api/wssocket'; import * as messageType from './api/messageType'; import emotion from './api/emotion.js'; +import url from './api/url.js'; import element from './api/element.js'; import store from './store'; import * as enums from './api/enums.js'; @@ -22,6 +23,7 @@ Vue.prototype.$msgType = messageType Vue.prototype.$date = date; Vue.prototype.$http = httpRequest // http请求方法 Vue.prototype.$emo = emotion; // emo表情 +Vue.prototype.$url = url; // url转换 Vue.prototype.$elm = element; // 元素操作 Vue.prototype.$enums = enums; // 枚举 Vue.prototype.$eventBus = new Vue(); // 全局事件