Хостинг приложения Angular в Kestrel не работает с Docker - PullRequest
Новая
       13

Хостинг приложения Angular в Kestrel не работает с Docker

0 голосов
/ 28 декабря 2018

У меня есть приложение angular 6, которое размещено на .NET Core сервере. Приложение работает, я могу получить доступ к страницам / маршрутам и т. Д.
Однако, когда я помещаю это приложение .NET в докер и запускаю егоя получаю следующую ошибку: 

GET http://localhost:8400/styles.3bb2a9d4949b7dc120a9.css net::ERR_ABORTED 404 (Not Found)
GET http://localhost:8400/runtime.ec2944dd8b20ec099bf3.js net::ERR_ABORTED 404 (Not Found)

В моем docker изображении я помещаю папку Release .NET App, а в эту папку добавляю: 

-DockerImage
   -Release folder
     - Dockerfile
     - Config `json` file (i am using `Microsoft.Extensions.Configuration`)
     - `dist` folder (angular compiled application)

Dockerfile 

FROM microsoft/dotnet:2.1-aspnetcore-runtime
WORKDIR /app
ADD . /app
ENTRYPOINT [ "dotnet","Deploy.dll"]

Корневой путь . в этом случае - это папка Release, в которой есть элементы, которые я упоминал в верхнем разделе.

Что интригует то, что NET Core зависит от некоторых файлов в папке dist, иначе это может привести к сбою. И это не так, он работает просто отлично.

Startup.cs 

  public void Configure(IApplicationBuilder app, IHostingEnvironment env) {
                if (env.IsDevelopment()) {
                    app.UseDeveloperExceptionPage();
                } else
                    app.UseHsts();
                Config config = this.Configuration.GetSection("Config").Get<Config>();
                Config.Frontend frontend = this.Configuration.GetSection("Config:Frontend").Get<Config.Frontend>();

                string jsroot = Path.Combine(Directory.GetCurrentDirectory(), frontend.PhysicalRoot);
                PhysicalFileProvider provider = new PhysicalFileProvider(jsroot);

                DefaultFilesOptions options = new DefaultFilesOptions() {
                    DefaultFileNames = new List<string> { frontend.DefaultFileName },
                    FileProvider = provider,
                    RequestPath = frontend.RequestPath
                };
                app.UseDefaultFiles(options);

                app.UseStaticFiles();
                app.UseStaticFiles(new StaticFileOptions() {
                    RequestPath = frontend.RequestPath,
                    FileProvider = provider
                });
            }

Index.html (из папки dist) 

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Frontend</title>
  <base href="/">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
<link rel="stylesheet" href="treeview/styles.3bb2a9d4949b7dc120a9.css"></head>
<body>
  <app-root></app-root>
<script type="text/javascript" src="treeview/runtime.ec2944dd8b20ec099bf3.js"></script>
    <script type="text/javascript" src="treeview/polyfills.c6871e56cb80756a5498.js"></script>
    <script type="text/javascript" src="treeview/main.a4ddb95d782e95e34c4a.js"></script>
</body>
</html>

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

{
  "Config": {
    "Frontend": {
      "PhysicalRoot": "./js",
      "RequestPath": "/treeview",
      "DefaultFileName": "index.html"
    },
    "Environment": {
      "ProdEnv": {
        "OwnAddress": {
          "Hostname": "0.0.0.0",
          "Port": 8400
        }
      },
      "DevEnv": {
        "OwnAddress": {
          "Hostname": "0.0.0.0",
          "Port": 8401
        }
      }
    }
  }
}

PS Тип Config в .NET Core App - это просто POCO для Config раздела файла конфигурации.

Контейнер запускается с помощью bash скрипта, который запускает docker-compose

Docker compoe 

version: '3.3'
services:

    front:
      image: ft
      container_name: front0
      build: ./front/publish
      networks:
        - redis-net
      ports:
        - 8400:8400

Script.sh 

    dotnet build -c Release ../${hostServerSrc} >>out.txt  //building the release for the `.NET Server that hosts the angular app`
    dotnet publish -c Release ../${hostServerSrc} --output $(pwd)/${hostServerDest} >>out.txt  //publshing it to the folder that will be injected in the image
    cp  ./Configs/hostConfig.json ./front/publish  //copying the config file for the `.NET App`
    cp  -r ../${ngSrc}  ./front/publish/js //copying the angular compiled app

    docker-compose up --build  -d >>out.txt

PS 2 Кажется, он не может найти файл в папке js. Request URL: http://localhost:8400/runtime.js.

В докереКонтейнер У меня есть все файлы в папке js.Это может быть из-за того, что в докере больше нет localhost?

1 Ответ

0 голосов
/ 28 декабря 2018

Все выглядит хорошо, кроме одного пункта для меня.

Вы хотите, чтобы ваш контейнер присоединился к redis-net сети: 

  networks:
    - redis-net

, но я не вижу этой сети, определенной в вашем docker-composeфайл.

Попробуйте одно из следующих действий:

Добавьте определение сети в docker-compose: 

version: '3.3'
services:
    front:
      image: ft
      container_name: front0
      build: ./front/publish
      networks:
        - redis-net
      ports:
        - 8400:8400
networks:
  redis-net:

Или удалите эту строку - docker-compose создаст сеть с блестящими мостами по умолчаниюдля вас, который работает отлично.Если вы не планируете выполнять ручные манипуляции с сетью, это отличный выбор. 

version: '3.3'
services:
    front:
      image: ft
      container_name: front0
      build: ./front/publish
      ports:
        - 8400:8400
...