乱码三千 – 分享实用IT技术

乱码三千 – 码出一个新世界


  • 首页

  • 归档

  • 搜索

docker中安装ubuntu桌面环境

发表于 2021-08-31

前言

使用docker, 总会碰到需要桌面环境的时候, 这里介绍docker中安装ubuntu桌面环境的方法, 非常方便, 只需要一个浏览器就能访问

安装步骤

  1. 拉取镜像

    1
    docker pull dorowu/ubuntu-desktop-lxde-vnc
  2. 创建并启动容器

    1
    2
    3
    4
    5
    6
    7
    8
    docker run -id \
    -p 6080:80 \
    -p 8900:5900 \
    -e VNC_PASSWORD=1234 \
    --name=c_desktop \
    -h c_desktop \
    -v $PWD/dev/shm:/dev/shm \
    dorowu/ubuntu-desktop-lxde-vnc

    参数说明:

    • -p 6080:80 将容器的80端口映射到主机的6080端口 用于浏览器访问
    • -p 8900:5900 将容器的5900端口映射到主机的8900端口 用于vnc客户端访问
    • -e VNC_PASSWORD=1234 设置远程登录密码
    • -v $PWD/dev/shm:/dev/shm将主机中当前目录挂载到容器
    • -h 设置容器的hostname
    • –name=c_desktop 给容器取个名称
    • $PWD表示当前所在目录

容器运行成功后, 接下来可以通过两种方式进入ubuntu桌面:

第一种 浏览器访问

在浏览器地址栏输入

1
http://容器ip:6080

image-20210901102900618

然后输入密码即可进入

image-20210901103136185

第二种 使用VNC客户端访问

地址栏输入目标ip和端口, 注意这里端口是8900而不是6080

image-20210901145352885

输入密码登录后长这样:

image-20210901145321808

另外 如果你主机端使用的是mac平台, 还可以直接使用其自带的屏幕共享工具充当VNC工具使

全局搜索Screen Sharing :

image-20210901105353641

image-20210901145607320

输入密码登录后界面:

image-20210901145708985

相比使用vnc客户端, Mac自带的工具虽然方便 但是流畅度会弱一些

特别注意

vnc连接端口默认是5900我们在外网映射的时候不建议直接使用5900端口映射, 可能会出现连接不上的情况, 本文采用的是8900

本文为作者原创 转载时请注明出处 谢谢

B站入口

打赏通道

微信公众号二维码如下:

img

乱码三千 – 点滴积累 ,欢迎来到乱码三千技术博客站

给Multipass容器安装桌面环境

发表于 2021-08-31

前言

linux环境下的桌面程序多达十几种, 比较流行的有Unity、Gnome3、kde、mate、xfce、lxde

我们来看看它们分别都长什么样:

Unity:

img

Gnome2:

img

Gnome3:

img

KDE:

img

mate:

ubuntu_mate_1510

xfce:

img

lxde:

img

不过上面这前四个体量都不小, 对于寄生于主机的小容器系统而言, 我希望找一个轻量简洁满足正常功能的桌面即可

img

于是在lxde和xfec之中进行选择 最后我选择了xfec

xfec安装步骤

  1. 更新源

    1
    sudo apt-get update
  2. 安装Xfce桌面程序

    1
    sudo apt-get install xfce4

安装过程中会让你选择显示管理器, 选择gdm3即可

image-20210831172358907

  1. 安装VNCServer 用于远程桌面连接

    1
    sudo apt-get install tightvncserver
  2. 启动vnc服务

    1
    vncserver

    提示我们输入访问密码:

    image-20210901175901616

    这里的密码用于接下来的远程登录用

开始远程访问

第一种 vnc客户端访问模式

Mac平台可直接执行以下指令安装:

1
brew install Caskroom/cask/vnc-viewer

或者下载安装包:

点击下载(访问密码:312306)

安装vnc客户端后在地址栏输入目标ip和端口, 端口默认为5901

image-20210901180352068

输入密码登录后发现只有灰屏幕:

image-20210901180441212

