当前位置: 首页 > news >正文

如何在 Nginx Proxy Manager(NPM)上部署静态网站

前言

众所周知,我们在之前介绍过 Nginx Proxy Manager(以下简称 NPM) 这个反向代理的神器,对于一些 Docker 搭建的 Web 项目,NPM 能够很轻松地给他们做反向代理。

然而对于一些静态网站,小伙伴们可能不知道怎么用 NPM 来展示,这篇文章就来简单和大家分享一下,如何用 NPM 来托管一些简单的 HTML 单页。

操作步骤

因为我们已经有 NPM 在运行,监听了 443 端口和 80 端口,避免为了一个静态网站而建立另一个 Web 服务器。

托管一些简单的 HTML 单页是一个简单的、低流量的需求,使用 NPM 已经运行的内置 NGINX 就可以了。

这个是我的 NPM 的 docker-compose 文件:

BASH

version: "3"
services:app:image: 'jc21/nginx-proxy-manager:latest'restart: unless-stoppedports:# These ports are in format <host-port>:<container-port>- '80:80' # Public HTTP Port- '443:443' # Public HTTPS Port- '81:81' # Admin Web Port# Add any other Stream port you want to expose# - '21:21' # FTPenvironment:DB_MYSQL_HOST: "db"DB_MYSQL_PORT: 3306DB_MYSQL_USER: "npm"DB_MYSQL_PASSWORD: "npm"DB_MYSQL_NAME: "npm"# Uncomment this if IPv6 is not enabled on your host# DISABLE_IPV6: 'true'volumes:- ./data:/data- ./letsencrypt:/etc/letsencryptdepends_on:- dbdb:image: 'jc21/mariadb-aria:latest'restart: unless-stoppedenvironment:MYSQL_ROOT_PASSWORD: 'xxx'MYSQL_DATABASE: 'xxx'MYSQL_USER: 'xxx'MYSQL_PASSWORD: 'xxx'volumes:- ./data/mysql:/var/lib/mysql

可以看到,在 docker-compose.yml 文件里面,我们挂载了一个./data 的文件夹,这个就是指在 docker-compose.yml 所在的文件夹里面的 data 文件夹,

image-20220313215238703

我们要做的,就是在这个 data 文件夹里面放我们的静态 html 文件。

具体操作如下:

1、在你挂载的 data 文件夹里面创建一个新的文件夹,比如 mkdir /root/data/docker-data/npm/data/demo10.gao.ee

image-20220313220644530

2、把带有 html 文件的内容放到这个文件夹里面

image-20220313220755911

3、登陆 NPM,在网页里新建一个 Proxy Host

image-20220313220853599

4、配置参数

image-20220313220956132

image-20220313221045094

5、在 Advanced 这一栏填入下面的配置:

image-20220313221248089

NGINX

location / {root /data/demo10.gao.ee;  # 修改成你自己刚刚创建的目录,只需要改demo10.gao.ee这部分就可以了
}

注意:第一次输入保存可能会失效,请再次点开编辑,然后点确定,确保这边内容输入进去了。

6、确保你的域名已经解析到了这台装有 NPM 的服务上了

image-20220313220830583

7、浏览网页(这里是 demo10.gao.ee),确保配置成功了!

image-20220313221552303

这边乱码了,我修改一下内容:

image-20220313221654247

image-20220313221718216

搞定!

