en realidad estoy tratando de crear una aplicación de chat usando vueJS y socket.io, así que esto es lo que he hecho hasta ahora
<script> import {io} from "socket.io-client"; export default { data() { return { socketInstance: io("http://localhost:3001"), }; }, methods: { async handleSendMessage(message) { const postParams = { ip: this.userData.ip, message: message, user_type: "customer", }; const {data} = await axios.post( "http://localhost:3001/api/message", postParams ); this.messages.push(data.message); this.socketInstance.broadcast.emit("new_message", { message: data.message, socket_id: this.socketInstance.id, }); //HERE AM GETTING ERROR WHILE USING BROADCAST } }, mounted() { this.socketInstance.on("new_message", ({message, socket_id}) => { if (message.ip == this.userData.ip) { this.messages.push(message); } }); }, }; </script>Básicamente, la función handleSendMessage es responsable de enviar un mensaje y emitir un evento, pero cuando lo hago
this.socketInstance.emit("new_message", { message: data.message, socket_id: this.socketInstance.id, });entonces funciona bien, pero como saben, recibiré mensajes duplicados, así que usé
this.socketInstance.broadcast.emit("new_message", { message: data.message, socket_id: this.socketInstance.id, });y obtuve el siguiente error
Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'emit')No sé por qué estoy recibiendo este error. Perdón por mi mal ingles.
Está escrito en la documentación de socket.io de la siguiente manera:
Tenga en cuenta que la transmisión es una función exclusiva del servidor.
.broadcast solo se usa en el lado del servidor. Transmite algo a todos los clientes conectados, no de cliente a cliente .
Documentación relacionada