在入口中使用 root 访问不同的反应路径答案

【问题标题】：Access different react paths with root in ingress在入口中使用 root 访问不同的反应路径
【发布时间】：2021-05-07 02:21:47
【问题描述】：

我有两个 React 应用，一个是供管理员使用的，另一个是供普通用户使用的。两者都具有root / 访问权限。为了使管理员能够在普通用户访问他们各自的页面时访问他们的页面，我在管理员的反应路由器中添加了一个重定向路由，它从admin 重定向到/。然后我在我的入口中添加了两个后端如下：

apiVersion: networking.k8s.io/v1beta1
kind: Ingress
metadata:
  name: my-ingress
  annotations:
    kubernetes.io/ingress.class: nginx
    # nginx.ingress.kubernetes.io/use-regex: "true"
    # nginx.ingress.kubernetes.io/rewrite-target: /
spec:
  rules:
     paths:
      - path: /
        pathType: Prefix
          backend:
            serviceName: user-service
            servicePort: 3000

      - path: /admin
        pathType: Exact
          backend:
            serviceName: admin-service
            servicePort: 4000

事情是这样的，它不会加载管理页面。我不知道为什么......有没有办法用相同的根路径加载这些不同的应用程序？（两个根路径都是/）

【问题讨论】：

之前没用过react。但是要澄清一些事情。您添加的重定向路由，从客户端更改路由对吗？如果是这样，那就不行了。
没错，它重定向客户端..但理论上客户端也是我的后端。
您能否提供一些来自两个入口后端的请求的测试示例？还记录来自Ingress 和您的backend 请求。
您是否尝试过将配置中的 /admin 路径移动到比 / 路径更高的位置？我从未使用过 nginx-ingress，但我多次使用 nginx 作为反向代理，通常这些配置文件中的路由是自上而下读取的。我会假设它会在路由之前查看 servicePort 但以防万一我认为您不希望在前缀路由之前处理您的确切路由。
您是否尝试过切换路径的顺序？最长的应该优先考虑。您是否刚刚尝试过 1 条路径并将 / 发送到管理服务？如果它不起作用，我会检查服务端口。

标签： reactjs kubernetes nginx-ingress

【解决方案1】：

在您的管理服务中，请确保您从相对路径（此处为 /admin）提供服务。

在 CRA 中，您可以通过在 package.json 中配置主页来实现

 "homepage": "http://example.com/admin",

参考：https://create-react-app.dev/docs/deployment/#building-for-relative-paths

【讨论】：

实际上它是一个本地部署。我正在使用 IP 地址，可以吗？
我不确定你的反应应用程序是如何设置的，也许试试这个pluralsight.com/guides/…
尝试使用https://example.com/admin 或/admin
这有一个基本假设，即开发人员在构建项目之前就知道入口套筒，但情况可能并不总是如此。另一种方法是在 SPA 返回的 index.html 中嵌入根爬虫。爬虫尝试获取一些众所周知的资源，直到返回 2XX 状态。 IE。尝试将当前路径解析到此应用程序的根路径的小循环。比如从/admin/foo/index.html获取SPA，先GET /admin/foo/.well-known（返回404），再GET /admin/.well-known（返回200），即根路径是 /admin

【解决方案2】：

这也许你想要 - Nginx 重写

nginx.ingress.kubernetes.io/rewrite-target

这是完整的文档。 rewrite

【讨论】：