nginx运行纯前端静态资源（mock数据的项目或者纯HTML文件）

最新推荐文章于 2024-07-24 17:39:13 发布
最新推荐文章于 2024-07-24 17:39:13 发布
阅读量488 收藏 1
点赞数
文章标签： 前端 javascript vue.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45288172/article/details/130602326
版权

一、下载好nginx

在这里插入图片描述

二、点击nginx.exe运行程序，点击后弹出黑框就是正在运行了

在这里插入图片描述

三、将打包后的项目dist文件（或者你的其他静态资源文件）复制粘贴进html文件夹中

在这里插入图片描述
在这里插入图片描述

四、在浏览器中输入localhost，按回车，就能打开我们想要运行的静态资源文件啦~

在这里插入图片描述
运行成功！
在这里插入图片描述

不爱吃饭爱吃菜
关注
Nginx与前端开发
静水流深
12-10 1455
Nginx与node.js “Nginx是一款轻量级的HTTP服务器，采用事件驱动的异步非阻塞处理方式框架，这让其具有极好的IO性能，时常用于服务端的反向代理和负载均衡。” ​ 作为前端开发，即使没用过Nginx，但一定听说过上面这句话。这句经典的话，基本构成了所有人对Nginx的第一印象。 Nginx发布于2004年，经过初期几年的沉淀之后，迅速蹿升为“网红”，成为了当年互联网技术圈最火的...
nginx发布前端静态文件配置
02-17
nginx发布前端静态文件配置
Nginx的使用（一）代理静态文件
热门推荐
小郎人的博客
05-21 2万+
Nginx的使用（一）代理静态文件 1、为什要使用Nginx代理静态文件？这个问题去看静态资源快速加载。 2、作为后端服务器中间件，Tomcat是绝大多数Java程序员的选择。但是Tomcat处理请求的能力固然很强大，但是作为静态资源代理的话，我们每次这么大的IO吞吐，我只能说：“廉颇老矣，尚能饭否？”。 3、我们怎么解决这个问题呢静态资源访问这个问题呢，那...
前端静态资源的动态访问
最新发布
m0_68716504的博客
07-24 258
Vite脚手架在打包代码的时候，会把源代码里对于静态资源的访问路径转换为打包后静态资源文件的路径。主要的区别是文件指纹，即打包后的文件会带上一个hash值，用于区分不同版本的文件。当前端项目更新之后，重新打包、部署，由于文件指纹的存在，客户端检测到文件名不同，则会下载新版的文件。如果没有文件指纹，且新旧版文件名一致，客户端会读缓存，而不能及时地拿到新版文件。
解决前端vue打包之后，在没有登录的情况下能访问静态资源
weixin_41639609的博客
04-18 449
这里的静态资源显示的内容解决方法：（1）通过请求接口返回数据流，前端在进行转换，然后在进行下载、
SpringBoot项目中前端页面通过URL访问本地文件夹（访问静态文件）
bobozai86的博客
12-03 3499
前端页面通过URL访问本地文件夹 因为SpringBoot项目中使用的嵌入Tomcat，所以前端页面不能像以前那样直接将从Tomcat很目录访问文件。解决办法：继承WebMvcConfigurer接口对访问URL进行拦截，然后将访问文件的URL映射至本地文件夹 在application.yml中添加配置 首先在本地创建文件夹 accessFile: resourceHandler: /show/** #匹配需要拦截的URL location: E:/tomcat/virtical/
vue 文件目录结构详解
11-26
接口方面，前端通过mock数据在开发阶段进行模拟，而实际部署时通过nginx等服务器配置区分前端页面和后端接口请求。 12. **接口Mock** - 在开发时，可以通过`mock`目录下的文件模拟接口数据。在express开发服务器中...
智慧商城前端项目总结和源代码
06-08
了解如何配置Nginx服务器，使用CDN加速静态资源，以及监控和日志记录都是前端开发者必备的技能。 这个智慧商城前端项目是一个全面的实践平台，涵盖了前端开发的诸多方面，无论是初学者还是经验丰富的开发者，都能...
Real_Estate_Mock_Page：完整的模拟Django项目
02-09
"Real_Estate_Mock_Page：完整的模拟Django项目"是一个基于Django框架构建的Web应用程序，旨在模拟房地产网站的功能。这个项目提供了学习和实践Django基础以及Web开发技能的良好平台。Django是一个用Python编写的...
前端开发mock数据 nginx+json-server+faker
赵忠洋的博客
06-09 4125
nginx配置 前端反向代理前言因为需要本地开发模拟线上环境，所以应用json-server mock数据通过nginx配置反向代理反向代理，通过修改host 来绑定域名。通过查找多篇文档配置成功。 下载nginx因为我是mac环境下开发，所有用brew下载 $ brew install nginx # 安装完成后会看到 # /usr/local/etc/nginx/nginx.conf 配置 #...
Nginx部署前端静态资源(windows)
weixin_55530488的博客
02-15 1675
Nginx部署前端静态资源(windows)
如何快速搭建静态资源服务器
weixin_33858249的博客
10-22 749
前端开发中，经常遇到有些场景需要用到服务器环境，例如AngularJS中的路由，或者是模拟ajax获取数据等需求时，这个时候并不需要考虑到服务端逻辑，只是搭建简单的静态资源服务，因此解决方法有很多，下面介绍几种简单快捷的常用方式： 使用http-server 如果你安装了node，那么http-server就是个不错的选择，只需要一行命令就可以快速启动。 安装： npm install -g ht...
【netstub】(一）基于nginx反向代理实现客户端mock
be5yond的博客
12-08 2802
1. 背景 目前app前端测试，需要抓包查看接口数据，采用charles进行代理，进行数据抓包。 需要mock数据的话，使用charles的 Map Local功能。 问题 ①mock数据共享比较麻烦，同一接口只能mock 1个返回。 ② 数据中有加密字段，需要手动粘贴出来进行处理，才能查看数据 ③ https 安装证书步骤繁琐，部分机型需要特殊处理 2.目标 期望开发一个mock工具，可以支持https抓包，同API可配置返回不同的数据，抓包数据支持预处理，如可以解密数据字段。 3..
Nginx mock配置示例
a200822146085的博客
05-05 465
本文记录了借助Nginx高并发能力，实现接口mock并发压测。
nginx挂载前端静态文件
lin_lzc的博客
06-21 190
【代码】nginx挂载前端静态文件。
mock数据模拟和使用
weixin_30677073的博客
07-07 379
写入mockbase.js : 使用: 转载于:https://www.cnblogs.com/kaijiangyugty/p/11146321.html
如何部署一个高性能mock服务
洛水之风的博客
11-14 761
如何部署一个高性能mock服务
SpringBoot访问静态资源和jar外部静态资源，部署前端打包后的vue项目放入静态资源里
蚂蚁舞
04-19 6919
记录一下使用SpringBoot访问静态资源和SpringBoot打包之后的jar外部静态资源，部署前端打包后的vue项目放入静态资源里。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值