发表更新PHP / Laravel

Laravel 新旧版本模型属性访问器、修改器的选用

Laravel 9 之前模型属性访问器、修改器

通过 setFooBarAttribute($value)、getFooBarAttribute() 方法来定义和访问自定义动态 fooBar 属性。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
namespace App\Models;

use Illuminate\Database\Eloquent\Model;

class User extends Model
{
    /**
     * 设置用户的名字
     */
    public function setFirstNameAttribute($value)
    {
        $this->attributes['first_name'] = strtolower($value);
    }

    /**
     * 获取用户的全名
     */
    public function getFullNameAttribute()
    {
        return "{$this->first_name} {$this->last_name}";
    }
}

Laravel 9 及之后版本的模型属性访问器、修改器

通过返回值类型为 Attribute 类来定义和访问自定义动态属性。

阅读更多
发表更新理论

跨境电商系统多语言内容的设计方案

方案1：一个表设计一个多语言内容关联表

表解构

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
- product_categories 
  - id
- product_categorie_l10ns
  - category_id # 关联 product_categories.id
  - locale
  - name
- products
  - id
  - category_id # 关联 product_categories.id
- product_l10ns
  - product_id  # 关联 products.id
  - locale
  - title
  - desciption
  - detail
阅读更多
发表更新WSL / PHP

WSL下配置AlpineLinux作为PHP开发环境

Alpine Linux 占用空间少，可定制性高，除了很适合跑 docker 容器外，也很适合跑在 wsl 中。

下载 WSL 版 Alpine Linux

打开链接 https://github.com/yuk7/AlpineWSL/releases 找到系统对应的 Alpine 版本，如 Alpine.zip，解压到你想要存放的位置，点击 Alpine.exe 文件即可安装好。

安装好后，将在 Alpine.exe 所在文件夹中创建 ext4.vhdx 虚拟磁盘文件，作为 AlpineLinux 的磁盘。控制台执行命令 wsl -l -v，将看到新安装的 wsl 发行版 Alpine。

启动 Alpine

命令 wsl -d Alpine

使用国内镜像源

打开源配置：

1
vi /etc/apk/repositories

注释掉默认源：

1
2
#https://dl-cdn.alpinelinux.org/alpine/v3.18/main
#https://dl-cdn.alpinelinux.org/alpine/v3.18/community

加入阿里源配置：

1
2
http://mirrors.aliyun.com/alpine/v3.19/main
http://mirrors.aliyun.com/alpine/v3.19/community

或 加入腾讯源配置：

1
2
https://mirrors.cloud.tencent.com/alpine/v3.19/main
https://mirrors.cloud.tencent.com/alpine/v3.19/community

执行更新命令更新源数据和已安装的apk包：

1
apk -U upgrade

部署PHP 8.2

1
2
3
4
5
apk add php82 php82-pear php82-dev php82-pdo_mysql \
    php82-iconv php82-mbstring php82-tokenizer \
    php82-session php82-dom curl php82-curl \
    php82-xmlwriter php82-fileinfo php82-posix \
    redis php82-pecl-redis

把 82 改为 81 或 83 即为安装 php-8.1 或 php-8.3
如果出现错误，apk add gcc，``

如果安装 php-8.1 出现一下错误：

1
2
3
4
5
6
7
ERROR: unable to select packages:
  php81-pecl-msgpack-2.2.0-r0:
    conflicts: php82-pecl-msgpack-2.2.0-r0[php-msgpack=2.2.0-r0]
    satisfies: php81-pecl-redis-6.0.2-r0[php81-pecl-msgpack]
  php82-pecl-msgpack-2.2.0-r0:
    conflicts: php81-pecl-msgpack-2.2.0-r0[php-msgpack=2.2.0-r0]
    satisfies: php82-pecl-redis-6.0.2-r0[php82-pecl-msgpack]

安装脚本中去掉 php82-pecl-redis再执行。

php8 版本切换

如果同时安装多个 php 版本，可通过脚本来更换默认版本php。

创建脚本 vi /usr/php-switch，输入以下内容：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
#!/bin/bash
cd /usr/bin

