1.直接部署静态页面项目代码只有一个index.html将网站文件放在nginx的www目录中即可访问浏览器查看效果浏览器查看源代码总结：1.跳转新页面，浏览器要重新发起请求，网速慢的时候用户体验不好。2.用户能直接查看到代码，安全性不足。2.单页面应用使用vue router创建一个单页面应用同样，直接放到nginx的www中浏览器查看效果浏览器查看源代码总结：1.单页面应用（spa），开始时请
转载
2023-12-21 06:20:20
73阅读
文章目录概要1、脚手架安装2、项目打包部署3、配置nginxEND 概要内容主要包括部署前端项目，nginx安装配置，以及后端项目的打包1、脚手架安装vue init webpack 项目运行（默认端口8080）npm run dev 如果前后端分离项目，发出axiox请求实现跨域时，需要配置proxy代理/**
* 例如这个前端微服务项目访问后端接口时需要带/teacher 路径，而后端服
转载
2024-01-29 12:21:58
34阅读
前端面试题（3）1、请解释一下CSS3的Flexbox（弹性盒布局模型）,以及适用场景？一个用于页面布局的全新CSS3功能，Flexbox可以把列表放在同一个方向（从上到下排列，从左到右），并让列表能延伸到占用可用的空间。 较为复杂的布局还可以通过嵌套一个伸缩容器（flex container）来实现。 采用Flex布局的元素，称为Flex容器（flex container），简称"容器"。 它的
转载
2024-07-18 14:10:58
18阅读
注：本文选择了nginx做web服务器。因为在本文vue前端项目中，需要从接口获取数据，可是数据与vue前端项目是在同一ip地址但不同端口号，所以需要跨域读取数据。本文的跨域处理是使用了nginx。环境： 阿里云服务器（ubuntu 64bit）xshellnginx1.使用xshell登录到阿里云服务器。安装nginx（本文安装到/etc下） [plain]
1. cd /etc
转载
2024-06-13 21:32:08
1331阅读
一、需求描述在K8S集群上通过部署Nginx服务发布前端项目，其中：前端项目发布文件通过PV和PVC存储在NFS上实现多Pod持久化和共享将Nginx服务配置文件存储至 K8S的configmap中将阿里云证书文件存储至K8S的secret中通过Ingress设置证书，并将Nginx服务暴露到集群外部二、创建NFS存储创建NFS存储主要是为了给Nginx服务提供稳定的后端存储，当Nginx的Pod
转载
2023-12-25 19:29:55
477阅读
在项目开发的过程中，一些公司经常是前后台分开的，并不是所有的前端文件都在后台项目中，尤其是互联网公司。这时候就需要后端人员单独运行前端文件。怎么用Tomcat部署运行前端静态文件呢？工具/原料 Tomcat方法/步骤 可以把文件直接放到webapps下面。当只是运行一个项目的时候，这种方法还好，但是当你涉及到两个以上项目的时候，就麻烦了。设定虚拟目录的方法，下面详细
转载
2023-12-10 23:05:18
74阅读
这篇文章是收集我在工作中经常会用到的nginx相关知识点，本文并不是基础知识的讲解更多的是一些方案中的简单实现。location的匹配规则= 表示精确匹配。只有请求的url路径与后面的字符串完全相等时，才会命中。^~ 表示如果该符号后面的字符是最佳匹配的，采用该规则，不再进行后续的查找。~ 表示该规则是使用正则定义的，区分大小写。~* 表示该规则是使用正则定义的，不区分大小写。注意的是，nginx
转载
2024-10-22 10:52:01
16阅读
# 前端部署到Docker的流程
## 1. 准备工作
在开始前端部署到Docker的过程之前，我们需要确保以下几个事项已经准备好：
1. 安装Docker：请确保你已经安装了Docker并且正确地配置了Docker环境。
2. 前端项目：你需要有一个已经创建好并且可以正常运行的前端项目。
## 2. Dockerfile编写
Dockerfile是一个包含了一系列指令的文本文件，用于自动化构
原创
2023-11-16 15:52:20
93阅读
在开发前端项目的时候，我们经常需要，把页面放到服务器中的“容器”中。比如VueJS，在开发VueJS时，我们要把页面放到“服务器”中，以便我们对程序的调试。经常需要自启服务器。这样非常麻烦，不光繁琐，而且降低了开发效率。介于此，我们可以使用browser-sync(浏览器同步测试工具)开发模块，来帮助我们实现启动服务器，并对项目中的html、css、js文件进行监听，每当这些文件改动，便刷新浏览器
转载
2024-05-12 17:28:38
52阅读
Nginx 流程目录NginxNginx是什么，能做什么基于Docker的Nginx安装和配置1、拉取nginx镜像2、根据镜像创建Nginx容器1、创建一个用于展示的HTML2、创建Nginx容器1、准备挂载目录2、进行容器创建并挂载**写在后边** Nginx是什么，能做什么是什么，能做什么 Nginx是一款自由的、开源的、高性能的HTTP服务器和反向代理服务器；同时也是一个IMAP、POP
转载
2024-03-27 10:44:56
390阅读
通常的前端部署方式：把前端打包好的代码放到服务器(linux)目录下，然后通过nginx转发出去。但是会有前端SPA应用比较经典的白屏问题。 后来了解到有些公司将前端项目部署在 OSS 里，还可以进行加速解析，实现解决前端代码白屏问题。故而学习了解下。 （前提要有一个已经备案过的域名）一、阿里对象存储OSS准备1、申请阿里对象OSS 登录账号，选择控制台，选择 oss，新建Bucket，
转载
2023-12-23 14:24:22
28阅读
持续集成集成工具 jenkins 的基本介绍和自动化部署微前端项目的几个简单方案一、Jenkins 基础介绍Jenkins 是国际上流行的免费开源软件项目,是基于 Java 开发持续集成工具,用于监控持续重复的工作,旨在提供一个开放的易用的软件平台,使软件的持续集成自动化,大大节约人力和时效。Jenkins 功能包括：持续的软件版本发布/测试项目。监控外部调用执行的工作。1. 系统管理安装好的 j
转载
2024-05-02 11:25:05
82阅读
3.1 克隆项目到本地git@github.com:lenve/VBlog.git3.2 执行建表和初始化表数据的sql找到blogserver项目中resources目录下的vueblog.sql文件，使用root账户连接MySQL数据库的客户端后在控制台中执行sql脚本（需要在windows电脑本地和linux服务器上安装mysql数据库服务,笔者在两个环境安装的是Mysql5.7）：这里笔者
文章目录一、准备环境二、安装Nginx1、 安装Nginx依赖2、下载Nginx3、解压下载好的Nginx 压缩包4、编译安装Nginx5、启动Nginx服务三、操作步骤1、使用Xshell连接服务器2、上传静态资源文件3、 配置Nginx4、 重启Nginx服务 我们在会开发项目的同时，也应该了解一下前端是如何部署项目的；一、准备环境1、服务器或者虚拟机（后端已经搭建好的，这里就不讲述如何搭建
转载
2023-12-03 06:26:11
161阅读
**将前端代码部署到nginx**
作为一名经验丰富的开发者，我将会教你如何将前端代码部署到nginx。在这篇文章中，我将分步骤告诉你整个部署流程，以及每一步所需的代码示例。让我们一起来完成这个任务吧！
**部署流程**
下面是将前端代码部署到nginx的步骤：
| 步骤 | 描述 |
| ---- | ---- |
| 步骤一 | 安装nginx |
| 步骤二 | 配置nginx |
原创
2024-05-07 10:02:52
132阅读
问题描述当前需要我进行前端代码的部署，但是我忘记了这个系统对应的部署位置，但是隐约记得好像是通过tomcat部署的。然后当时为了方便部署，我们打开了Tomcat Manager以下是基于Tomcat Manager的，没有打开的需要前往tomcat下载路径/conf/tomcat-users.xml添加以下内容1.寻找Tomcat Manager在哪首先，先进入当前正在运行的项目页面，找到IP输入
转载
2024-09-08 22:52:53
41阅读
帖子用于记录docker学习中自己碰见的疑惑，方便日后回看：docker组成 先记录一个困扰我很久的问题：就是dockerfile与docker-compose.yml及image、container之间到底是什么关系？ 首先，我在官网上看到这样一个docker-compose.yml的示例： 看完这个示例之后，让我疑惑的是，在一个container(容器)中可以运行多个image？实际，dock
前言 在前后端还没有分离的时代下，前端项目通常是放在后端项目的静态资源目录下一起部署的，那个时候还没有专门的前端程序员，或者说前端程序员不需要自己部署网站.通常前端人员只需要把网站源文件如.html文件结尾的资源包发给后端或者运维即可，剩下的事情便交给后端或运维定了.但随着技术的发展,前后端分离开发后,前端项目也通常分离部署了，这个时候可能就需要前端人员自己部署前端项目，然而前端开发人员很少接触到
转载
2023-11-02 22:10:08
95阅读
1.编译安装nginxmkdir /appl
cd /appl
wget http://nginx.org/download/nginx-1.24.0.tar.gz
tar -zxvf nginx-1.24.0.tar.gz
cd nginx-1.24.0/
#定义安装目录为/appl/nginx
./configure --prefix=/appl/nginx
#编译、安装
make
make
前言：本文描述了如何采用teamcity将项目部署在docker容器中，完成前端项目（例子为vue，其他项目理论上也适用，各框架下完成项目打包即可）自动部署的具体方式，思路及步骤如下： 1.teamcity从git拉取代码到工作空间 2.在工作空间目录下，项目打包生成dist， 3.将dist复制到以nginx为基础镜像的dockerimage中，完成dockerimage的build 4.最后用
转载
2023-11-19 10:11:52
262阅读
