图片/css/js 文件在 docker 容器上不可用答案

【问题标题】：Images/css/js files not available on docker container图片/css/js 文件在 docker 容器上不可用
【发布时间】：2019-12-09 02:05:57
【问题描述】：

我正在学习微服务概念并将 Docker 用于这些目的。我有 3 个容器：

mssqlserver - 我的数据库
asp-net-core:2.0 - 用于我的微服务（目前只有 1 个）
asp-net-core:2.0-MVC 这些之间存在连接，因此这不是问题的原因。 MVC 包含 wwwroot 目录，其中放置图像（横幅等）、css 和 .js 文件。我已经检查过它们是否在我的 docker 容器上（在容器上运行 /bin/bash 并检查过）。但不知何故，我的 .cshtml 文件看不到这些文件。

MVC 项目的 Dockerfile：

FROM microsoft/aspnetcore-build:2.0 AS build-env
WORKDIR /app

# copy csproj and restore as distinct layers
COPY *.csproj ./
RUN dotnet restore

# copy everything else and build
COPY . ./

RUN dotnet publish -c Release -o out

# build runtime image
FROM microsoft/aspnetcore:2.0
WORKDIR /app
COPY --from=build-env /app/out .
EXPOSE 80/tcp
ENTRYPOINT ["dotnet", "MVC.dll"]

码头工人撰写：

version: "3.2"

networks:
  frontend:
  backend:


services:

  webmvc:
    build: 
      context: .\src\Web\MVC
      dockerfile: Dockerfile
    environment: 
      - ASPNETCORE_ENVIRONMENT=Development 
      - CatalogUrl=http://catalog
    container_name: webshop
    ports:
      - "5500:80"
    networks:
      - frontend 
    depends_on:
      - catalog

  catalog:
    build:
        context: .\src\Services\ProductCatalogApi
        dockerfile: Dockerfile
    image: microservices-v1.0.0
    environment:
        - DatabaseServer=mssqlserver
        - DatabaseName=CatalogDb
        - DatabaseUser=sa
        - DatabaseUserPassword=ProductApi(!)
    container_name: catalogapi
    ports:
        - "5000:80"
    networks:
        - backend
        - frontend
    depends_on:
        - mssqlserver

  mssqlserver:
    image: "microsoft/mssql-server-linux:latest"
    ports:
        - "2200:1433"
    container_name: mssqlcontainer
    environment:
        - ACCEPT_EULA=Y
        - SA_PASSWORD=ProductApi(!)
    networks:
        - backend

图片使用示例（在Index.cshtml中）：

<img src="~/images/banner.jpg" alt="ASP.NET" class="img-responsive" />

我尝试过不同的图像路径组合，例如：

<img src="wwwroot/images/banner.jpg" alt="ASP.NET" class="img-responsive" />
<img src="~/app/wwwroot/images/banner.jpg" alt="ASP.NET" class="img-responsive" />
<img src="app/wwwroot/images/banner.jpg" alt="ASP.NET" class="img-responsive" />

这些都不起作用。

【问题讨论】：

标签： asp.net asp.net-mvc docker asp.net-core

【解决方案1】：

您很可能未能在 ASP.NET Core 项目中启用静态文件中间件。在Startup.Configure 中，您需要以下行：

app.UseStaticFiles();

默认情况下，wwwroot 将作为您网站的文档根目录，因此您可以通过以下方式在静态文件中引用：

<img src="~/images/banner.jpg" />

这将对应于wwwroot/images/banner.jpg 处的文件。

【讨论】：