接下来我们需要配置一下vncserver的环境:

  1. 首先关闭vncserver

    1
    vncserver -kill :1
  2. 修改前对配置文件进行备份

    1
    cp ~/.vnc/xstartup ~/.vnc/xstartup.bak
  3. 修改配置文件

    1
    vim ~/.vnc/xstartup

    内容替换为如下:

    1
    2
    xrdb $HOME/.Xresources
    startxfce4 &
  4. 修改配置文件权限

    1
    chmod +x ~/.vnc/xstartup
  5. 重新启动vnc服务

    1
    vncserver

最后重新连接远程桌面, 如下:

image-20210901181507448

第二种 浏览器访问模式

具体参考:

《如何使用Web浏览器访问Ubuntu环境下的vnc桌面》

指令补充

  1. 如果你需要设置vncserver开机自启动:

    1
    systemctl start vncserver@:1.service && systemctl enable vncserver@:1.service
  2. 你想查看vnserver服务是否开启:

    1
    2
    3
    4
    systemctl status vncserver@:.service

    或者
    systemctl is-enabled vncserver@.service
  3. 你想重启vncserver:

    1
    systemctl restart vncserver@:1.service
  4. 你想设置vnc分辨率:

    1
    vncserver -geometry 1280x1024
  5. 你想修改vncserver登录密码:

    1
    vncpasswd

本文为作者原创 转载时请注明出处 谢谢

B站入口

打赏通道

微信公众号二维码如下:

img

乱码三千 – 点滴积累 ,欢迎来到乱码三千技术博客站

在Mac平台上使用Multipass安装Ubuntu虚拟机

发表于 2021-08-31

起因

最近需要在Ubuntu系统上安装应用进行测试, 无奈手头上只有一台mac电脑, 怎么办呢

如果使用第三方诸如Vmware虚拟机软件是在太费劲了

好在Ubuntu官方给咱建议了一款虚拟机软件Multipass, 相比Vmware更加轻量, 只需一行命令快速创建Ubuntu容器

注意了 Multipass目前只支持创建Ubuntu容器, 但是除了Mac平台外, Multipass还可以在Windows和Linux平台上使用

本文直介绍Mac平台的用法, 其他的可以参考官网

开始使用

1.Multipass安装

首先需要安装Multipass工具

下载地址(访问密码:312306)

如果电脑装了brew可以直接命令行下载安装:

1
brew cask install multipass

下载安装成功后, 执行以下命令可以查看当前软件版本:

1
multipass --version

2.创建Ubuntu容器

可以通过以下指令查看可供下载的Ubuntu镜像:

1
multipass find

下载最新版的Ubuntu镜像并运行:

1
multipass launch --name ubuntu

命令执行后将自动下载并后台运行

如果你想自定义配置创建可以参考如下方式:

1
multipass launch -n vm01 -c 4 -m 4G -d 40G
  • -n, –name: 名称
  • -c, –cpus: cpu核心数, 默认: 1
  • -m, –mem: 内存大小, 默认: 1G
  • -d, –disk: 硬盘大小, 默认: 5G

