Hello,
Is there a way to implement this chat window and create communication between two user on different machine(remote location).I can communicate it only when second user gives permission and the user can be on any machine.

Hello. I have created an application from your example and the express server keeps crashing and restarting when a socket.on event happens. This may be a false alarm and a bug in my application, but if anyone could help me decipher the error message, that would be great.
~/.pm2/pm2.log

2020-05-12T14:58:22: PM2 error: TypeError [ERR_INVALID_ARG_TYPE]: The "data" argument must be of type string or an instance of Buffer, TypedArray, or DataView. Received type number (7679)
    at Object.writeFileSync (fs.js:1380:5)
    at /usr/lib/node_modules/pm2/lib/God/ForkMode.js:264:12
    at wrapper (/usr/lib/node_modules/pm2/node_modules/async/internal/once.js:12:16)
    at next (/usr/lib/node_modules/pm2/node_modules/async/waterfall.js:96:20)
    at /usr/lib/node_modules/pm2/node_modules/async/internal/onlyOnce.js:12:16
    at WriteStream.<anonymous> (/usr/lib/node_modules/pm2/lib/Utility.js:186:13)
    at WriteStream.emit (events.js:315:20)
    at WriteStream.EventEmitter.emit (domain.js:547:15)
    at internal/fs/streams.js:395:12
    at FSReqCallback.oncomplete (fs.js:163:23)

My "chat-server.ts" : https://github.com/xinthose/angular_cpp_websocket/blob/master/server/src/portalogic-server.ts
Target: es2019
OS: Ubuntu 18.04 LTS

This may be a bug with express or socket-io with node v14? I do not have problems with node v13.

It seems socket.io-client is only available in the client project because karma defines it as a dependency. This will not allow to explicit define the socket.io-client version to be used.
Additionally, the server defines the socket.io dependency as socket.io": "~2.0.3. [email protected] is using [email protected], which already is a major version mismatch.

Maybe the client should use the socket.io-client the server is serving, or at least use socket.io as a defined dependency in the clients package.json

Hi sir, i want to trying make an chatting application inside on my existing application.
i just want to ask to you what the code inside index.js ?? from your Procfile

web: node server/dist/index.js

thank you.

When trying to build the client side, one gets a lot of errors, regarding the importing of material modules.
Currently, they're for example referenced by

import {MdButtonModule} from '@angular/material'

When following the build instructions, one gets errors like this, when trying to 'ng serve':

ERROR in Error: MdButtonModule is not an NgModule
    at _getNgModuleMetadata (/home/cx/workspace/es/socket-io-typescript-chat/client/node_modules/@angular/compiler-cli/src/ngtools_impl.js:140:15)
    at _extractLazyRoutesFromStaticModule (/home/cx/workspace/es/socket-io-typescript-chat/client/node_modules/@angular/compiler-cli/src/ngtools_impl.js:109:26)
    at /home/cx/workspace/es/socket-io-typescript-chat/client/node_modules/@angular/compiler-cli/src/ngtools_impl.js:129:27
    at Array.reduce (<anonymous>)
    at _extractLazyRoutesFromStaticModule (/home/cx/workspace/es/socket-io-typescript-chat/client/node_modules/@angular/compiler-cli/src/ngtools_impl.js:128:10)
    at Object.listLazyRoutesOfModule (/home/cx/workspace/es/socket-io-typescript-chat/client/node_modules/@angular/compiler-cli/src/ngtools_impl.js:53:22)
    at Function.NgTools_InternalApi_NG_2.listLazyRoutes (/home/cx/workspace/es/socket-io-typescript-chat/client/node_modules/@angular/compiler-cli/src/ngtools_api.js:91:39)
    at AotPlugin._getLazyRoutesFromNgtools (/home/cx/workspace/es/socket-io-typescript-chat/client/node_modules/@ngtools/webpack/src/plugin.js:241:66)
    at _donePromise.Promise.resolve.then.then.then.then.then (/home/cx/workspace/es/socket-io-typescript-chat/client/node_modules/@ngtools/webpack/src/plugin.js:495:24)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:188:7)
ERROR in /home/cx/workspace/es/socket-io-typescript-chat/client/src/app/dialog-user/dialog-user.component.ts (2,23): Module '"/home/cx/workspace/es/socket-io-typescript-chat/client/node_modules/@angular/material/material"' has no exported member 'MD_DIALOG_DATA'.

I want to connect with rabbitMQ. I have wcf service which will push the data to rabbitMQ, So my angular application should subscribe that data.

When I deploy my website to heroku app everytime it is connecting to new port

In the client code, we are adding static port
const SERVER_URL = 'http://localhost:8080';

public initSocket(): void {
this.socket = socketIo(SERVER_URL);
}
Therefore, after deploying the website on heroku, socket is not working.

Could you please tell me how you made it possible on heroku deployment.
Is it due to I am using free service of heroku (may be). I dont know the reason.

Thanking you in advance.

1st one is Firefox 55.0.3 (64-bit) Win 10 Pro 15063.540

2nd one is Vivaldi 1.11.917.43 (32-bit) same Windows system

No current clean method of getting the embedded conversation in a screenshot. HTH.

@luixaviles when you're working on the server, have you setup a watch script?

I went through the gulpfile and I don't see the ability to make changes, save, and have the server update.

I did some digging and found this stackoverflow thread - as the author describes, it's not perfect but it works.

So I've installed 'ts-node' and updated your gulpfile to work with this project - and it works which is most of the battle - just want to get your feedback if you have a less hacky solution?

