Traefik TLS 终止。客户端(HTTPS)-[TRAEFIK(HTTPS) <-> TRAEFIK(HTTP)]-REACT(HTTP)

Question

我在 Docker 中有一个网络应用程序：

正面 反应

背部 laravel 回声服务器 nginx 雷迪斯 php-fpm ……

为了使用它，我转到 127.0.0.1:5000（FRONT-react 端口），一切正常。它向后端发送请求，nginx 管理它们。

现在我需要添加 HTTPS 并在 VDS 中工作。事实上，我需要反向代理。我的应用程序不知道如何在 https 上工作，所以它的工作逻辑不应该改变，它应该认为它在 http 上工作。但同时，它需要通过 HTTPS 在浏览器中突出并工作。

我尝试将 Traefik 放在 FRONT 到 80 端口/

version: '3.5'

networks:
  frontend:
    driver: ${NETWORKS_DRIVER}
  backend:
    driver: ${NETWORKS_DRIVER}

volumes:
  react:
    driver: ${VOLUMES_DRIVER}
  traefik:
    driver: ${VOLUMES_DRIVER}

services:

  ### react #####################################################
  react:
    image: ${REGISTRY_URL}/react
    ports:
      - "5000:3000"
    stdin_open: true
    environment:
      - CHOKIDAR_USEPOLLING=true
      - REACT_APP_SCHEME=${REACT_APP_SCHEME}
      - REACT_APP_BACKEND_PORT=${REACT_APP_BACKEND_PORT}
      - REACT_APP_LARAVEL_ECHO_PORT=${REACT_APP_LARAVEL_ECHO_PORT}
      - REACT_CLIENT_ID=${REACT_CLIENT_ID}
      - REACT_CLIENT_SECRET=${REACT_CLIENT_SECRET}
    labels:
      - traefik.http.routers.https.rule=Host(`${DOMAIN}`)
      - traefik.http.routers.https.entrypoints=https
      #- traefik.http.routers.https.tls=true
      #- traefik.http.routers.https.tls.certresolver=${CERT_RESOLVER}
    networks:
      - frontend
      - backend
    restart: always
    
      ### traefik #####################################################
  traefik:
    image: traefik:latest
    command:

      # Be careful in production as it exposes the traffic you might not want to expose.
      #--log.level=DEBUG

      - --entrypoints.http.address=:80
      - --entrypoints.https.address=:443

      - --providers.docker=true

      - --api=true

      # LetsEncrypt Staging Server - uncomment when testing
      # - --certificatesResolvers.letsencrypt.acme.caServer=https://acme-staging-v02.api.letsencrypt.org/directory

      - --certificatesresolvers.letsencrypt.acme.httpchallenge=true
      - --certificatesresolvers.letsencrypt.acme.httpchallenge.entrypoint=http
      - --certificatesresolvers.letsencrypt.acme.email=${EMAIL}
      - --certificatesresolvers.letsencrypt.acme.storage=/letsencrypt/acme.json
    labels:
      # Redirect all HTTP traffic to HTTPS
      - traefik.http.routers.to-https.rule=HostRegexp(`{host:.+}`)
      - traefik.http.routers.to-https.entrypoints=http
      - traefik.http.routers.to-https.middlewares=to-https

      - traefik.http.routers.traefik.rule=Host(`traefik.${DOMAIN}`)
      - traefik.http.routers.traefik.entrypoints=https
      - traefik.http.routers.traefik.middlewares=auth
      - traefik.http.routers.traefik.service=api@internal
      - traefik.http.routers.traefik.tls=true
      - traefik.http.routers.traefik.tls.certresolver=${CERT_RESOLVER}

      - traefik.http.middlewares.to-https.redirectscheme.scheme=https

    ports:
      - 80:80
      - 443:443
    volumes:
      - ./data/letsencrypt:/letsencrypt
      - /var/run/docker.sock:/var/run/docker.sock:ro
    stdin_open: true
    networks:
      - frontend
      - backend
    restart: always

或者我尝试使用这个配置

version: '3.5'

networks:
  frontend:
    driver: ${NETWORKS_DRIVER}
  backend:
    driver: ${NETWORKS_DRIVER}
  trfk:
    driver: ${NETWORKS_DRIVER}

volumes:
  react:
    driver: ${VOLUMES_DRIVER}
  traefik:
    driver: ${VOLUMES_DRIVER}

services:

  ### react #####################################################
  react:
    image: ${REGISTRY_URL}/react
    ports:
      - "5000:3000"
    stdin_open: true
    environment:
      - CHOKIDAR_USEPOLLING=true
      - REACT_APP_SCHEME=${REACT_APP_SCHEME}
      - REACT_APP_BACKEND_PORT=${REACT_APP_BACKEND_PORT}
      - REACT_APP_LARAVEL_ECHO_PORT=${REACT_APP_LARAVEL_ECHO_PORT}
      - REACT_CLIENT_ID=${REACT_CLIENT_ID}
      - REACT_CLIENT_SECRET=${REACT_CLIENT_SECRET}
    labels:
      - "traefik.enable=true"
      - "traefik.http.routers.react.rule=Host(`MYDOMAIN.COM`)"
      - "traefik.http.routers.react.entrypoints=websecure"
      - "traefik.http.routers.react.tls.certresolver=myresolver"
    networks:
      - frontend
      - backend
      - trfk
    restart: always
    
      ### traefik #####################################################
  traefik:
    image: traefik:latest
    command:
#- "--log.level=DEBUG"
      - "--api.insecure=true"
      - "--providers.docker=true"
      - "--providers.docker.exposedbydefault=false"
      - "--entrypoints.websecure.address=:443"
      - "--certificatesresolvers.myresolver.acme.tlschallenge=true"
      - "--certificatesresolvers.myresolver.acme.email=*MYEMAIL*"
      - "--certificatesresolvers.myresolver.acme.storage=/letsencrypt/acme.json"     
    ports:
#      - 80:80
      - 443:443
      - 8080:8080
    volumes:
      - ./letsencrypt:/letsencrypt
      - /var/run/docker.sock:/var/run/docker.sock:ro
    stdin_open: true
    networks:
      - trfk
    restart: always

我的 docker-compose 在这里。

现在，当我在 Mozilla HTTP 中尝试时，IP 或域的一切都很好。 但是当我尝试 HTTPS（不要在 Mozilla 中禁用）时，我的后端会发送错误。 显然他也尝试在 https 上工作。这就像重定向，但不是反向代理。

我应该怎么做才能让我的 Traefik 站在 React 前面，只接受 443 上的请求，然后通过 HTTP 将它们发送到端口 5000 上做出反应？客户端(HTTPS)-TRAEFIK(HTTPS) <-> TRAEFIK(HTTP)-REACT(HTTP)

Answer 1

您缺少配置中的部分，traefik 知道将请求定向到该部分。您将 traefik 配置为查询 docker API，因此它知道存在哪些容器和端口，但它不知道请求应该发送到反应容器。将此标签添加到反应容器

- traefik.http.routers.https.service=react@docker

要么：

- traefik.http.services.CHOSEN_NAME.loadbalancer.server.port=5000

第一个是更好的解决方案，因为它动态获取反应容器侦听的端口。