Nginx 上的静态网页 Docker 缺少容器 CSS

Question

我正在尝试使用 Nginx 在 docker 容器上托管 Swagger UI。

当我通过 hostAddress.com 访问我的网页时，它 returns 网页为纯文本并检查它告诉我它找不到任何 javascript 或 css 文件尽管它们似乎存在于容器中，因为我已经通过 ssh 进入容器进行检查。

我的docker文件

FROM nginx
COPY src /usr/share/nginx/html
COPY config/nginx.conf /etc/nginx
EXPOSE 80

nginx.config

events {
  worker_connections  4096;  ## Default: 1024
}

http {
  server {
listen       80;
server_name  localhost;
root   /usr/share/nginx/html;
index  index.html index.htm;
include /etc/nginx/mime.types;


  location /swagger {
  try_files $uri /index.html;
}

#Static File Caching. All static files with the following extension will be cached for 1 day
location ~* .(jpg|jpeg|png|gif|ico|css|js)$ {
  expires 1d;
    }
  }
}

Answer 1

在这里你可以做些什么来实现这一目标。

就像评论中提到的那样，您可以从以下位置下载工件 https://github.com/ianneub/docker-swagger-ui/blob/master

创建一个目录说 ngix
复制Dockerfile, run.sh到那个目录
编辑 Dockerfile 进行您需要更改位置的自定义，如下所示：

FROM nginx:1.9

ENV SWAGGER_UI_VERSION 2.1.2-M2
ENV URL **None**

RUN apt-get update \
    && apt-get install -y curl \
    && curl -L https://github.com/swagger-api/swagger-ui/archive/v${SWAGGER_UI_VERSION}.tar.gz | tar -zxv -C /tmp \
    && mkdir /usr/share/nginx/html/swagger \
    && cp -R /tmp/swagger-ui-${SWAGGER_UI_VERSION}/dist/* /usr/share/nginx/html/swagger \
    && rm -rf /tmp/*

COPY run.sh /run.sh

CMD ["/run.sh"]

如果将上述更改与原始 Dockerfile 进行比较，第 9 行和第 10 行进行了更改以包含其他路径，即 swagger。当然，您可以根据需要进行更改。

下一步，运行以下 docker 命令构建和运行

构建映像：

docker build -t myswagger .

运行这

docker run -it --rm -p 3000:80 --name testmyswagger -e "URL=http://petstore.swagger.io/v2/swagger.json" myswagger

现在您应该可以使用 http://localhost:3000/swagger/index.html

访问您的 swagger

Nginx 上的静态网页 Docker 缺少容器 CSS

Static webpage on Nginx Docker Container Missing CSS

css

nginx

swagger

docker