使用 K8s ingress 部署 Web 应用程序时出现 JS 404 错误
JS 404 error if deploy web application with K8s ingress
我正在尝试官方示例Example: Deploying PHP Guestbook application with MongoDB。
一切都很好,但是当我为它部署ingress
时,我可以在chrome网络调试中看到下一个(这里,31083是节点端口):
Request URL: http://10.192.244.109:31083/gb 200 OK
Request URL: http://10.192.244.109:31083/controllers.js 404 Not Found
ingress.yaml:
apiVersion: networking.k8s.io/v1
kind: Ingress
metadata:
name: gb-ingress
annotations:
nginx.ingress.kubernetes.io/rewrite-target: /
spec:
rules:
- http:
paths:
- path: /gb
pathType: Prefix
backend:
service:
name: frontend
port:
number: 80
ingress-nginx:(使用here)
apiVersion: v1
kind: Service
metadata:
annotations:
labels:
helm.sh/chart: ingress-nginx-3.27.0
app.kubernetes.io/name: ingress-nginx
app.kubernetes.io/instance: ingress-nginx
app.kubernetes.io/version: 0.45.0
app.kubernetes.io/managed-by: Helm
app.kubernetes.io/component: controller
name: ingress-nginx-controller
namespace: ingress-nginx
spec:
type: NodePort
ports:
- name: http
port: 80
protocol: TCP
targetPort: http
- name: https
port: 443
protocol: TCP
targetPort: https
selector:
app.kubernetes.io/name: ingress-nginx
app.kubernetes.io/instance: ingress-nginx
app.kubernetes.io/component: controller
我从chrome获取的K8s留言板索引页源码:
<html ng-app="guestbook">
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<title>Guestbook</title>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.12/angular.min.js"></script>
<script src="controllers.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.13.0/ui-bootstrap-tpls.js"></script>
</head>
<body ng-controller="guestbookCtrl">
<div style="width: 50%; margin-left: 20px">
<h2>Guestbook</h2>
<form>
<fieldset>
<input ng-model="msg" placeholder="Messages" class="form-control" type="text" name="input"><br>
<button type="button" class="btn btn-primary" ng-click="controller.onguestbook()">Submit</button>
</fieldset>
</form>
<div>
<div ng-repeat="msg in messages track by $index">
{{msg}}
</div>
</div>
</div>
</body>
</html>
我知道我的 ingress
只是指定了 /gb
前缀,所以 http://10.192.244.109:31083/controllers.js
无法路由到正确的服务,但我怎样才能让它工作?
我想也许可以为 js
重写添加另一条入口规则,但如果我有多个应用程序怎么办?有什么建议吗?
您应该能够使用正确的 rewrite-rule
和 path
模式执行此操作:
apiVersion: networking.k8s.io/v1
kind: Ingress
metadata:
name: gb-ingress
annotations:
nginx.ingress.kubernetes.io/rewrite-target: /
spec:
rules:
- http:
paths:
- path: /gb(/|$)(.*)
pathType: Prefix
backend:
service:
name: frontend
port:
number: 80
这将按以下方式重写您的请求:
- /gb -> /
- /gb/controller.js -> /controller.js
- /gb/foo -> /foo
我正在尝试官方示例Example: Deploying PHP Guestbook application with MongoDB。
一切都很好,但是当我为它部署ingress
时,我可以在chrome网络调试中看到下一个(这里,31083是节点端口):
Request URL: http://10.192.244.109:31083/gb 200 OK
Request URL: http://10.192.244.109:31083/controllers.js 404 Not Found
ingress.yaml:
apiVersion: networking.k8s.io/v1
kind: Ingress
metadata:
name: gb-ingress
annotations:
nginx.ingress.kubernetes.io/rewrite-target: /
spec:
rules:
- http:
paths:
- path: /gb
pathType: Prefix
backend:
service:
name: frontend
port:
number: 80
ingress-nginx:(使用here)
apiVersion: v1
kind: Service
metadata:
annotations:
labels:
helm.sh/chart: ingress-nginx-3.27.0
app.kubernetes.io/name: ingress-nginx
app.kubernetes.io/instance: ingress-nginx
app.kubernetes.io/version: 0.45.0
app.kubernetes.io/managed-by: Helm
app.kubernetes.io/component: controller
name: ingress-nginx-controller
namespace: ingress-nginx
spec:
type: NodePort
ports:
- name: http
port: 80
protocol: TCP
targetPort: http
- name: https
port: 443
protocol: TCP
targetPort: https
selector:
app.kubernetes.io/name: ingress-nginx
app.kubernetes.io/instance: ingress-nginx
app.kubernetes.io/component: controller
我从chrome获取的K8s留言板索引页源码:
<html ng-app="guestbook">
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<title>Guestbook</title>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.12/angular.min.js"></script>
<script src="controllers.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.13.0/ui-bootstrap-tpls.js"></script>
</head>
<body ng-controller="guestbookCtrl">
<div style="width: 50%; margin-left: 20px">
<h2>Guestbook</h2>
<form>
<fieldset>
<input ng-model="msg" placeholder="Messages" class="form-control" type="text" name="input"><br>
<button type="button" class="btn btn-primary" ng-click="controller.onguestbook()">Submit</button>
</fieldset>
</form>
<div>
<div ng-repeat="msg in messages track by $index">
{{msg}}
</div>
</div>
</div>
</body>
</html>
我知道我的 ingress
只是指定了 /gb
前缀,所以 http://10.192.244.109:31083/controllers.js
无法路由到正确的服务,但我怎样才能让它工作?
我想也许可以为 js
重写添加另一条入口规则,但如果我有多个应用程序怎么办?有什么建议吗?
您应该能够使用正确的 rewrite-rule
和 path
模式执行此操作:
apiVersion: networking.k8s.io/v1
kind: Ingress
metadata:
name: gb-ingress
annotations:
nginx.ingress.kubernetes.io/rewrite-target: /
spec:
rules:
- http:
paths:
- path: /gb(/|$)(.*)
pathType: Prefix
backend:
service:
name: frontend
port:
number: 80
这将按以下方式重写您的请求:
- /gb -> /
- /gb/controller.js -> /controller.js
- /gb/foo -> /foo