MeowRain
Life is SimpleLife is Simple
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 Helloworld.vue <template> <div> <h1>Helloworld </h1> <button @click="trigEmit">点击触发父组件传来的函数</button> <button @click="()=>{ console.log(props.name) }">点击打印从父组件传来的值</button> </div> </template> <script setup> /** * * defineProps：用于声明接收的数据（从父组件传递的 props）。 defineEmits：用于声明和触发事件（子组件通知父组件）。 */ import { defineProps,defineEmits } from 'vue'; const props = defineProps(['name']) const emit = defineEmits(["fun"]) const trigEmit = ()=>{ emit("fun","meowrain") } </script> <style scoped></style> 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 app.
使用效果 上传api 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 /** * uploadImageApi(File,string) 上传图片 * @param image - File类型，图片文件 * @param string - string 类型，imageType 图片类型 * @returns Promise<baseResponse<IUploadImageResponse>> */ export function uploadImageApi(image: File, imageType: string): Promise<baseResponse<IUploadImageResponse>> { // 向服务器发送post请求，发送form-data // 内容分别为image-> 图片二进制文件 // imageType-> 图片类型 const data = new FormData(); data.append('image', image); data.append('imageType', imageType); return useAxios.post('/api/file/image', data, { headers: { 'Content-Type': 'multipart/form-data', }, }); } 头像上传组件 avatar-cropper.
meowrain 发布于 收录于 Go golang使用bcrypt实现密码加密和验证 介绍 把用户的密码存入数据库的时候，我们当然不能使用明文存储，要对密码进行一次加密，然后再存储到数据库中。
我们一般采用哈希算法实现对密码的加密，因为哈希算法得到的加密数据是不可逆的
哈希算法（Hash Algorithm）是一种将任意长度的数据映射为固定长度数据的算法。哈希算法广泛应用于数据完整性校验、密码存储、数字签名等领域。以下是一些常见的哈希算法：
简单的哈希算法 1. MD5 (Message Digest Algorithm 5) 输出长度: 128位（16字节） 特点: 速度快，但安全性较低，容易受到碰撞攻击。 应用: 文件校验、旧版密码存储。 2. SHA-1 (Secure Hash Algorithm 1) 输出长度: 160位（20字节） 特点: 安全性较MD5高，但仍存在碰撞风险。 应用: 数字签名、SSL证书。 3. SHA-2 (Secure Hash Algorithm 2) 子算法: SHA-224, SHA-256, SHA-384, SHA-512 输出长度: 224位、256位、384位、512位 特点: 安全性高，广泛使用。 应用: 数字签名、SSL/TLS、区块链。 4. SHA-3 (Secure Hash Algorithm 3) 子算法: SHA3-224, SHA3-256, SHA3-384, SHA3-512 输出长度: 224位、256位、384位、512位 特点: 基于Keccak算法，与SHA-2结构不同，安全性高。 应用: 数字签名、密码存储。 5. RIPEMD-160 (RACE Integrity Primitives Evaluation Message Digest 160) 输出长度: 160位（20字节） 特点: 安全性较高，常用于比特币地址生成。 应用: 数字签名、区块链。 6.
meowrain 发布于 收录于 前端 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" type="text/css" href="assests/style.css"> </head> <body> <div class="container"> <div id="app" style="--day-mode: true;"> <div class="content"> <p>Hello,there is test1</p> </div> <div class="content"> <p>Hello,there is test1</p> </div> <div class="content"> <p>Hello,there is test1</p> </div> </div> <div class="btns"> <button onclick="toggleToNightMode()">Switch to Night Mode</button> <button onclick="toggleToDayMode()">Switch to Day Mode</button> </div> </div> <script src="assests/script.
meowrain 发布于 收录于 Go 用Go简单实现Github授权登录并获取github用户信息 参考： 没错，用三方 Github 做授权登录就是这么简单！（OAuth2.0实战）-腾讯云开发者社区-腾讯云 (tencent.com)
首先我们需要了解一下什么是Oauth2.0
可以看阮一峰老师的这个文章::理解OAuth2.0
一口气说出 OAuth2.0 的四种授权方式 (qq.com)
一.授权流程 二.注册应用 要想得到一个网站的OAuth授权，必须要到它的网站进行身份注册，拿到应用的身份识别码 ClientID 和 ClientSecret。
注册 传送门 https://github.com/settings/applications/new，有几个必填项。
Application name：我们的应用名；
Homepage URL：应用主页链接；
Authorization callback URL：这个是github 回调我们项目的地址，用来获取授权码和令牌。
https://docs.github.com/zh/apps/oauth-apps/building-oauth-apps/authorizing-oauth-apps
提交后会看到就可以看到客户端ClientID 和客户端密匙ClientSecret，到这我们的准备工作就完事了。
三.授权开发 获取授权码 我们请求https://github.com/login/oauth/authorize?client_id=yourclient_id& redirect_uri=your_redirect_url/authorize
请求后会提示让我们授权，同意授权后会重定向到authorize/redirect，并携带授权码code；如果之前已经同意过，会跳过这一步直接回调。
然后我就回跳转到redirect_url，能拿到这个code
http://localhost:8080/callback?code=ac3d9c25eb39752b34c2
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 package main import ( "fmt" "io/ioutil" "log" "net/http" "net/url" ) const ( clientID = "" clientSecret = "" redirectURI = "http://localhost:8080/callback" // 确保与 GitHub 应用配置一致 ) func loginHandler(w http.
meowrain 发布于 收录于 前端 效果 html 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="style.css"> </head> <body> <div class="container"> <div class="header">MeowRain's Images</div> <div class="content"> </div> <div class="footer">CopyRight MeowRain 2024</div> </div> <script> document.
meowrain 发布于 收录于 Go 个人图床-Go实现 https://github.com/meowrain/img-bed-Go
使用到的框架: Gin
使用到的库: github.com/chai2010/webp
一.目录结构 项目如何运行？
什么是反向代理？
二.安装相关库 1 2 3 4 go get -u github.com/gin-gonic/gin go get -u github.com/chai2010/webp go get -u gopkg.in/yaml.v3 go get -u "github.com/gin-contrib/cors" 三.配置读取-config/config.go 在config文件夹中编写config.go
分段分析 我准备读取下面的配置文件
1 2 3 4 Domain: "http://127.0.0.1" port: 8080 auth: token: xxx # demo 这里需要分析一下我们的配置文件为什么这么写，Domain这个用来以后找你的图片，比如你准备把图床的网站域名设置为: https://pic.meowrain.cn，那么当你向http://your server ip:8080发送post请求上传图片后，会收到后端响应，响应给你的地址也就是https://pic.meowrain.cn/year/month/day/xxxx.webp
因此为了我们访问图片能访问到，你需要为你的webserver（比如nginx或者caddy)设置一个反向代理
那么我需要编写对应的结构体,在config.go中
1 2 3 4 5 6 7 type Config struct { Domain stgring `yaml:"domain"` Port string `yaml:"port"` Auth struct { Token string `yaml:"token"` } `yaml:"auth"` } 然后我们需要一个公共变量供外部函数调用
meowrain 发布于 收录于 折腾 Nginx 配置訪問密碼 Ubuntu安裝的nginx存放網站的目錄在/var/www下，我們在這個目錄創建一個auth文件夾
1 mkdir auth 然後我們創建訪問密碼和用戶的工具htpasswd，我們需要安裝apache2-utils
1 sudo apt-get install apache2-utils 然後我們使用htpasswd創建配置文件
1 htpasswd /var/www/auth username 如圖，我們輸入兩次密碼就可以了
然后我们配置nginx的配置文件
1 vim /etc/nginx/conf.d/xxx.conf 如上图。我们绑定了域名为test2.meowtwyyds.top 然后设置auth_basic 和auth_basic_user_file
1 2 3 4 5 6 7 8 9 10 11 server { server_name yourdomain; listen port; location / { auth_basic on; auth_basic_user_file /var/www/auth/htpasswd; root /var/www/home; index index.html; } } 然后使用
1 nginx -s reload 进行配置文件重载，重载过后，我们就可以打开 yourdomain:port进行测试了
meowrain 发布于 收录于 折腾 参考 https://blog.csdn.net/weixin_59298892/article/details/134988500
下载源码包 1 2 wget https://nginx.org/download/nginx-1.26.2.tar.gz tar -zxvf nginx-1.26.2.tar.gz 安装编译必须库 1 2 sudo apt install build-essential sudo apt install gcc libpcre3 libpcre3-dev zlib1g-dev libssl-dev openssl 配置 1 ./configure --prefix=/usr/local/nginx --with-http_ssl_module --with-http_stub_status_module --with-http_gzip_static_module 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 2. 安装路径: Nginx 的安装路径为 /usr/local/nginx。 可执行文件（二进制文件）位于 /usr/local/nginx/sbin/nginx。 模块路径为 /usr/local/nginx/modules。 配置文件路径为 /usr/local/nginx/conf。 主配置文件为 /usr/local/nginx/conf/nginx.conf。 PID 文件（进程 ID 文件）为 /usr/local/nginx/logs/nginx.pid。 错误日志文件为 /usr/local/nginx/logs/error.
meowrain 发布于 收录于 折腾 这里你应该已经成功安装wsl了 没安装的见这个
https://learn.microsoft.com/zh-cn/windows/wsl/install
https://learn.microsoft.com/zh-cn/windows/wsl/install#upgrade-version-from-wsl-1-to-wsl-2
下载相关文件 https://github.com/yuk7/ArchWSL/releases
解压后,我们打开终端，执行Arch.exe,会自动安装
里面的ext4.vhdx是安装后生成的
配置 首先在终端进入Arch.exe
然后配置密码
1 passwd 输入两次你的密码
然后我们配置 sudo 权限
1 echo "%wheel ALL=(ALL) ALL" > /etc/sudoers.d/wheel 添加用户
1 useradd -m -G wheel -s /bin/bash {username} 设置默认用户密码
1 passwd {username} 设置Arch.exe默认启动的用户 1 Arch.exe config --default-user {username} 配置pacman 自动设置镜像
1 2 3 curl -l -O "https://raw.githubusercontent.com/LS-KR/Arch-Install-Shell-Stable/main/ustc-mirror.sh" sudo sh ./ustc-mirror.sh 配置pacman
1 2 3 4 5 6 7 sudo pacman-key --init sudo pacman-key --populate sudo pacman -Syy archlinux-keyring sudo pacman -Su 更新系统软件包
