Kubernetes Ingress Nginx载入中的资源404

Question

Hy 海兰

We're trying to get our website working on kubernetes (running in a container using nginx). 我们正试图让我们的网站处理kubernetes（使用nginx在容器中运行）。 We use ingress to route to the site, here is our configuration: 我们使用ingress路由到站点，这是我们的配置：

nginx-conf: nginx的-conf的：

server {
  listen 80;
  location / {
    root /usr/share/nginx/html;
    index index.html index.htm;
    try_files $uri $uri/ /index.html =404;
  }
}

Kubernetes deployment: Kubernetes部署：

apiVersion: apps/v1beta1
kind: Deployment
metadata:
  name: mywebsite
spec:
  replicas: 2
  template:
    metadata:
      labels:
        app: mywebsite
    spec:
      containers:
      - name: mywebsite
        image: containerurl/xxx/mywebsite:latest
        ports:
        - containerPort: 80

---
apiVersion: v1
kind: Service
metadata:
  name: mywebsite
spec:
  ports:
  - port: 82
    targetPort: 80

  selector:
    app: mywebsite

Ingress config: Ingress配置：

apiVersion: extensions/v1beta1
kind: Ingress
metadata:
  name: myIngress
  annotations:
    kubernetes.io/tls-acme: "true"
    nginx.ingress.kubernetes.io/rewrite-target: /
spec:
  tls:
  - hosts:
    - xxx.com
    secretName: tls-secret
  rules:
  - host: xxx.com
    http:
      paths:
      - path: /mywebsite
        backend:
          serviceName: mywebsite
          servicePort: 82

When i go to xxx.com/mywebiste, the index.html is loading, but the css and js are not loaded (404): 当我访问xxx.com/mywebiste时，index.html正在加载，但未加载css和js（404）：

index.html: index.html的：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>My Website</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <link href="/styles.30457fcf45ea2da7cf6a.css" rel="stylesheet"></head>
  <body>
  <div id="react-root"></div>
  <script type="text/javascript" src="/app.171d6a95cf24d8abab14.js"></script></body>
</html>

...because it trys to get the resources here, as example of the css: ...因为它试图获取资源，例如css：

xxx.com/styles.30457fcf45ea2da7cf6a.css

...instead of: ...代替：

xxx.com/mywebsite/styles.30457fcf45ea2da7cf6a.css xxx.com/mywebsite/styles.30457fcf45ea2da7cf6a.css

If tried different things like: 如果试过不同的东西，比如

nginx.ingress.kubernetes.io/add-base-url
nginx.ingress.kubernetes.io/app-root

...etc., but nothing seems to work. 等等，但似乎没有任何效果。

Any ideas? 有任何想法吗？ Thanks for your help. 谢谢你的帮助。

Regards, Peter 问候，彼得

Answer 1

This is not a routing problem on nginx part, but the browser trying to access an absolute URI from the root of your domain. 这不是nginx部分的路由问题，而是浏览器尝试从域的根目录访问绝对URI。 Use relative URIs (remove the leading slash): 使用相对URI（删除前导斜杠）：

<link href="styles.30457fcf45ea2da7cf6a.css" rel="stylesheet"></head>
<script type="text/javascript" src="app.171d6a95cf24d8abab14.js"></script></body>

Kubernetes Ingress Nginx载入中的资源404

问题描述

1 个解决方案

解决方案1
4 已采纳 2018-06-15 09:23:11

Kubernetes Ingress Nginx载入中的资源404

问题描述

1 个解决方案

解决方案1 4 已采纳 2018-06-15 09:23:11

解决方案1
4 已采纳 2018-06-15 09:23:11