[英]Jhipster deployed to Istio (using Kubernetes) doesn't load correctly
I am deploying a Jhipster app to a Kubernetes environment, and am using Istio for the networking.我正在将 Jhipster 应用程序部署到 Kubernetes 环境,并使用 Istio 进行网络连接。
Below is my VirtualService.下面是我的虚拟服务。 Note that when the prefix
is set to /
, everything works fine.请注意,当前prefix
设置为/
时,一切正常。 However I have several apps running on this cluster, so I need to map it to /mywebsite
.但是我有几个应用程序在这个集群上运行,所以我需要 map 到/mywebsite
。
apiVersion: networking.istio.io/v1alpha3
kind: VirtualService
metadata:
name: ingress
spec:
hosts:
- "*"
gateways:
- mywebsite-gateway
http:
- match:
- uri:
prefix: /mywebsite
route:
- destination:
host: mywebsite
port:
number: 80
websocketUpgrade: true
When I access the app, I get these set of errors:当我访问该应用程序时,我收到以下一组错误:
mywebsite:3 GET http://mywebsite.com:31380/app/vendor.bundle.js net::ERR_ABORTED 404 (Not Found)
manifest.bundle.js:55 Uncaught TypeError: Cannot read property 'call' of undefined
at __webpack_require__ (manifest.bundle.js:55)
at eval (app.main.ts?3881:1)
at Object../src/main/webapp/app/app.main.ts (main.bundle.js:447)
at __webpack_require__ (manifest.bundle.js:55)
at webpackJsonpCallback (manifest.bundle.js:26)
at main.bundle.js:1
__webpack_require__ @ manifest.bundle.js:55
eval @ app.main.ts?3881:1
./src/main/webapp/app/app.main.ts @ main.bundle.js:447
__webpack_require__ @ manifest.bundle.js:55
webpackJsonpCallback @ manifest.bundle.js:26
(anonymous) @ main.bundle.js:1
manifest.bundle.js:55 Uncaught TypeError: Cannot read property 'call' of undefined
at __webpack_require__ (manifest.bundle.js:55)
at eval (global.css?ca77:1)
at Object../node_modules/css-loader/index.js!./src/main/webapp/content/css/global.css (global.bundle.js:6)
at __webpack_require__ (manifest.bundle.js:55)
at eval (global.css?0a39:4)
at Object../src/main/webapp/content/css/global.css (global.bundle.js:13)
at __webpack_require__ (manifest.bundle.js:55)
at webpackJsonpCallback (manifest.bundle.js:26)
at global.bundle.js:1
__webpack_require__ @ manifest.bundle.js:55
eval @ global.css?ca77:1
./node_modules/css-loader/index.js!./src/main/webapp/content/css/global.css @ global.bundle.js:6
__webpack_require__ @ manifest.bundle.js:55
eval @ global.css?0a39:4
./src/main/webapp/content/css/global.css @ global.bundle.js:13
__webpack_require__ @ manifest.bundle.js:55
webpackJsonpCallback @ manifest.bundle.js:26
(anonymous) @ global.bundle.js:1
mywebsite:1 Unchecked runtime.lastError: The message port closed before a response was received.
I'm not sure why it is trying to go /app/vendor.bundle.js
.我不确定它为什么要尝试 go /app/vendor.bundle.js
。 I think it should go to /mywebsite/app/vendor.bundle.js
.我认为它应该 go 到/mywebsite/app/vendor.bundle.js
。 Although when I go to this page manually, I get a Your request cannot be processed
虽然当我手动 go 到这个页面时,我得到了Your request cannot be processed
Also in my index.html
, I have <base href="./" />
, which had always been there,as I read that as a possible solution.同样在我的index.html
中,我有<base href="./" />
,它一直存在,因为我认为这是一种可能的解决方案。
As you mentioned in comments正如你在评论中提到的
I set new HtmlWebpackPlugin({ baseUrl: '/myapp/' }) in the webpack... and in the index.html.我在 webpack... 和 index.html 中设置了 new HtmlWebpackPlugin({ baseUrl: '/myapp/' })。 I get some new errors (ie. can't find favicon), but still the site doesn't load as doesn't seem to find the javascript or soemthing – Mike K我收到一些新错误(即找不到图标),但该网站仍然无法加载,因为似乎没有找到 javascript 或其他东西 – Mike K
That's how it supposed to work.这就是它应该如何工作的方式。 It doesn't load javascript and probably css/img's because you didn't show istio uri for this.它不会加载 javascript 和可能的 css/img,因为您没有为此显示 istio uri。
So the solution here is所以这里的解决方案是
Take a look at thisexample看看这个例子
Let's break down the requests that should be routed to Frontend:让我们分解应该路由到前端的请求:
Exact path / should be routed to Frontend to get the Index.html确切路径/ 应路由到前端以获取 Index.html
Prefix path /static/* should be routed to Frontend to get any static files needed by the frontend, like Cascading Style Sheets and JavaScript files .前缀路径/static/* 应路由到前端以获取前端所需的任何 static 文件,例如级联样式表和JavaScript 文件。
Paths matching the regex ^.*.(ico|png|jpg)$ should be routed to Frontend as it is an image, that the page needs to show.匹配正则表达式 ^.*.(ico|png|jpg)$ 的路径应该路由到前端,因为它是页面需要显示的图像。
http:
- match:
- uri:
exact: /
- uri:
exact: /callback
- uri:
prefix: /static
- uri:
regex: '^.*\.(ico|png|jpg)$'
route:
- destination:
host: frontend
port:
number: 80
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.