rm -f php php-config phpize pecl phar phar.phar

v=${1:-82}

ln -s php${v} php
ln -s php-config${v} php-config
ln -s phpize${v} phpize
ln -s pecl${v} pecl
ln -s phar.phar${v} phar
ln -s phar.phar${v} phar.phar

echo '已切换到php'$v

设置权限为可执行 chmod +x /usr/php-switch。

1
2
3
4
5
6
7
8
# 默认切换到php 8.2
php-switch

# 切换到php 8.1
php-switch 81

# 切换到php 8.3
php-switch 83

安装 Nodejs

1
apk add icu-data-full nodejs npm
发表更新理论

少儿学习编程有什么意义？

少儿学习编程有很多意义，主要体现在以下几个方面：

1、培养编程思维能力

编程思维（也叫计算思维）是一种解决问题的思维方式，它强调的是把问题分解成更小的部分，然后逐个解决。编程思维的核心是抽象、模块化和自动化。在学习编程的过程中，孩子可以练习如何运用编程思维来解决问题，孩子需要理解问题、拆解问题、抽象问题、设计解决方案、实施方案等一系列步骤。这种思维方式强调从问题到解决方案的转化过程，培养了孩子的逻辑思维和分析问题的能力。

这可以帮助孩子提高解决问题的能力，并为未来的学习和工作打下基础。

阅读更多
发表更新理论

什么是编程思维？简化问题的艺术

1、编程思维

编程思维 不是编写程序的技巧，而是一种解决问题的思维方式，它强调的是把问题分解成更小的部分，然后逐个解决。编程思维的核心是抽象、模块化和自动化。

  • 抽象 是指将问题简化为更基本的概念。例如，在编写一个计算两个数之和的程序时，我们可以将问题抽象为“将两个数字相加”。

  • 模块化 是指将问题分解成更小的部分。例如，在编写一个绘制正方形的程序时，我们可以将问题分解为以下几个步骤：

    • 绘制一条线
    • 旋转 90 度
    • 再绘制一条线
    • 再旋转 90 度
    • 重复步骤 1 到 4，直到绘制完成

  • 自动化 是指使用计算机程序来解决问题。例如，在编写一个计算两个数之和的程序时，我们可以使用计算机程序自动完成计算过程。

阅读更多
发表更新AI

AI训练没有GPU独显？教你使用魔搭免费提供的阿里云端 cuda GPU

在 魔搭 笔记本中，可免费使用阿里云提供的AI计算资源：100小时免费的GPU计算资源，长期免费的CPU计算资源。

提供资源的配置参数

1
2
3
CPU 8核
REM 32G
GPU 可选：无GPU、16G、24G

使用教程

  • 注册魔搭账号，关联阿里云账号

  • 打开我的Notebook

  • 选择计算环境（CPU/GPU），CPU 环境长期免费，GPU环境有100小时免费（启动后才计时，停止或后就不计时了）

  • 选择预装镜像，根据你需要的 cuda、torch、TensorFlow 版本来选择。

  • 点击“启动”按钮，等待一两分钟就启动好实例了

  • 点击“查看Notebook”就可以开始使用了。

  • 可以在笔记本中直接运行系统命令或python代码。如运行：!nvcc -V 查看 NVIDIA、CUDA 的版本信息。

  • 可以打开终端执行命令，比如运行ps -e f、python -V。

评价

魔搭好的方面是：使用方便，注册登录账号就可以立即使用计算资源。
不好的地方主要是：

  • 实例关闭后，镜像数据会被清空。
  • 环境给予 Ubuntu，需要会一点 Linux 命令用起来才更熟练。

后续

魔搭给的免费GPU环境只有100个小时，关闭后数据还被清空，是不是不够用？接着看我们下一期《免费3个月的阿里云端 Cuda GPU 计算（使用教程）》。

发表更新AI

SadTalker 安装笔记

环境

  • 阿里云PAI-DSW
  • ubuntu20.04
  • pytorch:1.12
  • gpu-cu113
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
git clone https://github.com/OpenTalker/SadTalker.git

