Connection-based injection with components in the frontend and backend

#1

I have an IDE service that has a backend component that needs to call a frontend component but it’s not really clear to me how to do the bindings from the ConnectionContainerModule code and the File List View JSON-RPC Service Example.

With these bindings, I get Error: Request 'myFunction' failed at Proxy.\<anonymous> (http://localhost:3000/bundle.js:59363:33) when I inject the service and do myService.myFunction() from the browser side:

// frontend bindings:
bind(MyClient).toSelf().inSingletonScope()
bind(MyService).toDynamicValue(({ container }) =>
    WebSocketConnectionProvider.createProxy(container, myServicePath, container.get(DeployRoadRulesClient))
).inSingletonScope()
// backend bindings:
bind(ConnectionContainerModule).toConstantValue(
    ConnectionContainerModule.create(({ bind, bindFrontendService, bindBackendService }) => {
        bindFrontendService(myServicePath, MyClient)
        bind(MyService).toSelf().inSingletonScope()
        bindBackendService(myServicePath, MyService)
    })
)
#2

@dpetroff thank you for the discussion, you can follow the documented guide on the website if you’re trying to understand how to implement communication via JSON-RPC:

If you require additional examples you can also search for similar implementations already in the framework :+1:

#3

@vince-fugnitto, unfortunately the documented guide does not cover the connection-based bindings at all. @akosyakov’s workshop is the only example I could find, so I tried to adapt this for the bindings I tested above, however this also did not cover the case where I want to communicate both ways in a connection-specific channel. If you’re aware of a better example covering this case, please let me know.

#4

I don’t see where you bind the DeployRoadRulesClient service, because that’s the object that will be called.
I would debug through the front end bindings to make sure that object is defined and has the “myFunction” method.

#5

Oops. I must have missed that one when I was extracting the example from my code base. It should say MyClient there but I don’t think I can edit the original post anymore.

The bindings in my code base are free of that mistake, so

// frontend bindings:
bind(MyClient).toSelf().inSingletonScope()
bind(MyService).toDynamicValue(({ container }) =>
    WebSocketConnectionProvider.createProxy(container, myServicePath, container.get(MyClient))
).inSingletonScope()
// backend bindings:
bind(ConnectionContainerModule).toConstantValue(
    ConnectionContainerModule.create(({ bind, bindFrontendService, bindBackendService }) => {
        bindFrontendService(myServicePath, MyClient)
        bind(MyService).toSelf().inSingletonScope()
        bindBackendService(myServicePath, MyService)
    })
)

for sure produces the error.

#6

I should also clarify that there are no injection errors neither in the browser nor the backend console, and the communication fails from the frontend to the backend already: when I inject my service and do myService.myFunction() all I get is Error: Request 'myFunction' failed at Proxy.\<anonymous> (http://localhost:3000/bundle.js:59363:33). There are no other errors visible at all.

#7

At this point, I think you need to fire up the debugger. I’m all out of guesses. Browser developer tools for the win. Relevant class would be ProxyFactory.