Client side RxJS WebSocketSubject with WsAdapter example not working

CoreyCole commented 6 years ago

I'm submitting a...


[ ] Regression 
[x] Bug report
[ ] Feature request
[ ] Documentation issue or request
[ ] Support request => Please do not submit support request here, instead post your question on Stack Overflow.

Current behavior

I'm trying to extend the gateways ws example (working), but using rxjs WebSocketSubject on the client side.

Expected behavior

I'd expect it to work similar to the WebSocket client that is native to the browser (like in that ws gateway example)

Minimal reproduction of the problem with instructions

https://github.com/CoreyCole/nest/tree/master/sample/20-gateways-ws-client-rxjs

What is the motivation / use case for changing the behavior?

RxJS all the things?

Environment


Nest version: 5.0.0
 For Tooling issues:
- Node version: v8.11.1 
- Platform:  Mac

Others:

On the client, I'm using rxjs cdn as instructed here

CoreyCole commented 6 years ago

Also asked on stack overflow here in case I'm doing something wrong

Alessia958 commented 6 years ago

Maybe (i'm a newbie) try to check your package.json and look for the version of rxjs, i've faced some problem with nestjs v5 and version of rxjs previus than v 6.1.0

CoreyCole commented 6 years ago

Thanks for the reply, I'm a nestjs newbie too 😆

I tried update rxjs to ^6.1.0 in my reproduction fork with no luck https://github.com/CoreyCole/nest/commit/457b603b369bf9ad24240566229a48739f94c22d

CoreyCole commented 6 years ago

I got it working with rxjs@5.5.6 on the client side. At this point, this is definitely not an issue with nest.

Here is the working HTML example using 5.5.6. Commented out (non-working) code is from version 6.0.0.

<html>

<head>
    <!-- <script src="https://unpkg.com/@reactivex/rxjs@6.0.0/dist/global/rxjs.umd.js"></script> -->
    <script src="https://unpkg.com/@reactivex/rxjs@5.5.6/dist/global/Rx.js"></script>
    <script>
        // const { WebSocketSubject } = rxjs.webSocket;
        // const socket$ = WebSocketSubject.create('ws://localhost:8080');
        const socket$ = Rx.Observable.webSocket('ws://localhost:8080');
        socket$.subscribe(
                (data) => console.log(data),
                (err) => console.error(err),
                () => console.warn('Completed!')
            );
        socket$.next(JSON.stringify({
            event: 'events',
            data: 'test',
        }));
        console.log('here')
    </script>
</head>

<body></body>

</html>

I'll update my reproduction fork (without the commented code) in case the nest guys want to merge this as an example. Probably not, because it is a client-side example, the server is the same as example 16-gateways-ws

CoreyCole commented 6 years ago

fixed my repoduction fork in case you want to merge the rxjs WebSocketSubject example

https://github.com/CoreyCole/nest/commit/3c747824e305d0283809e348505fb4543fb47466

I'm going to try for a bit more to see if I can get it working on rxjs 6.0.0 or 6.1.0 on the client side

CoreyCole commented 6 years ago

Got it working with 6.1.0 on the client! I was just using it wrong. See working: https://github.com/CoreyCole/nest/blob/master/sample/20-gateways-ws-client-rxjs/client/index.html


<html>

<head>
    <script src="https://unpkg.com/@reactivex/rxjs@6.1.0/dist/global/rxjs.umd.js"></script>
    <script>
        const { WebSocketSubject } = rxjs.webSocket;
        const socket$ = new WebSocketSubject('ws://localhost:8080');
        socket$.subscribe(
                (data) => console.log(data),
                (err) => console.error(err),
                () => console.warn('Completed!')
            );
        // rxjs websocket automatically serializes JSON as of version 6.0.0
        // no need for JSON.stringify
        // see https://github.com/ReactiveX/rxjs/blob/master/CHANGELOG.md#600-beta4-2018-03-29
        socket$.next({
            event: 'events',
            data: 'test',
        });
        console.log('here')
    </script>
</head>

<body></body>

</html>

whtiehack commented 6 years ago

thx for share.

lock[bot] commented 4 years ago

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

nestjs / nest