cd SadTalker 

conda create -n sadtalker python=3.8

conda activate sadtalker

conda info

# 把 pip 源设为腾讯源
pip config set global.index-url https://mirrors.cloud.tencent.com/pypi/simple

pip install torch==1.12.1+cu113 torchvision==0.13.1+cu113 torchaudio==0.12.1 --extra-index-url https://download.pytorch.org/whl/cu113

# cpu 版
# pip --default-timeout=1000 install torch==1.12.1+cpu torchvision==0.13.1+cpu torchaudio==0.12.1 -f https://download.pytorch.org/whl/torch_stable.html

conda install ffmpeg

pip install -r requirements.txt

### Coqui TTS is optional for gradio demo. 
### pip install TTS

# 下载模型

python inference.py
–driven_audio ../ds1.wav
–source_image ../2.jpg
–enhancer gfpgan
–preprocess full
–still

python inference.py –driven_audio test/ds1.wav –source_image test/1.jpg –enhancer gfpgan –cpu

3D 版

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
git clone https://github.com/OpenTalker/SadTalker.git
cd SadTalker 
conda create -n sadtalker3d python=3.8
source activate sadtalker3d

conda install ffmpeg
pip install fvcore iopath
conda install libgcc gmp

pip install torch==1.11.0+cu113 torchvision==0.12.0+cu113 torchaudio==0.11.0 --extra-index-url https://download.pytorch.org/whl/cu113

# insintall pytorch3d
pip install --no-index --no-cache-dir pytorch3d -f https://dl.fbaipublicfiles.com/pytorch3d/packaging/wheels/py38_cu113_pyt1110/download.html

pip install -r requirements3d.txt

### install gpfgan for enhancer
pip install git+https://github.com/TencentARC/GFPGAN


### when occurs gcc version problem `from pytorch import _C` from pytorch3d, add the anaconda path to LD_LIBRARY_PATH
export LD_LIBRARY_PATH=$LD_LIBRARY_PATH:/$YOUR_ANACONDA_PATH/lib/

python inference.py \
--driven_audio ../yiyi-tts.wav \
--source_image ../3.jpg \
--still \
--preprocess full \
--enhancer gfpgan

发表更新前端 / JavaScript

配置 Vite 支持用 “@” 路径别名导入文件

需要做如下两步配置。

1、让 vite 能识别 @ 路径别名

vite.config.js 增加：

1
2
3
4
5
6
7
8
9
10
11
12
13
import { resolve } from 'path';

export default defineConfig {
    // ...
    resolve: {
        alias: {
            "@": resolve(__dirname, 'src'), // vite 编译的路径别名
        },
        // extensions: ['.js', '.json', '.ts'], // 使用路径别名时省略后缀名编译时补全，默认值为 ['.js', '.json', '.ts']
    }
    // ...
}

2、让 IDE 能识别 @ 路径别名

用 @ 路径别名导入文件后，IDE （如 jetbrains 家的）要能识别导入路径，实现代码提示识别，点击导入变量或导入路径能跳转到文件。

在根目录下的 jsconfig.json 加入以下内容：

1
2
3
4
5
6
7
8
{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["./src/*"]
    }
  }
}
发表更新前端 / Vue

Vue3 组合式 API 使用 i18n 实现本地化

Vue3 使用选项式 API 较容易，按文档上手就行，这里就不多说。组合式 API 上手会比较麻烦一点。

创建实例

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
// app.js
import { createApp } from 'vue';
import { createI18n } from 'vue-i18n';
import App from './App.vue';

const i18n = createI18n({
  locale: 'cn', // 设置当前语言
  legacy: false, // 要支持组合式API，此项必须设置为false;
  // globalInjection: true, // 全局vue视图中注册$t方法，vue-i18n v9.2 之后默认是 true
  messages: {
    cn: {
      message: {
        hello: '你好',
      },
    },
    en: {
      message: {
        hello: 'hello',
      },
    },
  },
});

const app = createApp(App);
app.use(i18n);
app.mount('#app')

基本使用