3.操作容器

  1. 进入容器

    1
    2
    # 如果对应实例没有运行的话,会主动运行对应实例
    multipass shell 容器名称

    image-20210831150818963

    此时便进入到了Ubuntu环境中, 在此可以执行相关的linux指令

    如果你不想进入容器直接执行linux指令, 可以使用multipass exec指令, 比如我想在容器中创建一个名为ABC文件夹:

    1
    multipass exec 容器名 mkdir ABC
  2. 查看容器信息

    1
    multipass info 容器名

    显示结果:

    1
    2
    3
    4
    5
    6
    7
    8
    State:          Running
    IPv4: 192.168.64.2
    Release: Ubuntu 20.04.3 LTS
    Image hash: 97bb9f79af52 (Ubuntu 20.04 LTS)
    Load: 0.00 0.00 0.00
    Disk usage: 1.3G out of 4.7G
    Memory usage: 136.0M out of 981.3M
    Mounts: --
  3. 主机和容器数据交互

    第一种 使用挂载数据卷的方式:

    1
    2
    3
    4
    multipass mount $HOME 容器名

    # 或者指定容器目录
    multipass mount $HOME 容器名:目录名

    如果要卸载数据卷:

    1
    multipass umount 容器名

    第二种 transfer 进行文件复制传输

    1
    multipass transfer 主机文件 容器名:容器目录
  4. 容器配置自动化

    为了保持开发环境和线上环境一致性 同时节省部署时间 multipass给我们提供了--cloud-init选项进行容器启动初始化配置:

    1
    multipass launch --name ubuntu --cloud-init config.yaml

    上面 config.yaml 则是容器的初始化配置文件,内容如下:

    1
    2
    3
    4
    5
    #cloud-config

    runcmd:
    - curl -sL https://deb.nodesource.com/setup_12.x | sudo -E bash -
    - sudo apt-get install -y nodejs

    runcmd 可以指定容器 首次启动 时运行的命令,上面表示首次启动自动下载安装 Node.js

容器管理

  1. 查看所有创建的容器

    1
    multipass list
  2. 启动和停止运行容器

    1
    2
    3
    4
    # 停止ubuntu和ubuntu1
    multipass stop ubuntu ubuntu1
    # 启动ubuntu
    multipass start ubuntu
  3. 对 所有容器统一操作

    1
    2
    3
    4
    5
    6
    7
    8
    # 启动所有容器
    multipass start --all
    # 停止所有容器
    multipass stop --all
    # 所有容器放入回收站
    multipass delete --all
    # 彻底删除所有容器
    multipass delete --purge --all

总结

整体操作来看, 感觉和docker很像, 如果你只需要一个ubuntu系统, 那么选择Multipass还是很方便的, 节省大量的时间

multipass和docker区别:

docker比multipass更加轻量一些, multipass更倾向于独立虚拟机, 分配独立的cpu和内存, 而docker容器是共享宿主cpu和内存

如果你要跑比较消耗资源的程序, 建议使用docker, 可以充分使用宿主的性能, multipass需要预算分配程序需要的硬件资源, 分多了不仅浪费而且还影响宿主性能, 分少了也没法动态调整只能新开示例

本文为作者原创 转载时请注明出处 谢谢

B站入口

打赏通道

微信公众号二维码如下:

img

乱码三千 – 点滴积累 ,欢迎来到乱码三千技术博客站

js数组的增删改查总结

发表于 2021-08-23

但估计很多小伙伴初学正则时已经被其奇形怪状的字符给劝退了, 今天我们来将其解剖一下

增

第一种 基于splice封装的扩展函数:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
//首部插入单个元素
Array.prototype.addFirst = function (e) {
this.splice(0, 0, e);
return this;
};
//尾部插入单个元素
Array.prototype.addLast = function (e) {
this.splice(this.length, 0, e);
return this;
};
//指定角标位置插入单个元素
Array.prototype.addByIndex = function (i,e) {
this.splice(i,0,e);
return this;
};

第二种 使用JS自带的函数 :

分别有push unshift concat和splice四个函数

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
//在尾部插入
var arr = [];
var len = arr.push(1); //插入一个元素
var len = arr.push(2,3);//连续插入多个元素


//在头部插入
var len = arr.unshift(0);
var len = arr.unshift(-2,-1);


//在尾部插入
var newArr = arr.concat(4,5,6);//返回一个新的数组对象


//在头部插入多个元素
arr.splice(0,0,0.2,0.4,0.6,0.8);

删

第一种 基于splice封装的扩展函数:

1
2
3
4
Array.prototype.remove = function (e) {
this.splice(this.indexOf(e), 1);
return this;
};

第二种 使用JS自带函数

1
2
3
4
5
6
7
8
9
10
11
12
13
//使用 pop
var item = arr.pop(); //删除最后一个元素并返回该项

//使用 shift
var item = arr.shift(); //删除第一个元素并返回该项

//使用slice裁剪函数
var arr2 = arr.slice(2,6);//取出角标2至6的元素 组成一个新元素

