centrifuge-dart icon indicating copy to clipboard operation
centrifuge-dart copied to clipboard

Does it work on the web

Open synw opened this issue 4 years ago • 9 comments

I tried to run the chat example on the web but it actually does not want to connect. It just hangs on the connection step, no output

synw avatar Apr 16 '20 15:04 synw

I never tried to use it in a web environment, so I think the answer is no. But I don't have an answer why - need some investigation. Maybe server logs has sth useful?

Could you give instructions on how to run example in a web context?

FZambia avatar Apr 17 '20 13:04 FZambia

@FZambia the package depends on dart:io which doesn't not work for web.

Web package can be created with dart:html. I do not see why it should not work, but some migration required :)

mogol avatar Apr 17 '20 13:04 mogol

@mogol, It would be nice to see Web support if you or someone else has free time to implement this.

Holofox avatar Apr 17 '20 16:04 Holofox

@FZambia : to compile for the web: flutter build web. It could be nice to have an example online if it works on the web

synw avatar Apr 17 '20 17:04 synw

I tried to replace dart:io with HtmlWebSocketChannel : here is a gist of transport.dart. It does the same thing, hanging at the connection step. The server says this (using the chat example):

error decoding command client=92fb9052-d0ca-4357-be6e-085542a42076 data=120,8,1,16,0,26,114,10,112,101,121,74,48,101,88,65,105,79,105,74,75,86,49,81,105,76,67,74,104,98,71,99,105,79,105,74,73,85,122,73,49,78,105,74,57,46,101,121,74,122,100,87,73,105,79,105,74,48,90,88,78,48,99,51,86,112,100,71,86,102,97,110,100,48,73,110,48,46,104,80,109,72,115,86,113,118,116,89,56,56,80,118,75,52,69,109,74,108,99,100,119,78,117,75,70,117,121,51,66,71,97,70,55,100,77,97,75,100,80,108,119 error="unexpected EOF" user=

I probably did not manage to use HtmlWebSocketChannel right: the params are not the same as dart:io and I am a bit lost on how to arrange this. It could help if someone with a good knowledge of this lib internals could check the gist

synw avatar Apr 18 '20 13:04 synw

Usually when working with binary data there is a method to turn WebSocket connection into binary mode. When I run an example I see that it sends text data instead of binary to server: Screenshot 2020-04-18 at 18 39 58

So I think there should be a way to send binary.

FZambia avatar Apr 18 '20 15:04 FZambia

@synw this does the work:

_socket.sink.add(Uint8List.fromList(data));

I think similar conversion can be required for decoding replies from server too (not sure though).

FZambia avatar Apr 18 '20 16:04 FZambia

You can use conditional imports for this issue Usage example: https://github.com/PlugFox/platform_info/blob/master/lib/src/platform.dart#L10-L14

Import interface implementation A when io, import B when html.

Need a separate implementation with 'dart:html' instead 'dart:io': https://github.com/centrifugal/centrifuge-dart/blob/3c26b04eeccb6a2e33914bd275c8573ef6cf1ab5/lib/src/transport.dart#L3 https://github.com/centrifugal/centrifuge-dart/blob/3c26b04eeccb6a2e33914bd275c8573ef6cf1ab5/test/src/utils.dart#L2

Or we just can use interops with https://github.com/centrifugal/centrifuge-js something like this way: https://gist.github.com/PlugFox/9e6b16890deacd0ae4855dae3491a149

But with conditional imports be better and simple usage)

@FZambia if you want, we can call and I will explain how it works. Port library is not so hard, web support protobuf and if exist centrifuge js - it is possible 100%

PlugFox avatar Aug 18 '21 12:08 PlugFox

We currently have an unfinished pr by @r-oman-G - https://github.com/centrifugal/centrifuge-dart/pull/53 - if someone interested to help it's a good starting point I suppose.

FZambia avatar Nov 19 '21 13:11 FZambia

Thanks to the PR of r-oman-G I was able to implement web support using web_socket_channel , compare https://github.com/centrifugal/centrifuge-dart/pull/73

robert-virkus avatar Jan 20 '23 14:01 robert-virkus

Closed by #73, released as part of v0.9.3

FZambia avatar Jan 29 '23 11:01 FZambia