实时通信对接完成

src/utils/axiosConfig.js

@@ -4,8 +4,8 @@ import {getToken} from '@/token/auth' // 注意这里使用了解构赋值来导
 
 // 创建axios实例
 const service = axios.create({
-  // baseURL: 'http://47.122.59.26:8080/api', 
-  // baseURL: 'http://10.205.10.22:8081/loveforest/api/',
+  // 去vue.config.js文件改baseurl！！
+  baseURL: '/api',  // 注意！！ 这里全局统一加上了 '/api' 前缀，但是vue.config.js文件在发送请求时去掉了/api，所以页面的请求接口若有/api还是要携带/api
   timeout: 5000, // 请求超时时间
 });
 

src/views/chat/chat.vue

@@ -176,6 +176,7 @@ export default {
             this.showSearchList = this.friendsInfoList
 
             this.get_friendsInfoList()
+            this.long_poll_serve()
     },
     components:{
         HonneyBtn,
@@ -184,6 +185,42 @@ export default {
         ChatList
     },
     methods:{
+        async long_poll_serve(){
+            try{
+                const UserId = getUserId()
+                const token = 'Bearer '+getToken()
+                const response = await axios.get(`messages/poll/${UserId}`,{
+                    headers:{Authorization : token}
+                })
+                if(response.data == '')
+                {
+                    this.long_poll_serve()
+                }else{
+                    const senderId = response.data[response.data.length-1].senderId
+                    console.log(senderId)
+                    for(let i = 0;i<this.friendsInfoList.length;i++){
+                        if(this.friendsInfoList[i].id == senderId){
+                            if(this.chatWith != this.friendsInfoList[i].name){
+                                this.friendsInfoList[i].unreading_num += 1
+                                this.new_msg_nums += 1
+                            }
+                            let tempt_chat = {name:'',content:'',time:''}
+                            let response2 = await axios.get(`/messages/chat/${UserId}/${senderId}`,{
+                            headers:{Authorization : token}
+                            })
+                            tempt_chat.name = this.friendsInfoList[i].name
+                            tempt_chat.content = response2.data[response2.data.length-1].content
+                            tempt_chat.time = response2.data[response2.data.length-1].timestamp.replace('T',' ')
+                            this.friendsInfoList[i].chatHistory.push(tempt_chat)
+                            break
+                        }
+                    }
+                    this.long_poll_serve()
+                }
+            }catch(error){
+                alert('长轮询失败',error)
+            }
+        },
         async revise_honneyBtn_status(userId1,userId2,status){
             //向后端发送是出于好友状态还是黑名单状态
             try{

vue.config.js

@@ -5,36 +5,48 @@ module.exports = defineConfig({
     port: 8080,
     https: false,
     proxy:{
-      //登录接口
-      '/auth/login':{
-        target : 'https://911fb0525ms3.vicp.fun/loveforest/api',
-        changeOrigin : true,
+      '/api': {              //设置拦截器  拦截器格式   斜杠+拦截器名字，名字可以自己定
+          target: 'https://911fb0525ms3.vicp.fun/loveforest/api/',     //代理的目标地址
+          changeOrigin: true,              //是否设置同源，输入是的
+          pathRewrite: {                   //路径重写
+              '^/api': ''                     //选择忽略拦截器里面的内容
+          }
       },
-      //注册接口
-      '/auth/register':{
-        target : 'https://911fb0525ms3.vicp.fun/loveforest/api',
-        changeOrigin : true,
+      '/relationships': {              //设置拦截器  拦截器格式   斜杠+拦截器名字，名字可以自己定
+          target: 'https://911fb0525ms3.vicp.fun/loveforest/api/',     //代理的目标地址
+          changeOrigin: true,              //是否设置同源，输入是的
+          pathRewrite: {                   //路径重写
+              '^/api': ''                     //选择忽略拦截器里面的内容
+          }
       },
-      //获取好友列表接口
-      '/relationships':{
-        target : 'https://911fb0525ms3.vicp.fun/loveforest/api',
-        changeOrigin : true
+    '/messages/chat': {              //设置拦截器  拦截器格式   斜杠+拦截器名字，名字可以自己定
+        target: 'https://911fb0525ms3.vicp.fun/loveforest/api/',     //代理的目标地址
+        changeOrigin: true,              //是否设置同源，输入是的
+        pathRewrite: {                   //路径重写
+            '^/api': ''                     //选择忽略拦截器里面的内容
+        }
       },
-      //获取相应的聊天记录的接口
-      '/messages/chat':{
-        target : 'https://911fb0525ms3.vicp.fun/loveforest/api',
-        changeOrigin : true
+      '/messages/mark-as-read': {              //设置拦截器  拦截器格式   斜杠+拦截器名字，名字可以自己定
+        target: 'https://911fb0525ms3.vicp.fun/loveforest/api/',     //代理的目标地址
+        changeOrigin: true,              //是否设置同源，输入是的
+        pathRewrite: {                   //路径重写
+            '^/api': ''                     //选择忽略拦截器里面的内容
+        }
       },
-      //保存聊天的一条消息接口
-      '/messages/send':{
-        target : 'https://911fb0525ms3.vicp.fun/loveforest/api',
-        changeOrigin : true
+      '/messages/send': {              //设置拦截器  拦截器格式   斜杠+拦截器名字，名字可以自己定
+        target: 'https://911fb0525ms3.vicp.fun/loveforest/api/',     //代理的目标地址
+        changeOrigin: true,              //是否设置同源，输入是的
+        pathRewrite: {                   //路径重写
+            '^/api': ''                     //选择忽略拦截器里面的内容
+        }
+      },
+      'messages/poll': {              //设置拦截器  拦截器格式   斜杠+拦截器名字，名字可以自己定
+        target: 'https://911fb0525ms3.vicp.fun/loveforest/api/',     //代理的目标地址
+        changeOrigin: true,              //是否设置同源，输入是的
+        pathRewrite: {                   //路径重写
+            '^/api': ''                     //选择忽略拦截器里面的内容
+        }
       },
-      //新消息是否被已读的接口
-      '/messages/mark-as-read':{
-        target : 'https://911fb0525ms3.vicp.fun/loveforest/api',
-        changeOrigin : true
-      }
     }
   },
   transpileDependencies: true