//使用delete 该方法删除掉数组中的元素后,会把该下标出的值置为undefined,数组的长度不会变
var arr = ['a','b','c','d'];
delete arr[1];
//结果为:["a", undefined × 1, "c", "d"]

改

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
Array.prototype.replace = function (origin, target) {
this.splice(this.indexOf(origin), 1,target);
return this;
};


// 或者使用循环
Array.prototype.replace = function (origin, target) {
this.map((value) => {
if (value == origin) {
return target;
} else {
value;
}
});
};

查

1
var index = arr.indexOf("A");//查找元素A在数组中的位置 返回-1表示不存在该元素

关于查找部分, 更多方法详见:《原生JS中判断数组中是否包含某个元素的若干种方法》

本文为作者原创 转载时请注明出处 谢谢

B站入口

打赏通道

微信公众号二维码如下:

img

乱码三千 – 点滴积累 ,欢迎来到乱码三千技术博客站

跨服务器数据迁移

发表于 2021-08-23

起因

最近有台云服务器到期, 续费太贵, 打算换一台便宜的, 之前服务器上使用docker部署了几个网站, 涉及到数据和程序迁移的问题, 在此做个记录

持久化数据迁移

首先使用scp指令进行数据卷的迁移, 也就是跨服务器数据拷贝

假设两台机器IP分别为:

  • 服务器A: 114.238.161.75,

  • 服务器B: 143.224.34.73。

比如我在A服务器上操作,需要将B服务器上/home/lk/目录下所有的文件全部复制到本地的/root目录下,命令为:

1
scp -r  root@143.224.34.73:/home/lk /root

具体过程为:

1
2
3
4
5
6
7
8
9
10
[root@XX ~]# scp -r root@43.224.34.73:/home/lk /root
root@43.224.34.73's password:
k2.sql 100% 0 0.0KB/s 00:00
k.zip 100% 176 0.2KB/s 00:00
.bash_history 100% 32 0.0KB/s 00:00
.bash_logout 100% 18 0.0KB/s 00:00
.bashrc 100% 231 0.2KB/s 00:00
k3.sql 100% 0 0.0KB/s 00:00
.bash_profile 100% 193 0.2KB/s 00:00
[root@XX ~]# ls

或者在A服务器上将/root/lk目录下所有的文件传输到B的/home/lk/cpfile目录下,命令为:

1
scp -r /root/lk root@143.224.34.73:/home/lk/cpfile

具体过称为:

1
2
3
4
5
6
7
8
9
10
[root@XX lk]# scp -r /root/lk root@43.224.34.73:/home/lk/cpfile
root@43.224.34.73's password:
k2.sql 100% 0 0.0KB/s 00:00
k3.sql 100% 0 0.0KB/s 00:00
.bash_profile 100% 193 0.2KB/s 00:00
.bash_logout 100% 18 0.0KB/s 00:00
.bash_history 100% 32 0.0KB/s 00:00
k.zip 100% 176 0.2KB/s 00:00
.bashrc 100% 231 0.2KB/s 00:00
[root@XX lk]#

此外 加上-p参数还可以保留原文件的修改时间,访问权限:

1
scp -r  -p root@143.224.34.73:/home/lk /root
scp后台运行
  1. 方式一 使用nohup, 同时尾部加&

    1
    nohup scp -r  -p root@143.224.34.73:/home/lk /root &
    • nohup: 表示忽略hup信号, 终端关闭任务进程也不销毁

    • &: 表示后台运行

  2. 方式二 使用bg+disown

    1
    2
    3
    4
    1.输入ctrl + z 暂停任务
    2.输入jobs查看任务号
    3.使用 bg %任务号 将该任务号放入后台
    4.使用 disown -h %任务号 使后台任务忽略hup信号

    如下:

    image-20210913143619200

    注: 执行disown后, 任务被移出jobs, 使用jobs指令已经无法查看该任务, 可以使用ps进程查看指令判断任务是否已经结束:

    1
    ps -aux

