frontend object proxy in backend

[Yahud100]

is this possible to get a proxy object for frontend classes similar to creating backend proxy objects and using them in frontend using json-rpc

[msujew]

Hey @Yahud100,

yes, see the code and comments in https://github.com/eclipse-theia/theia/blob/master/packages/core/src/node/messaging/connection-container-module.ts. You will find a few examples of that code used throughout our codebase.

Note that frontend services can only be called from backend services that are scoped to that RPC connection.

[Yahud100]

oh thank you very much sujew , its really very helpful , could you please let me know , is it mandatory to excecute vscode extensions commands through frontend ? is there any way to execute commands through backend directly.

[msujew]

could you please let me know , is it mandatory to excecute vscode extensions commands through frontend ? is there any way to execute commands through backend directly.

No, commands are only registered in the frontend - the backend isn't aware of any commands. In order to invoke a command, you need to do so on the frontend or in a connection scoped backend service (see the link I've posted above).

[Yahud100]

ok thank you soo much

[Yahud100]

i have gone through this code

const commandConnectionModule = ConnectionContainerModule.create(({ bindFrontendService }) => {
bindFrontendService(commandServicePath, CommandService);
});

Here i understood that CommandService is an interface where having a method called executeCommand and this code is exposing that service to backed to use , i have tried to inject this CommandService in backed , while running the application got the below error

Error: No matching bindings found for serviceIdentifier: Symbol(CommandService)
 at _validateActiveBindingCount (ABCD\node_modules\inversify\lib\planning\planner.js:82:23)

i haven't written any code , i have just explored already written code and tried to inject it in backed , please tell me why am i getting this error

[msujew]

As mentioned in the documentation for ConnectionContainerModule, the backend service that injects the frontend service needs to part of a connection scoped container. Take a look at the remote connection module:

theia/packages/remote/src/electron-node/remote-backend-module.ts

Lines 44 to 52 in d34c0b3

	export const remoteConnectionModule = ConnectionContainerModule.create(({ bind, bindBackendService }) => {
	bind(RemoteSSHConnectionProviderImpl).toSelf().inSingletonScope();
	bind(RemoteSSHConnectionProvider).toService(RemoteSSHConnectionProviderImpl);
	bindBackendService(RemoteSSHConnectionProviderPath, RemoteSSHConnectionProvider);
	bind(RemotePortForwardingProviderImpl).toSelf().inSingletonScope();
	bind(RemotePortForwardingProvider).toService(RemotePortForwardingProviderImpl);
	bindBackendService(RemoteRemotePortForwardingProviderPath, RemotePortForwardingProvider);
	});

Only services that are bound in the scope of the module are allowed to inject frontend services. Note that these backend services only exist in the scope of a connection and not globally within the backend.

To explain in short why this is so complicated: There is the global backend container that lives independently of any frontend. I.e. it always exists, even if no frontend is connected to the backend. In order to invoke functions on the frontend, a dedicated connection scoped container needs to be created. This container has access to all global backend services and all exposed frontend services - but it's not accessible from the global backend services, since it lives in its own child container that is only accessible from the respective frontend connection.

[Yahud100]

Hi @msujew thanks for the explanation. I have a question: if I create a class implementing BackendApplicationContribution and this class is scoped to an RPC connection as per the example you mentioned, can I call these endpoints through Postman? I'm having trouble because the lifecycle hooks of my implementation class are not executing during debugging, and I'm unable to call the endpoints.

[msujew]

can I call these endpoints through Postman

No, the RPC endpoints are generally not callable through any kind of HTTP test client. Purely theoretical it would be possible, but the messaging architecture in Theia is too complicated to accomplish this. Or are you talking about new HTTP endpoints that you're contributing to the express app?

I'm having trouble because the lifecycle hooks of my implementation class are not executing during debugging

So much is expected - since the backend application has already gone through all of its own lifecycle hooks by the time the first user connects, there's nothing left to call on the backend app contribution if its contributed through a connection scoped module.

and I'm unable to call the endpoints

Can you share a reproducible example?

[Yahud100]

Yes @msujew , I'm talking about the new HTTP endpoints that I'm contributing to the Express app. I'm trying to inject the command service to utilize the executeCommand method within it. That's why I'm using the ConnectionContainerModule example you mentioned earlier.

[msujew]

I see. Yeah, I don't think this is going to work well. As mentioned, connection scoped containers cannot easily contribute to the backend lifecycle. Also, what will happen once two different windows connect to the same backend? Do you get two different HTTP endpoints?

Note that in order for the service to actually be injected into the container, you need to inject it on the frontend - otherwise the backend is not aware of the service.

[msujew]

Now that you're explained what your use case is, I can recommend you a pattern to apply here:

// Global backend contribution
class CustomBackendAppContribution implements BackendApplicationContribution {
  private onDidCallEndpointEmitter = new Emitter<Data>(); // or void if no data is required
  public onDidCallEndpoint = this.onDidCallEndpointEmitter.event;
  
  configure(app: Express) {
    app.get(..., (req, res) => {
      const data = // get data from the req
      this.onDidCallEndpointEmitter.fire(data);
    });
  }
}

// Connection Scoped contribution
class ConnectionScopedService {
  @inject(CustomBackendAppContribution) private custom: CustomBackendAppContribution;
  
  // call this from the frontend once during initialization
  setup(): Promise<void> {
     this.custom.onDidCallEndpoint(data => ...); // call the frontend in the callback
  }
}

[YathindraNikshipth]

Hey @msujew, I’m able to call endpoints and execute commands using the following code:

//connection`scoped  contribution
export class ConnectionController implements IController {
    @inject(CommandService)
    private command: CommandService
    constructor(@inject(ISharedService) private shared: ISharedService) {
    }
    async method(): Promise<void> {
        const app = await this.shared.getBackendApplication();
        app.get('/call', async (req, res) => {
            const command = req.body.command;
            const param = req.body.param
            const result = await this.command.executeCommand(command,param)
            return res.json(result)
        })
    }
}

Will this approach raise any security concerns?

[msujew]

Well, you'll quickly run into issues once your users start opening the same frontend application twice. I'm not sure how express deals with a path being registered multiple times, but this likely won't do want you want in case the frontend is open twice. Also, closing one of those apps will likely lead to issues down the line, because the frontend's command service will become unavailable.

I really recommend you to use the pattern I've shown in #14044 (reply in thread).

[YathindraNikshipth]

@msujew yes, your right, also i got a doubt, after connection is established at first time, if I refresh the browser again will the command service become unavailable in this case as well?