前端应该了解的Nginx使用技巧
0. 前言
nginx 是一个高性能的 HTTP 和反向代理服务器,也是一个通用的 TCP/UDP 代理服务器,最初由俄罗斯人 Igor Sysoev 编写。
本文整理了 Nginx 常见命令与配置,以便后面需要配置 Nginx 的时候可以快速的找到配置文档。个人以前端的视角来看 Nginx 主要是会配,能够理解这里面哪个配置文件是干什么的配置后有哪些效果。
1. 基础命令
列出 nginx 相关软件包
1yum list | grep nginx
yum list: 列出所有软件清单
yum list installed: 列出已安装软件清单————检测系统中是否安装某个软件
grep: 用于查找文件中符合条件的字符串
安装 nginx
1yum install nginx
查看 nginx 版本信息
1nginx -v
列出 nginx 相关目录
1rpm -ql nginx
全格式显示所有 nginx 运行进程
1ps -ef | grep nginx
ps: 列出系统中当前运行的进程
-ef: -e 显示所有,-f 全格式显示,也可以使 ...
【教程】从零开始编译合适自己的OpneWrt固件
0. 前言个人使用 OpenWrt 多年,固件大多用的都是恩山论坛几位大佬编译好的现成固件,什么高大全,骷髅头,suninggegeg。其实用大佬编译好的固件挺好的,但是因为每个人的需求不一样。导致使用高大全固件又是总觉得太臃肿,使用一些精简版的固件又没有自己需要的插件。最后还是萌生了自己根据自己的需求去编译 OpenWrt。经过一番折腾下来也是把固件给编译出来了,这个编译过程大概需要 1-3 小时左右。
1. 环境要求1.1 系统版本
推荐是 Debian11 或者是 Ubuntu LTS 18.x 或者 20.x 、22.x
1.2 网络和配置要求
编译的主机最好是境外美区的 VPS,如果要本地编译需要给编译主机配置全局国际网络环境。
编译主机至少需要预留 50G 以上的硬盘空间。在编译的过程中会下载大量的依赖文件,如果硬盘空间不足或网络不稳定都可能会编译失败。
编译主机配置推荐 2H4G 以上,这会减少编译等待时间。
这边推荐使用腾讯或阿里按量付费港区或美区的云主机,编译完成就可以销掉云主机,可以选到较高的配置同时支出的费用也不会太多。
1.3 编译依赖安装123456789 ...
一文搞定Vue3组件传值
1. 父传子 defineProps父组件传值给子组件主要是由父组件通过v-bind绑定数值,而后传给子组件;子组件则通过defineProps 接收使用。
父组件
1234567891011121314151617181920<template> <div class="fu"> <p>我是父组件</p> <son :toSomMeg="toSomMeg"></son> </div></template><script setup lang="ts">import { ref } from "vue";import son from "./son.vue";const toSomMeg = ref("给子组件的消息");</script><style>.fu { width: 100% ...
uni-app+vue3+vite+uni-ui+pinia微信小程序项目搭建
0. 前言
最近在把一个uni-app项目从原来的vue2重构到vue3上,趁这次机会记录一下这个项目打搭建方便自己后面再次用到就可以直接拉代码了。
这篇文章很多实现和思路都是参考其他大佬的,如果有哪里不对欢迎大家指出。
1. 项目初始化1.1 通过vue-cli命令创建
全局安装vue-cli
1npm i -g @vue/cli
使用Vue3/Vite版
创建以 typescript 开发的工程(如命令行创建失败,请直接访问 gitee 下载模板)
1npx degit dcloudio/uni-preset-vue#vite uniapp-vue3-vite
tips:
Vue3/Vite版要求 node 版本^14.18.0 || >=16.0.0
1.2 ESLint12# 根据提示和项目情况选择y/nnpx eslint --init
配置参考文章
vs-code安装和配置ESLint
1.3 prettier1npm i prettier eslint-config-prettier eslint-plugin-prettier -D
...
vite项目配置:后端希望能任意更改打包后的接口请求地址
0. 前言目前项目上领导提出一个需求:前端项目打包的时候,希望项目线上接口地址不要写死。可以根据上线时候的情况去修改接口地址而不需要前端再次打包代码。
根据网上搜索加自己实践得出以下几种方法:
1. 解决方案我这边是uniapp的项目,在根目录下static文件夹内的内容默认不会压缩(vue中默认public文件夹),那就就在static文件夹内创建一个config.js文件。
12// /static/config.jshttpUrl = 'www.xxx.com/';
1.1 方案一在index.html中新增script标签,window对象上挂载请求路径,后端想要修改地址就在html中修改即可。
123456789101112131415161718<!--index.html--><!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <link rel=&qu ...
【踩坑记事】关于我被switch语句折腾的3小时
0. 前言记一次这周在项目上遇到的一个问题,为解决这个问题我和朋友研究了大概两三个小时。我们都是第一次遇到这种问题,请大佬勿喷,下面我来讲一下这个问题的成因和解决的办法。
直接说结果[问题结论](#4. 问题解决)
1. 问题来源在目前这个项目中有一个函数需要根据后端返回返回的数据,分别进行不同操作。因为要执行不同的操作的判断有点多,所以决定使用switch语句来进行判断。
一般来说switch语句是长这样的:
12345678910111213141516171819202122switch (expr) { case "Oranges": console.log("Oranges are $0.59 a pound."); break; case "Apples": console.log("Apples are $0.32 a pound."); break; case "Bananas": console.log("Ba ...
vs-code安装和配置ESLint
安装ESLint
全局安装: npm install -g eslint
项目安装: npm install eslint --save-dev
如果你想你所有项目都使用eslint,请全局安装;如果你想当前项目使用,请局部安装。
局部安装时请使用 –save-dev,因为 eslint 是适用于开发环境(Software Development Environment,SDE)的插件,请不要添加到生产环境中。
初始化ESLint
eslint --init
1234? How would you like to use ESLint? (Use arrow keys) // 你想怎样使用eslint To check syntax only // 只检查语法> To check syntax and find problems // 检查语法、发现问题 To check syntax, find problems, and enforce code style // 检查语法、发现问题并执行代码样式
1234? What type of modules d ...
mklink命令创建软硬目录链接与删除链接
1. mklink链接的创建“mklink” 命令在 Windows 系统中用于创建硬链接、符号链接和目录链接。以下是 “mklink” 命令的常用参数:
/D:用于创建目录软链接。当使用该参数时,需要指定目标目录的路径。
/H:用于创建硬链接(硬链接只适用于文件)。当使用该参数时,需要指定目标文件的路径。
/J:用于创建目录链接。与 /D 相似,但它创建的是一个目录联接,而不是目录软链接。
/I:用于创建符号链接(默认为符号链接)。当使用该参数时,需要指定目标文件或目录的路径。
/Y:在创建链接之前,自动确认覆盖现有目标。
下面是一些示例:
创建文件软链接:
1mklink 软链接文件 目标文件
创建目录软链接:
1mklink /D 软链接目录 目标目录
创建符号链接(默认):
1mklink 软链接 目标文件或目录
创建硬链接:
1mklink /H 硬链接 目标文件
创建目录链接:
1mklink /J 目录链接 目标目录
请注意,在创建链接时,确保 “mklink” 命令的参数和路径正确无误,并具有足够的权限。
2. 软链接、硬链接、目录链接区别软链接、硬链接和目 ...
【杂谈】浅谈社会公信力的丧失
0. 前言:在开始之前我想先说说什么是社会公信力。社会公信力是指一个个体、组织或机构在社会中获得的信任和声誉程度。它反映了人们对其行为、承诺和道德准则的信任程度。社会公信力是建立在诚信、透明度和责任感基础上的,它对于个人、企业、政府和其他组织来说都非常重要。
一个具有良好社会公信力的个体或者组织,通常表现出以下几个特征:
诚信和守信:他们言行一致,信守承诺,不欺骗他人。
诚信和守信:他们言行一致,信守承诺,不欺骗他人。
透明度:他们公开信息,对外界保持开放和公正。
责任感:他们对自己的行为负责,并愿意承担应有的责任和后果。
反馈和改进能力:他们重视他人的反馈和意见,积极改进自身不足之处。
社会参与:他们积极参与社会公益事业,关注社会问题并为之做出贡献。
1. 群众里面有坏人啊其实我对社会公信力逐渐丧失有比较直观的感受是在19年疫情开始的时候。
【算法】JS实现斐波那契数列
斐波那契数列,又称黄金分割数列,是一种递归的数列,以它的递推公式和美丽的数学性质得到了广泛的应用。本文将介绍使用 JS 实现斐波那契数列的几种方法,包括递归和循环,以及优化方案等。
1. 斐波那契数列定义斐波那契数列(Fibonacci sequence)是一种递归的数列,以它的递推公式和美丽的数学性质得到了广泛的应用。它的定义如下:F(0)=0,F(1)=1,F(n)=F(n-1)+F(n-2)(n>=2,n∈N*)。也就是说,第 n 个斐波那契数就是第 n-1 个和第 n-2 个斐波那契数之和。通常用 F(n)表示斐波那契数列中的第 n 个数。斐波那契数列是一个由 0 和 1 开始,后续的每一项都是前两项之和的数列。
2. 以终为始——递归实现2.1 普通递归对于普通递归我的总结就是:以终为始,套娃计算,适时终止。
以始为终:用倒推的方式来思考。
套娃计算:找到套娃的公式。
适时终止:递归到能直接得到结果的地方就停并返回结果。
下面我们来开始倒推。从后往前倒推就是 :
123456f(n) = f(n-1) + f(n-2)f(n-1) = f(n-2) - ...