Docker容器迁移

  1. 首先 需要将容器保存为镜像

    1
    docker commit 容器名称 镜像名称
  2. 然后 将保存的镜像进行压缩

    1
    2
    3
    4
    docker save -o xxx.tar 镜像名称

    //如果多个镜像同时打包
    docker save [images] [images] > [name.tar]
  3. 使用scp指令将压缩包传至新服务器

    1
    scp -r xxx.tar root@143.224.34.73:/home/lk/cpfile
  4. 在新服务器中进行镜像恢复(新服务器需要先安装Docker)

    1
    2
    3
    docker load < xxx.tar
    或
    docker load -i xxx.tar
  5. 最后创建并运行容器

    1
    docker run --name 容器名 -p 12309:80 -d 镜像名

数据库迁移

详情查看《mysql使用命令导入和导出sql文件》

注意事项

docker容器在创建时配置的挂载目录, 如果宿主中挂载的目录不存在则自动创建并写入默认数据, 如果目录已经存在则使用已存在的目录和数据

也就是说我们在进行容器迁移重新运行时, 不用担心原先目录下的数据会被覆盖重写

但是有一点需要注意的是, 原先目录中的配置文件如果包含原服务器中的ip配置, 需要手动修改

比如我们迁移一个wordpress, 在新服务器中使用以下参数进行启动:

1
2
3
4
5
6
7
8
9
10
docker run -id \
--name=wordpress_sex \
-p 7778:80 \
-h wordpress_sex \
-v /root/wordpress/sex_www:/var/www/html \
-e WORDPRESS_DB_HOST=119.33.15.174:3306 \
-e WORDPRESS_DB_USESR=root \
-e WORDPRESS_DB_PASSWORD=123456 \
-e WORDPRESS_DB_NAME=wordpress_sex \
-d wordpress:latest

由于源文件目录和文件未被覆盖重写, 那么上面数据库相关的配置参数不起作用, 我们需要手动进如源文件目录, 对wp-config.php中数据库配置进行修改, 否则无法访问

数据库内网访问保证访问速度

一般来说 我们最好避免直接使用公网ip访问数据库, 而是使用Docker内部桥接网络的方式以容器名替代ip的方式进行访问, 这样既能减少迁移的风险, 又能加快数据的读取

网站的访问流畅度和数据库的访问速度有非常大的关系, 经测试, 使用桥接网络访问数据库的速度远快于使用公网映射访问

大部分人刚开始会将网站的访问速度归结于服务器硬件配置、带宽、程序语言甚至是数据库的数据量太大和sql查询语句不合理上, 殊不知 数据库的访问速度也是重中之重

本文为作者原创 转载时请注明出处 谢谢

B站入口

打赏通道

微信公众号二维码如下:

img

乱码三千 – 点滴积累 ,欢迎来到乱码三千技术博客站

快速掌握正则表达式

发表于 2021-08-18

前言

正则是一把利器, 用好了编程事半功倍

但估计很多小伙伴初学正则时已经被其奇形怪状的字符给劝退了, 今天我们来将其解剖一下

三个部分

正则主要包含三个部分:

  • 小括号() : 表示分组
  • 中括号[] : 表示需要匹配的单个字符 以及表示区间范围或者随机样本
  • 大括号{}: 表示重复出现的次数

比如:

1
2
3
4
a{3}b{2}

或者
[a]{3}[b]{2}

表示字符a重复出现3次 字符b重复出现2次

可匹配以下字符串:

1
aaabb

如果我想将字符a和字符b分离, 可以使用小括号分组功能, 比如:

1
2
3
4
(a{3})(b{2})

或者
([a]{3})([b]{2})

那么$1表示取出第一组内容aaa, $2取出第二组内容bb

在匹配单个字符的时候, 中括号写与不写都一样, 中括号主要的作用在于区间匹配和样本匹配:

区间匹配:

使用字符-表示区间

1
2
3
[a-z] //表示匹配小写a到z的26个英文字母 但凡出现26个字母中的任何一个 都匹配成功

[a-zA-Z0-9] //表示匹配大小写26个字母加上0到9十个数字中的任何一个

