首页 > 解决方案 > Nginx 不代理 css js 字体文件(总是返回 index.html)

问题描述

在按位置分隔的一堆服务之前有一个 Nginx 作为代理:

include mime.types;

location / {
    proxy_pass http://127.0.0.1:4200$request_uri;
    proxy_set_header Host $host;
}

location /api/ {
    proxy_pass http://127.0.0.1:8080$request_uri;
    proxy_set_header Host $host;
}

location /landing/ {
    proxy_pass http://127.0.0.1:3333$request_uri;
    proxy_set_header Host $host;
}

每个位置都链接到 docker 容器。在端口4200- 部署的 Angular 应用程序,在端口8080- Java Spring 应用程序,在3333静态网站上。

location /landing/问题。不代理 CSS 和 JS 文件。它返回index.html而不是任何资产文件。当我打电话时http://myip/landing:3333- 一切正常,但是当我使用时,http://myip/landing:80我(通过代理移动)得到了一个没有任何 CSS 和 JS 的登陆网站。Angular 应用程序可以正确处理所有文件。

哪里出错了,我该如何解决?

CSS 连接如下:

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="./css/style.css">
</head>

JS连接:

<body>
    ...
    <script src="./js/main.js"></script>
</body>

字体连接:

@font-face {
  font-family: "din-next-w01";
  font-style: normal;
  font-display: swap;
  font-weight: 300;
  src: url("../fonts/DINNextW01-Light.woff2") format("woff2"), url("../fonts/DINNextW01-Light.woff") format("woff");
}

图片连接

<img src="./img/chart.png" alt="Chart">

文件夹结构:

landing
    index.html
    css/style.css
    fonts/DINNextW01-Light.woff
    img/
    js/main.js

标签: nginx

解决方案


推荐阅读