Cannot use HTTPS to serve Module Federation Remotes

[bouncehead13]

Current Behavior

Currently, when trying to serve a remote configured as such

"host": "local.xxx.com",
"ssl": true,
"sslKey": "xxx.key",
"sslCert": "xxx.crt"

the withModuleFederation is building mapped urls without HTTPS. That can be seen in the source code itself.

const host = serveTarget.options?.host ?? 'http://localhost';
const port = serveTarget.options?.port ?? 4201;
return `${
  host.endsWith('/') ? host.slice(0, -1) : host
}:${port}/${remoteEntry}`;

This only considers the host and port, but nothing about SSL.

Expected Behavior

It is expected that if the remote serve is configured with HTTPS (ssl: true), the mapped remotes would also contain https in the outputted url.

GitHub Repo

No response

Steps to Reproduce

1. Configure the remote to serve with HTTPS (an example was provided in the "Current Behavior" section)
2. Run the shell with devRemotes
3. Notice webpack starts a HTTPS server for the remote, but the main.js in the shell pulls a remoteEntry.js from a http protocol.

Nx Report

Node : 16.20.0
   OS   : darwin arm64
   npm  : 8.19.4
   
   nx : 15.4.5
   @nrwl/angular : Not Found
   @nrwl/cypress : 15.4.5
   @nrwl/detox : Not Found
   @nrwl/devkit : 15.4.5
   @nrwl/esbuild : Not Found
   @nrwl/eslint-plugin-nx : 15.4.5
   @nrwl/expo : Not Found
   @nrwl/express : Not Found
   @nrwl/jest : 15.4.5
   @nrwl/js : 15.4.5
   @nrwl/linter : 15.4.5
   @nrwl/nest : Not Found
   @nrwl/next : Not Found
   @nrwl/node : Not Found
   @nrwl/nx-cloud : Not Found
   @nrwl/nx-plugin : 15.4.5
   @nrwl/react : 15.4.5
   @nrwl/react-native : Not Found
   @nrwl/rollup : 15.4.5
   @nrwl/schematics : Not Found
   @nrwl/storybook : Not Found
   @nrwl/web : 15.4.5
   @nrwl/webpack : 15.4.5
   @nrwl/workspace : 15.4.5
   @nrwl/vite : 15.4.5
   typescript : 4.8.4
   ---------------------------------------
   Local workspace plugins:
         @digital-ui/tools
   ---------------------------------------
   Community plugins:

Failure Logs

No response

Operating System

• macOS
• Linux
• Windows
• Other (Please specify)

Additional Information

This was working as expected in 15.3.3 and broken in 15.4.0+
Our team just upgraded past 15.3.3 recently

In 15.3.3, the code has a fallback of //localhost which worked great because it honored whatever the shell was doing.

const host = serveTarget.options?.host ?? '//localhost';

In 15.4.0, the code fallback was changed to http://localhost without capability to change http to https.

const host = serveTarget.options?.host ?? 'http://localhost';

[anandjaisy]

Any workaround for this, I am facing the same issue https://stackoverflow.com/questions/76253660/get-http-localhost4201-remoteentry-mjs-neterr-empty-response-nx-micro-front

[xiongemi]

could you use ssl target from webpack executor?https://nx.dev/packages/react/executors/module-federation-dev-server#ssl
You can edit the remote's serve and serve-static options in project.json. That would allow you to skip having to specify ssl: true when running the servers.

[xiongemi]

closing this issue for now

[bouncehead13]

@xiongemi Please reopen. No resolution has been provided. We are still stuck and unable to use HTTPS with Module Federation.

As mentioned in my original report, we had ssl enabled as true and that works as intended. The server will start with SSL running.

The issue is within Nx’s custom implementation to link remote entries file together. It has hardcore to http (also mentioned in the initial report).

I’m happy to provide any clarifying details, but closing this with no resolution leaves the defect.

[bouncehead13]

could you use ssl target from webpack executor? https://nx.dev/packages/webpack/executors/dev-server#ssl
You can edit the remote's serve and serve-static options in project.json. That would allow you to skip having to specify ssl: true when running the servers.

@xiongemi If the suggestion is to turn off SSL, our team requires it so we need it enabled.

Every URL is comprised with a protocol, host, and port. Nx is only using the host and port without consideration for the protocol. This is the exact defect I’m reporting.

Copied from above the Nx source code in question.

const host = serveTarget.options?.host ?? 'http://localhost';
const port = serveTarget.options?.port ?? 4201;
return `${
  host.endsWith('/') ? host.slice(0, -1) : host
}:${port}/${remoteEntry}`;

[github-actions]

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.