Utiliser la même socket dans tous les components
Bonjour,
J'ai de multiples connexions pour un même utilisateur alors que je devrais en avoir qu'une.
J'ai un serveur node js qui utilise les socket io :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27
| const express = require('express')
const app = express();
const path = require('path');
const http = require('http');
const server = http.Server(app);
const socketIO = require('socket.io');
const io = socketIO(server);
const port = process.env.PORT || 3000;
app.use(express.static(path.join('D:/Did/socketDid/dist/socketDid')));
app.get('/', function(req,res) {
res.sendFile('D:/Did/socketDid/src/index.html');
})
io.on('connection', (socket) => {
console.log('user connected');
socket.on('disconnect',() => {
console.log('user disconnected');
})
server.listen(port, () => {
console.log(`started on port: ${port}`);
}); |
J'ai créée un webSocketService dans mon projet angular :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29
| import { Injectable } from '@angular/core';
import { Observable, Subscriber } from 'rxjs';
import * as io from 'socket.io-client';
@Injectable({
providedIn: 'root'
})
export class WebSocketServiceService {
socket: any;
constructor() {
if(null == this.socket) {
this.socket = io();
}
}
listen(eventName: string) {
return new Observable((Subscriber) => {
this.socket.on(eventName, (data) => {
Subscriber.next(data);
})
});
}
emit(eventName: string, data: any) {
this.socket.emit(eventName,data);
}
} |
et je l'ai rajouté dans le app.module
Code:
providers: [WebSocketServiceService],
Dans chacun de mes components, je dois utiliser ce service pour utiliser la socket. Voici comment je déclare le service dans un component :
Code:
1 2 3 4 5 6 7 8 9 10 11
|
@Component({
selector: 'app-connection-login',
templateUrl: './connection-login.component.html',
styleUrls: ['./connection-login.component.css'],
providers: [WebSocketServiceService]
})
export class ConnectionLoginComponent implements OnInit {
constructor(private webSocketService: WebSocketServiceService, private router: Router) { }
..... |
Le problème est que pour chaque déclaration de ce service dans un component, j'ai une connexion supplémentaire... (je n'ai qu'une fenêtre d'ouverte) et je voudrais éviter ça.
Comment faire pour partager la même socket pour un client donné ?
https://zupimages.net/up/20/19/ruhf.jpg