8、接下来,如果要修改内容,就到之前的文件夹里面修改就行(我这里是 /root/data/docker-data/npm/data/demo10.gao.ee

相关文章:

如何在 Nginx Proxy Manager(NPM)上部署静态网站

前言 众所周知&#xff0c;我们在之前介绍过 Nginx Proxy Manager&#xff08;以下简称 NPM) 这个反向代理的神器&#xff0c;对于一些 Docker 搭建的 Web 项目&#xff0c;NPM 能够很轻松地给他们做反向代理。 然而对于一些静态网站&#xff0c;小伙伴们可能不知道怎么用 NP…...

http的几种方法

http的几种方法在 rfc2616 中进行了定义&#xff1a; https://www.rfc-editor.org/rfc/rfc2616.html#page-51 HEAD方法&#xff1a;HEAD方法和GET方法相同&#xff0c;只不过服务端只返回头&#xff0c;不返回消息体。GET方法&#xff1a;用于获取资源POST方法&#xff1a;用于…...

var、let、const关键字的特性,以及let、const暂时性死区的作用

var、let和const都是JavaScript中的关键字&#xff0c;用于声明变量。 var关键字声明的变量是函数作用域或全局作用域的&#xff0c;它在整个函数或全局范围内都是可用的。var没有块级作用域。 let关键字声明的变量是块级作用域的&#xff0c;它只在包含它的代码块中可用。le…...

IDEA 高分辨率卡顿优化

VM设置优化 -Dsun.java2d.uiScale.enabledfalse 增加该条设置&#xff0c;关闭高分切换 https://intellij-support.jetbrains.com/hc/en-us/articles/115001260010-Troubleshooting-IDE-scaling-DPI-issues-on-Windows​intellij-support.jetbrains.com/hc/en-us/articles/1…...

【AIGC】一起学习prompt提示词(4/4)【经典】【15种提示词技巧】

写的时候并没有设计好&#xff0c;要做多少期&#xff0c;还是有始有终的比较好&#xff0c;为了方便阅读&#xff0c;我把之前的3期&#xff0c;改下名字&#xff0c;放到这里。 【AIGC】一起学习prompt提示词&#xff08;1/4&#xff09; 内容摘要&#xff1a;提示词是什么…...

Linux实战一天一个小指令--《文件管理/文件查找》

阿丹&#xff1a; 作为一个java程序员进行实战开发不接触linux操作系统基本上是不可能的&#xff0c;所以这个专题就出现了&#xff0c;本文章重点解决大家关于文件管理以及文件查找查看的疑惑。我将采用语法基础用法并在下面进行高级语法的总结使用&#xff0c;方便大家学习和…...

CocosCreator3.8神秘面纱 CocosCreator 项目结构说明及编辑器的简单使用

我们通过Dashboard 创建一个2d项目&#xff0c;来演示CocosCreator 的项目结构。 等待创建完成后&#xff0c;会得到以下项目工程&#xff1a; 一、assets文件夹 assets文件夹&#xff1a;为资源目录&#xff0c;用来存储所有的本地资源&#xff0c;如各种图片&#xff0c;脚本…...

JJJ:python学习笔记

p4 没有编译的过程 源码和输入得到输出 静态语言&#xff1a;编译型 脚本语言&#xff1a;解释型 p5 又叫做胶水语言 p7 p8 p10...

SpringSecurity6从入门到上天系列第七篇:讲明白SpringBoot的自动装配完善上篇文章中的结论

文章目录 一&#xff1a;SpringBoot的自动装配 1&#xff1a;从run方法到入口类内容被注册到注解解读器中。 2&#xff1a;解析入口类注解到加载Bean实例 大神链接&#xff1a;作者有幸结识技术大神孙哥为好友&#xff0c;获益匪浅。现在把孙哥视频分享给大家。 孙哥链接&am…...

ClickHouse 原理解析之基础知识总结

ClickHouse 基础知识整理 参考ClickHouse 官方文档:https://clickhouse.com/docs/en/intro 一:行式存储和列式存储 1.行式存储和列式存储的区别 1.1 概念说明 行式存储:指存储结构化数据时,在底层的存储介质上,数据是以行的方式来组织的,即存储完一条记录的所有字段,再…...

最小花费——最短路

在 n 个人中&#xff0c;某些人的银行账号之间可以互相转账。这些人之间转账的手续费各不相同。给定这些人之间转账时需要从转账金额里扣除百分之几的手续费&#xff0c;请问 A 最少需要多少钱使得转账后 B 收到 100 元。 输入格式 第一行输入两个正整数 n,m&#xff0c;分别表…...

Spark DataFrame join后移除重复的列

在Spark&#xff0c;两个DataFrame做join操作后&#xff0c;会出现重复的列。例如&#xff1a; Dataset<Row> moviesWithRating moviesDF.join(averageRatingMoviesDF,moviesDF.col("movieId").equalTo(averageRatingMoviesDF.col("movieId")));其s…...

NextJS工程部署到阿里云linux Ecs

nextjs项目有多种部署方式&#xff0c;本文介绍最简单的一种方式&#xff0c;将源码上传到云服务器&#xff0c;编译后使用pm2后台运行nextjs工程。 检查node、npm是否安装 查看npm版本&#xff0c;如果版本较低先升级npm版本 npm -v卸载 yum remove nodejs npm -y安装新版…...

汽车以太网IOP测试新利器

IOP测试目的 汽车以太网物理层IOP&#xff08;Interoperability &#xff09;测试&#xff0c;即测试被测对象以太网物理层之间的互操作性。用于验证车载以太网PHY能否在有限时间内建立稳定的链路&#xff1b;此外&#xff0c;还用于验证车载以太网PHY可靠性相关的诊断特性&am…...

高防IP是什么?如何隐藏源站IP?如何进行防护?

高防IP是针对互联网服务器遭受大流量的DDoS攻击后导致服务不可用的情况下,推出的付费增值服务。用户在数据不转移的情况下,就可以通过配置高防IP , 将攻击流量引流到高防|P,确保源站的稳定可靠。高防IP采用的技术手段包括DDoS防护、WAF ( Web应用程序防火墙)等,它能够有效抵御来…...

ElasticSearch---查询es集群状态、分片、索引

查看es集群状态&#xff1a; curl -XGET http://localhost:9200/_cat/health?v如果?后面加上pretty&#xff0c;能让返回的json格式化。 加上?v的返回结果&#xff0c;如下&#xff1a; epoch timestamp cluster status node.total node.data shards pri rel…...

Angular 使用教程——基本语法和双向数据绑定

Angular 是一个应用设计框架与开发平台&#xff0c;旨在创建高效而精致的单页面应用 Angular 是一个基于 TypeScript 构建的开发平台。它包括&#xff1a;一个基于组件的框架&#xff0c;用于构建可伸缩的 Web 应用&#xff0c;一组完美集成的库&#xff0c;涵盖各种功能&…...

【ASP.NET】Hello World

文章目录 1. 几个概念2. 搭建开发环境2.1 .NET SDK2.2 IDE & Editor 3 First Project3.1 步骤3.2 模板3.3 项目结构3.4 请求的处理流程 Reference Link 1. 几个概念 .NET 是一个平台&#xff0c;包括 .NET Framework、.NET Core、ASP.NET、C#等&#xff0c;可以构建桌面、W…...

AI创作系统ChatGPT网站源码+支持最新GPT-Turbo模型+支持DALL-E3文生图/AI绘画源码

一、AI创作系统 SparkAi创作系统是基于OpenAI很火的ChatGPT进行开发的Ai智能问答系统和Midjourney绘画系统&#xff0c;支持OpenAI-GPT全模型国内AI全模型。本期针对源码系统整体测试下来非常完美&#xff0c;可以说SparkAi是目前国内一款的ChatGPT对接OpenAI软件系统。那么如…...

C#_查找图片(按键精灵找图)

一、class internal class Picture{/// <summary>/// 查找图片&#xff0c;不能镂空/// </summary>/// <param name"subPic"></param>/// <param name"searchRect">如果为empty&#xff0c;则默认查找整个图像</param>…...

深度学习在微纳光子学中的应用

深度学习在微纳光子学中的主要应用方向 深度学习与微纳光子学的结合主要集中在以下几个方向&#xff1a; 逆向设计 通过神经网络快速预测微纳结构的光学响应&#xff0c;替代传统耗时的数值模拟方法。例如设计超表面、光子晶体等结构。 特征提取与优化 从复杂的光学数据中自…...

WordPress插件:AI多语言写作与智能配图、免费AI模型、SEO文章生成

厌倦手动写WordPress文章&#xff1f;AI自动生成&#xff0c;效率提升10倍&#xff01; 支持多语言、自动配图、定时发布&#xff0c;让内容创作更轻松&#xff01; AI内容生成 → 不想每天写文章&#xff1f;AI一键生成高质量内容&#xff01;多语言支持 → 跨境电商必备&am…...

Spring AI 入门:Java 开发者的生成式 AI 实践之路

一、Spring AI 简介 在人工智能技术快速迭代的今天&#xff0c;Spring AI 作为 Spring 生态系统的新生力量&#xff0c;正在成为 Java 开发者拥抱生成式 AI 的最佳选择。该框架通过模块化设计实现了与主流 AI 服务&#xff08;如 OpenAI、Anthropic&#xff09;的无缝对接&…...

Bean 作用域有哪些?如何答出技术深度?

导语&#xff1a; Spring 面试绕不开 Bean 的作用域问题&#xff0c;这是面试官考察候选人对 Spring 框架理解深度的常见方式。本文将围绕“Spring 中的 Bean 作用域”展开&#xff0c;结合典型面试题及实战场景&#xff0c;帮你厘清重点&#xff0c;打破模板式回答&#xff0c…...

Windows电脑能装鸿蒙吗_Windows电脑体验鸿蒙电脑操作系统教程

鸿蒙电脑版操作系统来了&#xff0c;很多小伙伴想体验鸿蒙电脑版操作系统&#xff0c;可惜&#xff0c;鸿蒙系统并不支持你正在使用的传统的电脑来安装。不过可以通过可以使用华为官方提供的虚拟机&#xff0c;来体验大家心心念念的鸿蒙系统啦&#xff01;注意&#xff1a;虚拟…...

高效的后台管理系统——可进行二次开发

随着互联网技术的迅猛发展&#xff0c;企业的数字化管理变得愈加重要。后台管理系统作为数据存储与业务管理的核心&#xff0c;成为了现代企业不可或缺的一部分。今天我们要介绍的是一款名为 若依后台管理框架 的系统&#xff0c;它不仅支持跨平台应用&#xff0c;还能提供丰富…...

Android屏幕刷新率与FPS(Frames Per Second) 120hz

Android屏幕刷新率与FPS(Frames Per Second) 120hz 屏幕刷新率是屏幕每秒钟刷新显示内容的次数&#xff0c;单位是赫兹&#xff08;Hz&#xff09;。 60Hz 屏幕&#xff1a;每秒刷新 60 次&#xff0c;每次刷新间隔约 16.67ms 90Hz 屏幕&#xff1a;每秒刷新 90 次&#xff0c;…...

CSS 工具对比:UnoCSS vs Tailwind CSS,谁是你的菜?

在现代前端开发中&#xff0c;Utility-First (功能优先) CSS 框架已经成为主流。其中&#xff0c;Tailwind CSS 无疑是市场的领导者和标杆。然而&#xff0c;一个名为 UnoCSS 的新星正以其惊人的性能和极致的灵活性迅速崛起。 这篇文章将深入探讨这两款工具的核心理念、技术差…...

未授权访问事件频发,我们应当如何应对?

在当下&#xff0c;数据已成为企业和组织的核心资产&#xff0c;是推动业务发展、决策制定以及创新的关键驱动力。然而&#xff0c;未授权访问这一隐匿的安全威胁&#xff0c;正如同高悬的达摩克利斯之剑&#xff0c;时刻威胁着数据的安全&#xff0c;一旦触发&#xff0c;便可…...

window 显示驱动开发-如何查询视频处理功能(三)

​D3DDDICAPS_GETPROCAMPRANGE请求类型 UMD 返回指向 DXVADDI_VALUERANGE 结构的指针&#xff0c;该结构包含特定视频流上特定 ProcAmp 控件属性允许的值范围。 Direct3D 运行时在D3DDDIARG_GETCAPS的 pInfo 成员指向的变量中为特定视频流的 ProcAmp 控件属性指定DXVADDI_QUER…...