From fbcbcfe276b12d912ab9857570860410bee943c1 Mon Sep 17 00:00:00 2001 From: Ognjen Cirkovic Date: Wed, 13 Apr 2022 00:58:06 +0200 Subject: Implementiran SignalR na backendu i frontend.Mogu da komuniciraju. --- .../notifications/notifications.component.ts | 4 +-- .../src/app/_services/signal-r.service.spec.ts | 16 +++++++++ frontend/src/app/_services/signal-r.service.ts | 30 +++++++++++++++++ .../src/app/_services/web-socket.service.spec.ts | 16 --------- frontend/src/app/_services/web-socket.service.ts | 39 ---------------------- frontend/src/app/app-routing.module.ts | 2 +- frontend/src/app/app.component.ts | 20 +++++++++-- frontend/src/app/app.module.ts | 2 +- 8 files changed, 68 insertions(+), 61 deletions(-) create mode 100644 frontend/src/app/_services/signal-r.service.spec.ts create mode 100644 frontend/src/app/_services/signal-r.service.ts delete mode 100644 frontend/src/app/_services/web-socket.service.spec.ts delete mode 100644 frontend/src/app/_services/web-socket.service.ts (limited to 'frontend/src/app') diff --git a/frontend/src/app/_elements/notifications/notifications.component.ts b/frontend/src/app/_elements/notifications/notifications.component.ts index 82613448..5863f669 100644 --- a/frontend/src/app/_elements/notifications/notifications.component.ts +++ b/frontend/src/app/_elements/notifications/notifications.component.ts @@ -1,5 +1,5 @@ import { Component, OnInit } from '@angular/core'; -import { WebSocketService } from 'src/app/_services/web-socket.service'; +import { SignalRService } from 'src/app/_services/signal-r.service'; import Notification from 'src/app/_data/Notification'; @Component({ @@ -12,7 +12,7 @@ export class NotificationsComponent implements OnInit { notifications?: Notification[]; closed: boolean = false; - constructor(private wsService: WebSocketService) { + constructor(private signalRService:SignalRService) { this.notifications = [ new Notification("Titanik (Preziveli)", "79768456867", 0.2), new Notification("Test Prediktor 1", "56758768678", 0.4), diff --git a/frontend/src/app/_services/signal-r.service.spec.ts b/frontend/src/app/_services/signal-r.service.spec.ts new file mode 100644 index 00000000..f737fa50 --- /dev/null +++ b/frontend/src/app/_services/signal-r.service.spec.ts @@ -0,0 +1,16 @@ +import { TestBed } from '@angular/core/testing'; + +import { SignalRService } from './signal-r.service'; + +describe('SignalRService', () => { + let service: SignalRService; + + beforeEach(() => { + TestBed.configureTestingModule({}); + service = TestBed.inject(SignalRService); + }); + + it('should be created', () => { + expect(service).toBeTruthy(); + }); +}); diff --git a/frontend/src/app/_services/signal-r.service.ts b/frontend/src/app/_services/signal-r.service.ts new file mode 100644 index 00000000..5eca48d3 --- /dev/null +++ b/frontend/src/app/_services/signal-r.service.ts @@ -0,0 +1,30 @@ +import { Injectable } from '@angular/core'; +import * as signalR from "@microsoft/signalr"; +import Shared from '../Shared'; +import { CookieService } from 'ngx-cookie-service'; +@Injectable({ + providedIn: 'root' +}) +export class SignalRService { +private hubConnection?:signalR.HubConnection; +public startConnection=()=>{ + + this.hubConnection= new signalR.HubConnectionBuilder() + .withUrl('http://localhost:5283/chatHub', { + accessTokenFactory: () => this.cookie.get("token"), + withCredentials: false + }).build(); + + this.hubConnection.on("Notify",(message:string) =>{ + console.log(" "+message); + }); + + + + this.hubConnection + .start() + .then(()=>console.log("con Started")) + .catch(err=>console.log("Error"+err)) +} + constructor(private cookie:CookieService) { } +} diff --git a/frontend/src/app/_services/web-socket.service.spec.ts b/frontend/src/app/_services/web-socket.service.spec.ts deleted file mode 100644 index a86aeca7..00000000 --- a/frontend/src/app/_services/web-socket.service.spec.ts +++ /dev/null @@ -1,16 +0,0 @@ -import { TestBed } from '@angular/core/testing'; - -import { WebSocketService } from './web-socket.service'; - -describe('WebSocketService', () => { - let service: WebSocketService; - - beforeEach(() => { - TestBed.configureTestingModule({}); - service = TestBed.inject(WebSocketService); - }); - - it('should be created', () => { - expect(service).toBeTruthy(); - }); -}); diff --git a/frontend/src/app/_services/web-socket.service.ts b/frontend/src/app/_services/web-socket.service.ts deleted file mode 100644 index 1a7efa87..00000000 --- a/frontend/src/app/_services/web-socket.service.ts +++ /dev/null @@ -1,39 +0,0 @@ -import { Injectable } from '@angular/core'; -import { ConstantBackoff, Websocket, WebsocketBuilder } from 'websocket-ts'; -import { API_SETTINGS } from 'src/config'; - -@Injectable({ - providedIn: 'root' -}) -export class WebSocketService { - - ws?: Websocket; - - private handlers: Function[] = []; - - constructor() { - this.ws = new WebsocketBuilder(API_SETTINGS.apiWSUrl) - .withBackoff(new ConstantBackoff(120000)) - .onOpen((i, e) => { /*console.log('WS: Connected to ' + API_SETTINGS.apiWSUrl)*/ }) - .onMessage((i, e) => { - console.log('WS MESSAGE: ', e.data); - this.handlers.forEach(handler => { - handler(e.data); - }) - }) - .onClose((i, e) => { /*console.log('WS: Connection closed!')*/ }) - .build(); - } - - send(msg: string) { - this.ws?.send(msg); - } - - addHandler(handler: Function) { - this.handlers.push(handler); - } - - removeHandler(handler: Function) { - this.handlers.splice(this.handlers.indexOf(handler), 1); - } -} diff --git a/frontend/src/app/app-routing.module.ts b/frontend/src/app/app-routing.module.ts index 54c29531..e22f7a88 100644 --- a/frontend/src/app/app-routing.module.ts +++ b/frontend/src/app/app-routing.module.ts @@ -27,7 +27,7 @@ const routes: Routes = [ { path: 'profile', component: ProfileComponent, canActivate: [AuthGuardService], data: { title: 'Profil' } }, { path: 'browse-datasets', component: FilterDatasetsComponent, data: { title: 'Javni izvori podataka' } }, { path: 'browse-predictors', component: BrowsePredictorsComponent, data: { title: 'Javni trenirani modeli' } }, - { path: 'predict/:id', component: PredictComponent, data: { title: 'Predvidi vrednosti' } } + { path: 'predict/:id', component: PredictComponent, data: { title: 'Predvidi vrednosti' } }, ]; @NgModule({ diff --git a/frontend/src/app/app.component.ts b/frontend/src/app/app.component.ts index 8c6f8452..59f247ed 100644 --- a/frontend/src/app/app.component.ts +++ b/frontend/src/app/app.component.ts @@ -3,7 +3,9 @@ import { Title } from '@angular/platform-browser'; import { Router, NavigationEnd, ActivatedRoute } from '@angular/router'; import { filter, map } from 'rxjs'; import { AuthService } from './_services/auth.service'; - +import { SignalRService } from './_services/signal-r.service'; +import { HttpClient } from '@angular/common/http'; +import Shared from './Shared'; @Component({ selector: 'app-root', templateUrl: './app.component.html', @@ -11,7 +13,7 @@ import { AuthService } from './_services/auth.service'; }) export class AppComponent implements OnInit { - constructor(private router: Router, private titleService: Title,private authService:AuthService) { } + constructor(private router: Router, private titleService: Title,private authService:AuthService,private signalRService:SignalRService,private http:HttpClient) { } ngOnInit() { this.router.events @@ -38,5 +40,19 @@ export class AppComponent implements OnInit { { this.authService.addGuestToken(); } + this.signalRService.startConnection(); + //this.startHttpRequest(); + + + + + } + private startHttpRequest = () => { + this.http.get('http://localhost:5283/chatHub') + .subscribe(res => { + console.log(res); + }) } + + } diff --git a/frontend/src/app/app.module.ts b/frontend/src/app/app.module.ts index 3909c680..1b91a1ac 100644 --- a/frontend/src/app/app.module.ts +++ b/frontend/src/app/app.module.ts @@ -79,7 +79,7 @@ import { TrainingComponent } from './training/training.component'; AlertDialogComponent, AddNewDatasetComponent, GraphComponent, - TrainingComponent + TrainingComponent, ], imports: [ BrowserModule, -- cgit v1.2.3