样本匹配:

提供一个有限个数的字符的样本, 然后在样本中随机匹配

1
[abcd] //表示匹配abcd这四个英文字母中任意一个

举例:

假如我写了一个正则表达式如下:

1
[ab][cd]

那么它将匹配到四个:

1
2
3
4
ac
ad
bc
bd

是不是感觉像排列组合, 没错

在样本匹配模式下, 中括号中的内容相当于取或, 在正则中取或有一个专门的符号, 用|表示

1
2
3
4
5
6
[ab] 匹配a或b 
a|b 匹配a或b


那么:
[ab][cd] 也可以写成 (a|b)(c|d)

至此, 正则最核心的功能我们就学完了

扩展部分

关于出现次数:

  • 字符?: 表示重复出现零次或一次

  • 字符*: 表示出现零次或多次

  • 字符+: 表示出现一次或多次

示例:

1
2
3
a?b   //可以匹配b 和ab
a*b //可以匹配b 或者a....b
a+b //可以匹配ab 或者a....b

如果放中括号中:

1
2
3
[a?]   //可以匹配a或者?
[a*] //可以匹配a或者*
[a+] //可以匹配a或者+

也就是说一旦放到中括号中, 这三个字符将失去表示次数的含义, 成为一个普通的匹配字符

关于匹配内容:

  • 字符.: 表示匹配除了回车和换行外的任意字符
  • 字符^: 表示限定开头内容
  • 字符$: 表示限定结束内容

我们挨个举例说明:

1
.{3}b  //表示任意字符出现三次然后再出现b

可以匹配到以下内容:

1
2
3
4
5
aaab
xxxb
yyyb
kjfb
...

如果我加个^:

1
^1.{3}b //表示需要匹配的内容必须以1开头

假如我有两个字符串变量:

1
2
String data1="1aaab"; //匹配成功
String data2="gg1aaab"; //匹配失败

如果我去掉这个^:

1
1.{3}b

那么:

1
2
String data1="1aaab"; //匹配成功
String data2="gg1aaab"; //匹配成功

也就是说^这个限定符, 是针对整个字符串进行匹配, 需要整体满足条件, 而不加限定符, 则可以进行局部匹配

$和^同理:

1
.{3}b$  //表示需要匹配的内容必须以b结尾

如下:

1
2
String data1="aaab"; //匹配成功
String data2="aaabg"; //匹配失败

注意: 如果字符^放到中括号中则表示取反

1
[^a] //表示除了字符a外任意字符都行

学到这, 基本上可以实现大部分的正则匹配了

升级

为了方便开发, 正则提供了常用字符的简易写法, 也可以称之为别名

比如:

1
2
3
4
5
[0-9] 可以使用 \d 代替

[a-zA-Z_0-9] 可以使用 \w 代替

[\t\n\x0B\f\r] 可以使用 \s 代替

如果要取反, 那么直接将小写变成大写:

1
2
3
4
5
\D 表示 [^0-9]

\W 表示 [^a-zA-Z_0-9]

\S 表示 [^\t\n\x0B\f\r]

现在 我们再来看几个常用的正则表达式:

1
2
3
4
5
6
//手机号正则匹配
^1[34578][0-9]{9}$


//年月日正则匹配
^\d{4}-\d{2}-\d{2}$

是不是感觉和蔼可亲多了呢

本文为作者原创 转载时请注明出处 谢谢

B站入口

打赏通道

微信公众号二维码如下:

img

乱码三千 – 点滴积累 ,欢迎来到乱码三千技术博客站

原生JS中判断数组中是否包含某个元素的若干种方法

发表于 2021-08-18

第一种 使用indexOf方法

1
2
3
4
var arr = ["A", "B", "C", "D"];

var index = arr.indexOf("A");
//如果返回-1 则表示不存在

第二种 使用find方法

1
2
3
4
5
6
var arr = ["A", "B", "C", "D"];

var element = arr.find(function(value){
return value == "A";
});
//如果没有找到返回undefined 否则返回符合条件的元素

