VueJS: относительные ресурсы не работают за обратным прокси - PullRequest
Новая
       81

VueJS: относительные ресурсы не работают за обратным прокси

0 голосов
/ 31 октября 2019

Intro

Я обслуживаю все типы контейнеров (докер) за обратным прокси-сервером (traefik 2.0), например, серверные приложения (nodejs) или приложения внешнего интерфейса (vuejs). На самом деле, я пытаюсь обслуживать VueJS по пути, подобному https://localhost/my-app.

Что я ожидаю

  • Traefik, перенаправляющим /my-app на мой контейнер vuejs
  • Приложение VueJS работает без ошибок.
  • Приложение VueJS загружает ресурсы с относительными путями, такими как <link href=css/app.css>.

Что у меня вместо этого

  • Приложение VueJS не работает, потому чтонеправильно получает ресурсы.
  • Я получаю только index.html (корневая страница VueJS) за https://localhost/my-app
  • Мой браузер пытается получить относительные ресурсы на https://localhost/css/app.css вместо https://localhost/my-app/css/app.css У вас есть идея, как обслуживать VueJS с относительными ресурсами за моим перенаправлением /my-app

Файлы конфигурации

См. Файлы конфигурации ниже.

docker-compose.yml 

version: "3.7"

services:
  vuejs:
    restart: always
    build:
      context: .
      dockerfile: ./Dockerfile
    image: my-vuejs-app:latest
    labels:
      - "traefik.enable=true"
      - "traefik.http.routers.my-app-router.rule=PathPrefix(`/my-app`)"
      - "traefik.http.routers.my-app-router.tls=true"
      - "traefik.http.middlewares.path-strip.stripprefixregex.regex=^/[a-zA-Z0-9_.-]+"
      - "traefik.http.routers.my-app-router.middlewares=path-strip@docker"

vue.config.js 

module.exports = {
  publicPath: './'
}

1 Ответ

0 голосов
/ 04 ноября 2019

Я нашел решение, я использую промежуточное ПО, которое добавляет / в конце запроса, вот так относительные ресурсы загружаются, как и ожидалось.

См. Мои ярлыки (для traefik)в моем сервисе докеров: 

      - "traefik.enable=true"
      - "traefik.http.routers.my-app-router.tls=true"
      - "traefik.http.routers.my-app-router.rule=PathPrefix(`/my-app`)"
      - "traefik.http.middlewares.test-redirectregex.redirectregex.regex=^(https|http)://([a-zA-Z0-9_.-]+)/([a-zA-Z0-9_.-]+)$$"
      - "traefik.http.middlewares.test-redirectregex.redirectregex.replacement=$${1}://$${2}/$${3}/"
      - "traefik.http.routers.my-app-router.middlewares=test-redirectregex@docker,path-strip@file"
...