使用NginX提供Angular应用程序服务

3
我是一名有用的助手,可以进行文本翻译。
我有一个 Angular 应用程序,其结构如下。 通常我使用 express 服务器来提供 Angular 应用程序,但是这次我需要在 digitalocean 实例上使用 nginx 部署。我对 nginx 不太了解,不知道它是如何工作的。我有一个初始结构,大致如下:
Nginx 配置
server {
        listen 80;

        root /var/www/webclient.com/dist;

        index index.html;

        server_name domain.com www.domain.com;

        location / {
                proxy_pass http://134.435.11.92:3000;
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection 'upgrade';
                proxy_set_header Host $host;
                proxy_cache_bypass $http_upgrade;
        }
}
server {
        listen 80;

        server_name api.domain.com;

        location / {
                proxy_pass http://134.435.11.92:8080;
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection 'upgrade';
                proxy_set_header Host $host;
                proxy_cache_bypass $http_upgrade;
        }
}

目录结构(dist 文件夹)
├── 404.html
├── cloudwave.css
├── cloudwave.js
├── favicon.ico
├── fonts
│   ├── FontAwesome.otf
│   ├── fontawesome-webfont.eot
│   ├── fontawesome-webfont.svg
│   ├── fontawesome-webfont.ttf
│   ├── fontawesome-webfont.woff
│   └── ufonts.com_tw-cen-mt.ttf
├── images
│   ├── blog
│   │   ├── blog-bg.jpg
│   │   ├── blog-img-1.jpg
│   │   ├── blog-img-2.jpg
│   │   ├── blog-img-3.jpg
│   │   ├── blog-img-4.jpg
│   │   ├── blog-img-5.jpg
│   │   ├── blog-img-6.jpg
│   │   ├── blog-img-thumb-1.jpg
│   │   └── blog-img-thumb-2.jpg
│   ├── cooker-img.png
│   ├── fashion_room.jpg
│   ├── header.jpg
│   ├── logo-orig.png
│   ├── logo.png
│   ├── overlay-pattern.png
│   ├── overlay-pattern2.png
│   ├── photo
│   │   ├── photo-1.jpg
│   │   ├── photo-2.jpg
│   │   ├── photo-3.jpg
│   │   └── photo-4.jpg
│   ├── slider
│   │   ├── slider-img-1.jpg
│   │   ├── slider-img-2.jpg
│   │   ├── slider-img-3.jpg
│   │   └── slider-img-4.jpg
│   ├── subscribe-bg.jpg
│   └── top_bg.jpg
├── index.html
├── robots.txt
├── scripts.js
└── templates.js

第二个服务器块运行了一个节点服务器,我已经让它工作了。但是问题出在第一个服务器上。 我该如何配置nginx以便提供所呈现的目录结构中的内容? 谢谢 :)
1个回答

2
你需要删除第一个 server 块中的整个 location 块。这是用于代理的,不是你想要的。然后你需要将根目录设置为你想要提供服务的文件的根目录路径。
看起来这已经是你想要的了。所以访问 www.domain.com/images/logo.png 应该会提供文件 /var/www/webclient.com/dist/images/logo.png

那么像这样的东西就足够了吗?服务器 { 监听 80; 根目录 /var/www/webclient.com/dist; 默认文件 index.html; 服务器名称 domain.com www.domain.com;} - SamAko
我认为是这样的@T.Rex,尽管我不记得确切的配置语法。你试过了吗? - jwg
还没有机会尝试,但我很快会尝试。 - SamAko

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接