第三种 使用findIndex方法

和find方法类似, 只不过返回值不一样

1
2
3
4
5
6
var arr = ["A", "B", "C", "D"];

var index = arr.find(function(value){
return value == "A";
});
//如果没有找到返回-1 否则返回符合条件元素的角标

第四种 使用for循环

1
2
3
4
5
6
7
var arr = ["A", "B", "C", "D"];

arr.forEach(e=>{
if(e=="A"){
//找到元素
}
})

第五种 使用includes方法

1
2
3
4
var arr = ["A", "B", "C", "D"];

arr.includes("A");
//返回true表示存在 否则返回false

第六种 使用some方法

1
2
3
4
5
6
var arr = ["A", "B", "C", "D"];

var index = arr.some(function(value){
return value == "A";
});
//返回true表示存在 否则返回false

第七中 使用filter方法

1
2
3
4
5
6
var arr = ["A", "B", "C", "D"];

var newArr = arr.filter(function(value){
return value == "A";
});
//返回一个新数组, 如果新数组有数据 表示存在

第八中 自定义扩展方法

1
2
3
Array.prototype.has = function ( target) {
return this.includes(target);
};

本文为作者原创 转载时请注明出处 谢谢

B站入口

打赏通道

微信公众号二维码如下:

img

乱码三千 – 点滴积累 ,欢迎来到乱码三千技术博客站

JS使用正则从文本中提取所有的url

发表于 2021-08-18

需求

有一段文本如下:

1
2
3
4
5
6
我是文本
![](https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fn.sinaimg.cn%2Ftranslate%2F620%2Fw910h510%2F20180429%2FfvFl-fzrwiaz1256884.jpg&refer=http%3A%2F%2Fn.sinaimg.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1631068659&t=f21770640c21b19d6236c33ac13f77c3)

[点击下载](http:it.newban.cn)

