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

Question

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

当我通过hostAddress.com访问我的网页时，它以纯文本格式返回该网页，并检查它告诉我，尽管它们似乎已出现在容器中，但找不到任何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

在这里您可以做到的。

就像提到评论一样，您可以从以下位置下载 Artifact
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访问您的招摇