Find a way for the app to work on the browser

[guyluz11]

The app is using gRPC to talk to the Hub.

For on going communication we are opening sockets and streaming data both ways, like turn on the light (app to hub) and light got turned on (hub to app).
They aren't new requests each time, the connection is being kept open and data is transfer between the devices.
If I understand correctly browsers does not support regular sockets like we use, they support web-sockets that is different protocol.

At first glans gRPC does not support browser

but

So my guess is that Sockets are not supported on the browser and only websockets.

Error: gRPC Error (code: 14, codeName: UNAVAILABLE, message: Error connecting: Unsupported operation: Socket constructor, details: null, rawResponse: null)


    at Object.createErrorWithStack (http://localhost:35079/dart_sdk.js:5054:12)
    at Object._rethrow (http://localhost:35079/dart_sdk.js:37670:16)
    at async._AsyncCallbackEntry.new.callback (http://localhost:35079/dart_sdk.js:37666:13)
    at Object._microtaskLoop (http://localhost:35079/dart_sdk.js:37526:13)
    at _startMicrotaskLoop (http://localhost:35079/dart_sdk.js:37532:13)
    at http://localhost:35079/dart_sdk.js:33303:9

gRPC package have package:grpc/grpc_web.dart for web, more research is needed.
See also flutter web-sockets doc.

Another option less favorable is to do get requests for state and changes from the Hub to the app each interval and send put messages for changes from the app to the Hub only when needed.
This is less good because it will create a lot of traffic in the network and will require more complicated code or sending all the data each time.

[guyluz11]

Recently they added a new constructor that will handle the differences grpc_or_grpcweb

/// Note that gRPC and gRPC-web are 2 different protocols and server must be
/// able to speak both of them for this to work.

[chena-1]

I will do it

[guyluz11]

Sure
Here is a gRPC-web examples from google.
I am not sure if the implementation should be in the Hub (Server side) or in the app (Client side).

To quote other developer

Recently they added a new constructor that will handle the differences mostly: https://github.com/grpc/grpc-dart/blob/master/lib/grpc_or_grpcweb.dart. Of course this depends on the server end handling the different types of connections properly.

So if I understand correctly you don't need to touch the client side as the gRPC package will do all the work for you, and you will need to implement the server side in the Hub but do your own research about it as I am not sure of it.

[guyluz11]

Last update of grpc package version 3.0.1

Add GrpcOrGrpcWebClientChannel which uses gRPC on all platforms except web, on which it uses gRPC-web.

Will update the package shortly.

[guyluz11]

Hi @chena-1 I am removing you from Assignees but your pr will still be merged if it will be accepted

Thanks