(Port-)forwarding/Page preview

[janus-reith]

Many of my projects involve multiple services sitting on multiple ports.
For example, I have a frontend on port 4000, an api on port 3000, and some oauth flow using port 5000.

How could I forward these in the browser using theia? Preferrably I would not want to use some separate ssh forwarding that has to run on my local machine.

But at the same time, I would want my scripts and dom being executed and evaluated locally in the browser, so I could inspect things properly.
Another consideration would be, that things like the oauth flow should be functional, so I assume some kind of rewrite for localhost requests would need to happen.

I'm currently using VS Code with Remote SSH plugin and some ssh LocalForwards set up for several servers each containing separate projects, and I'm trying to find ways to replace this setup.

Any idea how this could work out?
Thanks!

[akosyakov]

@janus-reith please see:

theia/packages/core/src/browser/external-uri-service.ts

Lines 25 to 33 in 96e3c72

	/**
	* Maps local to remote URLs.
	* Should be no-op if the given URL is not a localhost URL.
	*
	* By default maps to an origin serving Theia.
	*
	* Use `parseLocalhost` to retrieve localhost address and port information.
	*/
	resolve(uri: URI): MaybePromise<URI> {

you can customize it, default behaviour is documented in js-doc

[akosyakov]

Unfortunately, it works for everything besides the mini-browser, we have an issue for it: #6562

For the mini-browser maybe @kittaakos can give a hint how forwarding of localhost can be implemented

[kittaakos]

You can try to customize the LocationWithoutSchemeMapper or the implementation of other location mappers. You might want to check this conversation.

[janus-reith]

Thanks @akosyakov @kittaakos for the details!

I will need to dive further into this, as currently I'm struggling to understand it properly: If the mini-browser, which I assumme is the kind of preview browser I was looking for, currently does not work with url mapping, then where does that url mapper actually come into play? Or, is there some other pewview browser besides that mini-browser?

[akosyakov]

Links to localhost in terminals, editors, VS Code webviews and so on.