var gulp = require('gulp'),
  nodemon = require('gulp-nodemon'),
  livereload = require('gulp-livereload'),
  ts = require('gulp-typescript');

var tsProject = ts.createProject('tsconfig.json');

gulp.task('typescript', function() {
  console.log('Compiling TypeScript');

  return tsProject
    .src()
    .pipe(tsProject())
    .js.pipe(gulp.dest('./dist'));
});

gulp.task('serve', ['typescript'], function() {
  gulp.watch('./**/*.ts', ['typescript']);

  livereload.listen();
  // make sure you have installed ts-node via npm i ts-node
  nodemon({
    exec: 'ts-node ./src/index.ts',
    ext: 'ts'
  }).on('restart', function() {
    setTimeout(function() {
      console.log('reload!');
      livereload.reload();
    }, 500);
  });
});

Is the application is production ready for android ? please guide ? can we integrate the firebase ? how ? how to send the queries to Linux server ?

how to not always re type username when refresh or reload page ?

thanks

I know this issue might not be served well here but I know this app was deployed successfully on Heroku by the creator so hoping to get some insight.

I build and deployed the app to Heroku, I am just using the free dyno and the site works well on mhy windows machines and on my mac (chrome and firefox). The app however wont load on Safari or any of my iPhone mobile browsers. I have tried to do some research and I am getting a whole lot of nothing. The most I can come up with is iOS doesnt like the certificate heroku includes in their free dyno.

here is a link to my stackoverflow question which included a photo of the dev console from safari

https://stackoverflow.com/questions/52820905/angular-6-app-wont-load-on-mobile-browser-iphone-or-safari

Does this sound right?

Sorry again for posting this here as this is a production issue and not an issue with the repo itself. Just been dealing with this for a few days and its starting to drive me crazy.

THANKS for any help!

Hi,
I am trying to figure out how to test the server side. I am using mocha, chai and sinon but really don't know how to emulate a websocket client on the server side so that I can test its flow. Could you help or suggest what client to use to initiate connect from the test?

Thank you.
Kind regards,
Jarek

Great work and very nice tutorial.

1. I am trying to experiment this by having 2 users connected 1-1 instead of everyone in the same common room. How can i add 2 users in 1 room once both of them are on the page, if 3rd user comes, we put them on waiting and when 4th comes, 3rd and 4th are added to that room to have private chat? Kind of random 1-1 chat with 2 people at 1 time. i have checked your tutorial but couldn't find the room name where you are emitting message and join events, as per socket io, events are emitted in rooms, https://socket.io/docs/emit-cheatsheet/ how is your approach different here?

2. Alternatively to be simple, how can i put let's say room name in the url, so that it loads that specific room, for e.g if i put http://localhost:4200?room=typescript-chat-room this should load a room named, typescript-chat-room and if i do http://localhost:4200?room=angular-discussion then that should connect to the room named, 'angular discussion' and so on. Please help me point in the code where i can change the room in server and how can i pass it as a query param from frontend client? i'd like to contribute once i understand the basics via code for rooms logic.

3. Also, is there reconnection implemented if socket io looses connection , does this auto reconnect the users? As i see socket io looses lots of connectivity due to ping timeouts, transport errors etc, is there any way to reconnect the chat automatically due to any network failure without page refresh?

4. what steps would be needed to allow users to upload and share videos/images/audio msgs (files) in the chat? can u share with me some libraries or examples to do this? i m interested in doing this.

this chat server does not work of https .can you share the code for the same

chat list can't auto scroll to latest item

Hello, I'm building a clone of your app, following along with the blog, and i'm getting this error in my console:

Failed to load http://http/socket.io/?EIO=3&transport=polling&t=M82Q3LZ: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:5050' is therefore not allowed access.

But in my network tab, everything is coming through as OK 200...

Any ideas why this is happening? I git cloned this repo, and no errors come up when I run it, and my code looks exactly like yours minus the material style, and I don't have any of the new stuff you added to the project, just what I got from following along with the blog post

The following error is thrown when running in a fresh setup:

src/server.ts(65,10): error TS2503: Cannot find namespace 'server'.
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! [email protected] build-ts: `tsc`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the [email protected] build-ts script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

tsc --version
Version 2.4.2

node --version
v8.3.0

I think I might misunderstand something about TypeScript's namespaces. Would you be able to help?

First of all, it is a great application! Thank you.

On the client side, everything works fine. I can start the server on localhost:8080 and I see all the conversation of the diverse localhost:4200s in the server terminal. But in the browser localhost:8080 (server) it is written Error: "Cannot GET /". What could be the issue? How can I fix this error?
I have downloaded your files from GitHub and the terminal (server) looks fine (see screenshot).

Many thanks for your help!
Karin

What happens if "hacker" client sends a message which does not match message.model ?

When a new message is received, the message list doesn't autoscroll to the bottom of the list, making the new message invisible if there is a scrollbar in <mat-list/>.

Suggestion: auto-scroll the message list to the bottom when a new message is received.

I had a quick look at the source code but am not sure how to do that in a clean angular-2 way.

I spy an unnecessary use of any

           this.io.on('connect', (socket: any) => {
            console.log('Connected client on port %s.', this.port);
            socket.on('message', (m: Message) => {
                console.log('[server](message): %s', JSON.stringify(m));
                this.io.emit('message', m);
            });

            socket.on('disconnect', () => {
                console.log('Client disconnected');
            });

what is socket?? what is the type? I can't find that info.. if I find out, I would like submit a PR for this lib if that's ok