rodgc / ngx-socket-io

Socket.IO module for Angular
MIT License
261 stars 89 forks source link

fromEvent not getting any message #122

Closed liamsanchez closed 4 months ago

liamsanchez commented 2 years ago

Hello, I am using this example for my backend Python flask server: https://github.com/josharnoldjosh/simple-flask-socketio-example/blob/master/run.py,

I am using Angular Cli as my front end, I can send messages from my front-end via Websockets and the backend server received and correctly interprets the message. However, I cannot seem to send messages from my backend server and have them be received from my Angular client, as when I console.log the data returned from the backend, it returns an empty observable. The code for my webservice, appmodule, and backend are below:

Webservice

import { HttpClient } from '@angular/common/http'; import { Injectable } from '@angular/core'; import { Observable } from 'rxjs'; import { Socket } from 'ngx-socket-io'; import { map } from 'rxjs/operators';

@Injectable({providedIn: 'root'}) export class WebService {

constructor(public http: HttpClient, private socket: Socket) {}

data: any;

sendMessage(msg: string) { this.socket.emit('message', msg); }

getMessage() {
  this.data = this.socket.fromEvent("message_from_server").pipe(map( data => data ));
  console.log("Receives message: ", this.data)
  return this.data
}

getCurrentTemperature() {

return this.http.get('http://127.0.0.1:5000/api/v1.0/currentTemperature')

}

getHistoricTemperaturValues(pNum: number, pSize: number) {

return this.http.get('http://127.0.0.1:5000/api/v1.0/prevTempData?pn=' + pNum + '&ps=' + pSize) }

getTemperatureChartData() { return this.http.get('http://127.0.0.1:5000/api/v1.0/chartTemperatureData') }

getCurrentTelemetryData() {

return this.http.get('http://127.0.0.1:5000/api/v1.0/currentTelemetryValues') }

getCurrentTelemetryStrings() {

return this.http.get('http://127.0.0.1:5000/api/v1.0/charttemp') }

}

App Module

import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { temperatureComponent } from './temperature.component'; import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; import { WebService } from './web.service'; import { HttpClientModule } from '@angular/common/http'; import { RouterModule } from '@angular/router'; import { navigationComponent } from './navigation.component'; import { AuthModule } from '@auth0/auth0-angular'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { MatPaginatorModule } from '@angular/material/paginator'; import { NgxGaugeModule } from 'ngx-gauge'; import { FlexLayoutModule } from '@angular/flex-layout'; import { SocketIoModule, SocketIoConfig } from 'ngx-socket-io';

const config: SocketIoConfig = { url: 'http://localhost:5000', options: {} };

var routes: any = [ { path: '', component: temperatureComponent },

];

@NgModule({ declarations: [ AppComponent, temperatureComponent, navigationComponent,

],

imports: [ BrowserModule, AppRoutingModule, HttpClientModule, MatPaginatorModule, RouterModule.forRoot(routes), AuthModule.forRoot( { domain:'dev-6y0wwm-n.us.auth0.com', clientId:'eL6gz5I8clAvEJqamidTlJGWygl7v1eg' }), BrowserAnimationsModule, NgxGaugeModule, FlexLayoutModule, SocketIoModule.forRoot(config)

], providers: [WebService], bootstrap: [AppComponent] }) export class AppModule { }

Python Flask backend

` from flask import from flask_socketio import from flask_cors import CORS import eventlet import gevent

async_mode = 'eventlet'

app = Flask(name) CORS(app) app.config['SECRET_KEY'] = 'some super secret key!' socketio = SocketIO(app, cors_allowed_origins='*', logger=True, async_mode=async_mode)

@app.route('/') def root():
return "Hello world!"

@app.route('/random') def random():
from random import randint
html = str(randint(1, 100)) return html

@app.route('/user/') def user_id(id): return str(id)

@app.route('/html/') def html(username): return render_template('index.html', username=username)

@socketio.on('message_from_server')
def message_recieved(data): print(data['text']) emit('message_from_server', {'text':'Message recieved!'})

if name == 'main': """ Run the app. """
socketio.run(app, port=5000, debug=True) `

github-actions[bot] commented 4 months ago

This issue is stale because it has been open for 30 days with no activity.

github-actions[bot] commented 4 months ago

This issue was closed because it has been inactive for 7 days since being marked as stale.