子文件夹React app+；使用入口网关的Angular应用程序

我在试图通过minikube的Istio网关访问webapp前端时遇到问题。我已将入口网关配置为服务于Angular前端（minikube_ip:31380/home）和React前端（minikube_ip:31380/app），但当我尝试访问时，我发现404个文件未找到（css、assets、main.js、bundle.js等）-->

我试着在build命令中写--base href/app，“homepage”：“.”在package.json中，在package.json中写--homepage”：“/app”，但没有任何更改

唯一改变http响应的是index.html（Angular）中的以下标记：

我的Istio入口规则：

server {

  listen 80;

  sendfile on;

  default_type application/octet-stream;


  gzip on;
  gzip_http_version 1.1;
  gzip_disable      "MSIE [1-6]\.";
  gzip_min_length   1100;
  gzip_vary         on;
  gzip_proxied      expired no-cache no-store private auth;
  gzip_types        text/plain text/css application/json application/javascript application/x-javascript text/xml application/xml application/xml+rss text/javascript;
  gzip_comp_level   9;


  root /usr/share/nginx/html;


  location / {
    try_files $uri $uri/ /index.html =404;
  }

}

apiVersion: networking.istio.io/v1alpha3
kind: Gateway
metadata:
  name: ingress-gateway-configuration
spec:
  selector:
    istio: ingressgateway
  servers:
  - port:
      number: 80
      name: http
      protocol: HTTP
    hosts:
    - "*" 
---
kind: VirtualService
apiVersion: networking.istio.io/v1alpha3
metadata:
  name: virtual-service
  namespace: default
spec:
  hosts:  
    - "*"
  gateways:
    - ingress-gateway-configuration

  http:

  - match:
    - uri:
        prefix: /app
    route:
    - destination:
        host: webapp-service
        subset: app

  - match:
    - uri:
        prefix: /home
    route:
    - destination:
        host: webapp-service
        subset: home


---
kind: DestinationRule
apiVersion: networking.istio.io/v1alpha3
metadata:
  name: destination-rule
  namespace: default
spec:
  host: webapp-service
  subsets:
    - labels:
        version: home
      name: home
    - labels:
        version: app
      name: app

主要问题：

最后，还要补充的是，我已经将显示两个前端的模式从入口网关更改为节点端口，并通过节点端口进行访问，它们显示得很好（例如：minikube_ip:31040）

---

提前感谢。

尝试修改您的入口对象重写目标和路径，如下所示：

   nginx.ingress.kubernetes.io/rewrite-target: /$1
          path: /(.*)

确保你检查了这个

---

如果您不想使用@kishorebjv的解决方案，另一种方法是对

nginx.conf

本身进行更改

  location /home/?(.*) {
    try_files $1 $1/ /index.html =404;
  }

---

对不起，我想我解释错了。从我在文档中看到的情况来看，这会将流量重定向，例如，从“/app/me”重定向到“/me”，但我想要的是反过来。我的意思是，这两个应用程序在根目录（localhost:xxxx/）中本地运行时，我想，thorught Istio Gateway，在minikube_ip/app中显示它们，另一个在minikube_ip/home中显示它们。也许我错了，让我知道。我添加了我的Istio网关配置文件，以防它提供有关如何解决问题的任何线索。非常感谢@Frankie，实际上在我的env中，我使用了react js应用程序，但没有使用istio，我还使用了nginx入口控制器。这是ingress对象的要点：我曾经用过。。尝试一下类似的方法，或者我在这方面做得不够深入istio@Frankierewrite=/=redirect是否在默认命名空间上启用了istio注入

kubectl get namespace-L istio injection

yes当然：）根据您的屏幕，istio以200状态正确响应。请查看nginx conf，尤其是

try_files$uri$uri

和fall back选项（看起来应用程序正在使用default index.html进行响应，因为前两个条件没有满足，如home/index.html或app/index.html）

   nginx.ingress.kubernetes.io/rewrite-target: /$1
          path: /(.*)

  location /home/?(.*) {
    try_files $1 $1/ /index.html =404;
  }