DJICloudAPI frontend behind NGINX
已完成
I would like to share an issue with the frontend. I bet nobody up to now did run the Vue app behind Nginx for SSL termination, otherwise that problem should already have been found/fixed.
It is with an dependency module named `vite` (Vue stuff). File is `./node_modules/vite/src/client/client.ts`
This package opens a websocket like so:
const socket = new WebSocket(`${socketProtocol}://${socketHost}`, 'vite-hmr');`
The default installation uses port 8080 and insecure `ws`, so the URL resolves to `ws://my.domain.com:8080`. Unfortunately in case of WSS it would do the same with the socketHost, which still contains port 8080 - but, there is no listener on port 8080 for WSS and `wss://my.domain.com:8080` fails. Hence, the web socket connection cannot be established from the frontend app.
I was initially attempting to patch the `client.ts` file, using the module `patch-package` (which perfectly works in JS environments), but even though the ts file was successfully patched, I wrestled with the typescript compiler, which obviously runs _before_ the npm package is patched, so the change didn't arrive in the resulting `*.mjs` file.
I finally ended up in patching the `*.mjs` file, here `./node_modules/vite/dist/client/client.mjs`. More specifically I changed line 188 from
const socket = new WebSocket(`${socketProtocol}://${socketHost}`, 'vite-hmr');
to
const socket = new WebSocket(`${socketProtocol}://${socketProtocol == 'wss' ? socketHost.split(':')[0] : socketHost}`, 'vite-hmr');
As you can see, I'm just removing the string part `:8080` from the `socketPath` in case of WSS and it worked.
But there must be another way to solve this, just my Vue is not that good my current knowledge w.r.t. to the typescript tooling isn't either, I'll leave it up to you guys to find a solution for that.
As a side node: I installed everything on an Ubuntu 20.04, AWS and Azure, w/o problems. I'm also using a Let'sEncrypt certificate, which was not encouraged. Maybe the Dock or the SC's have a different opinion with this certificate.
请先登录再写评论。
评论
10 条评论