![](https://gitee.com/songjianzaina/SavePicGoPic/raw/master/img/20210106181201.png)

需要将里面所有的非图片url提取出来并替换

实现

  1. url提取代码如下:
1
2
3
4
5
6
7
8
9
10
11
 let allReg = new RegExp("[^!]\\[.*\\]\\((http.+)\\)", "g");

let result;
let allArr = [];
while ((result = urlReg.exec(data)) != null) {
getShortUrl(result[1], (value) => {

allArr.push(value)
});
}
// allArr里面装着所有匹配到的url
  1. url替换;
1
2
3
4
//比如将所有的链接替换成A
allArr.forEach(e=>{
data.replace(e,"A")
})

RegExp对象介绍

1
2
3
4
let reg=new RegExp("[^!]\\[.*\\]\\((http.+)\\)","g")

//或者简写成
let reg=/[^!]\\[.*\\]\\((http.+)\\)/g;

参数:

第一个参数填入正则表达式, 第二个参数填入正则修饰符,其中g表示全局匹配

正则表达式修饰符:
修饰符 描述
i 执行对大小写不敏感的匹配。
g 执行全局匹配(查找所有匹配而非在找到第一个匹配后停止)。
m 执行多行匹配。

常用方法:

使用String对象的match方法匹配多个:

1
2
let arr=data.match(reg);
//返回一个装有匹配到内容的数组

exec方法 用于匹配单个:

1
2
3
let reg=new RegExp("[^!]\\[.*\\]\\((http.+)\\)")
let element=reg.exec("http:xxxxx")
//返回第一个匹配到的内容

在不加第二个参数g的前提下, 重复执行exec方法, 始终返回第一个

如果加了g ,重复执行相当于遍历, 如下:

1
2
3
4
5
let reg=new RegExp("[^!]\\[.*\\]\\((http.+)\\)","g")
let element=reg.exec("http:xxxxx")
//返回第一个
let element2=reg.exec("http:xxxxx")
//返回第二个

test方法, 检查是否有符合匹配的存在:

1
2
let reg=new RegExp("[^!]\\[.*\\]\\((http.+)\\)","g")
let isHas=reg.test("http:xxx")//如果匹配上了返回ture 否则false

String对象的search方法也可以检查是否有符合匹配的存在:

1
2
let index=data.search(reg);
//index为-1表示没有匹配上 否则 匹配成功

示例

  1. 从url中提取子域名

    1
    2
    var url = "http://xxx.domain.com";
    console.log(/[^.]+/.exec(url)[0].substr(7)); // logs "xxx"
  2. 从一个单词中分离出Unicode 字符

    1
    2
    3
    4
    5
    6
    7
    8
    let text = "Образец text на русском языке";
    let regex = /[\u0400-\u04FF]+/g;

    let match = regex.exec(text);
    console.log(match[1]); // prints "Образец"

    let match2 = regex.exec(text);
    console.log(match2[1]); // prints "на" [did not print "text"]

使用前建议使用正则表达式测试工具验证正则表达式是否可行

本文为作者原创 转载时请注明出处 谢谢

B站入口

打赏通道

微信公众号二维码如下:

img

乱码三千 – 点滴积累 ,欢迎来到乱码三千技术博客站

Android开发中实现全局数据共享的几种方式

发表于 2021-08-17

前言

这里的数据并不是指单纯的字面值数据, 字面值数据我们可以使用数据库实现, 但是如果我们需要将一些变量, 对象设置成全局共享 那么有以下几种方式

  • 静态变量/常量
  • 单例
  • 枚举
  • 后台服务

静态变量/常量

既可以存储字面值数据, 也可以存储引用型数据

单例

全局唯一的对象实例, 这个不必多说

枚举

由静态常量/变量延伸而来, jdk早期版本不支持枚举, 都是使用静态常量替代

枚举使用相对静态常量更加方便

后台服务

属于Android独有, 四大组件之一, 可以利用service维护一个全局唯一对象或者变量

由于Service自带Context对象, 因此在需要使用到Context的场景下推荐使用Service来实现全局数据共享, 避免内存泄露

本文为作者原创 转载时请注明出处 谢谢

B站入口

打赏通道

微信公众号二维码如下:

img

乱码三千 – 点滴积累 ,欢迎来到乱码三千技术博客站

Web中关于转发和重定向的区别

发表于 2021-08-16

转发

服务端内部页面的跳转, 只作用于服务器内部, 和浏览器无关

在这里插入图片描述

特点:

  • 地址栏不发生变化,显示的是上一个页面的地址

  • 请求次数:只有1次请求

  • 请求域中数据不会丢失

关键方法:

1
request.getRequestDispatcher("/jump_ad").forward(request, response)

示例:

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

@CrossOrigin
@RestController
class JumpControllor {

@Autowired
lateinit var shortService: ShortKeyService


@GetMapping("/test")
fun test(
response: HttpServletResponse,
request: HttpServletRequest
) {
request.getRequestDispatcher("/jump_ad").forward(request, response)
}

@GetMapping("/jump_ad")
fun jumpAd(request: HttpServletRequest,response: HttpServletResponse) {
response.writer.println("哈哈哈")

}


}

转发

浏览器端的页面跳转, 同时作用于浏览器和服务端

在这里插入图片描述

特点:

  • 地址栏:显示新的地址
  • 请求次数:2次
  • 请求域中的数据会丢失,因为是2次请求

关键方法:

1
response.sendRedirect("新地址")

示例:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
@CrossOrigin
@RestController
class JumpControllor {

@Autowired
lateinit var shortService: ShortKeyService


@GetMapping("/test")
fun test(
response: HttpServletResponse,
request: HttpServletRequest
) {
response.sendRedirect("http://www.baidu.com")
}


}

本文为作者原创 转载时请注明出处 谢谢

img

乱码三千 – 点滴积累 ,欢迎来到乱码三千技术博客站

1…232425…50

乱码三千

android程序员一枚,擅长java,kotlin,python,金融投资,欢迎交流~

491 日志
143 标签
RSS
© 2025 乱码三千
本站总访问量次
由 Hexo 强力驱动
|
主题 — NexT.Muse v5.1.4
0%