1
2
3
4
5
6
7
8
9
10
<!-- App.vue -->
<script setup>
import { useI18n } from 'vue-i18n';
const { t } = useI18n(); // 组合式 API 使用 vue-i18n，关键是 createI18n 的 legacy 参数要设置成 false
console.log(t('message.hello'));
</script>

<template>
  <div>在视图中使用语言： {{ $t('message.hello') }}</div>
</template>

自定义全局方法使用 vue-i18n

组合式 API 每次要 import 又要导出要用的函数，需要频繁使用，这样太麻烦了。
我们可以定义 window.$t 全局函数，这样在 setup 中也能直接用 $t()取得语言信息。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
// app.js
import { createApp } from 'vue';
import { createI18n } from 'vue-i18n';
import App from './App.vue';

const i18n = createI18n({
  locale: 'cn',
  messages: {
    cn: {
      hello: '你好',
    },
    en: {
        hello: 'hello',
    },
  },
});

window.$t = function() {
  return i18n.global.t(...arguments);
}

const app = createApp(App);
app.use(i18n);
app.mount('#app')

备注

更多用法见官方文档： https://vue-i18n.intlify.dev/guide/

发表更新工具

Git 设置 Socks5 代理

全局设置代理

1
2
git config --global http.proxy 'socks5://127.0.0.1:1080'
git config --global https.proxy 'socks5://127.0.0.1:1080'

取消全局代理

1
2
git config --global --unset http.proxy
git config --global --unset https.proxy

指定域名使用代理

1
2
3
4
5
#只对github.com
git config --global http.https://github.com.proxy socks5://127.0.0.1:1080

#取消代理
git config --global --unset http.https://github.com.proxy

在 .git/config 配置文件中设置代理

在 .git/config 文件中添加配置：

1
2
[https]
	proxy = socks5://127.0.0.1:1080

ssh 代理连接（使用 ssh 访问 git 的解决方案）

前面设置的都是 https 代理， GitHub 都要求通过 ssh key 来提交，我们可以在 ~/.ssh/config 配置文件中设置使用代理连接 ssh。

1
2
3
4
5
6
7
8
9
10
Host github.com
HostName github.com
User git
IdentityFile C:\Users\cmpan\.ssh\github
ProxyCommand "C:\Program Files\Git\mingw64\bin\connect" -S 127.0.0.1:1080 -a none %h %p
``````

```sh
# MacOS
ProxyCommand nc -v -x 127.0.0.1:1080 %h %p

终极方案

如果你有一台外网的 Linux 服务器，你可以用该服务器作为代理。

1
2
3
4
5
6
7
8
9
10
11
12
13
# 作为代理的ssh连接参数
Host          pxy
HostName      IP地址 
Port          22
User          pxy
IdentityFile  ~/.ssh/pxy

# GitHub 连接参数
Host          github.com
HostName      github.com
User          git
IdentityFile  ~/.ssh/github_auth
ProxyCommand  ssh pxy -W %h:%p # pxy 为代理ssh连接对应的 Host，在 Linux/Mac/Windows 上通用

分类

归档

最新文章

标签

Vue8
Laravel7
JavaScript4
组合式API4
Debian4
WSL4
Eloquent4
PhpStorm4
brew3
GPU2
阿里云2
Vite2
PHP2
Mac2
Homebrew2
GitHub2
SSH2
IDE2
免费1
魔搭1
Gradle1
Dexie.js1
ElementPlus1
Element-UI1
箭头函数1
Promise1
prototype1
call1
apply1
bind1
Class1
Object1
i18n1
响应式1
VueRouter1
MariaDB1
Swap1
虚拟内存1
权限管理1
用户1
用户组1
brew-php-switcher1
Composer1
PHPStorm1
Hyperf1
Octane1
Intervention1
Image1
Xdebug1
pip1
少儿编程1
编程思维1
Docker1
LNMP1
Git1
CentOS1
Socks51
Nginx1
Certbot1
SSL1
Let's Encrypt1
2FA1
Vim1
代理1
AlpineLinux1
vhdx1
×