Fork me on GitHub

深入掌握 OSS:最完美的 OSS 上传方案!

原文链接

上传文件一般不会直接存在服务器目录下,这样不好扩展,一般我们会用阿里云的 OSS(Object Storage Service)对象存储服务,它会自己做弹性扩展,所以存储空间是无限的。

OSS 对象存储是在一个 bucket 桶下,存放多个文件。

它是用 key-value 存储的,没有目录的概念,阿里云 OSS 的目录只是用元信息来模拟实现的。

上传文件后,我们能拿到文件 URL,但生产环境下我们不会直接用 OSS 的 URL 访问,而是会开启 CDN,用网站域名访问,最终回源到 OSS 服务。因此还需要开通 CDN 服务

不管在哪里上传,都需要 acessKeyId 和 acessKeySecret。

这个是阿里云的安全策略,因为直接用用户名密码,一旦泄漏就很麻烦,而 acessKey 泄漏了也可以禁用。而且建议用 RAM 子用户的方式生成 accessKey,这样可以最小化权限,进一步减少泄漏的风险。

客户端直传 OSS 的方式不需要消耗服务器的资源,但是会有泄漏 acessKey 的风险,所以一般都是用服务端生成临时的签名等信息,然后用这些信息来上传。

搭建图床(Typora+PicGo+阿里云OSS)

一、Typora

(PS:若使用 Obisidian 也大同小异)

Typora设置PicGo

二、PicGo

下载链接:https://molunerfinn.com/PicGo/

1. 图床设置

需要填 6 个表单项

1)图床配置名(这个可以随便填)

2)KeyId

3)KeySecret

4)Bucket

5)存储区域

6)存储路径

别着急,具体怎么填在下一步

图床设置

2. PicGo设置

推荐把 “时间戳重命名” 打开

PicGo设置

三、阿里云 OSS

1)在 阿里云官网 找到 对象存储 OSS,并选择立即开通

开通 OSS

2)创建 Bucket 存储桶

  • Bucket 名称就是 PicGo 配置中要填的 Bucket
  • Endpoint 就是 PicGo 配置中要填的 存储区域(比如 oss-cn-hangzhou)(.aliyuncs.com不需要填)

创建 Bucket

3)创建 AccessKey ID 和 AccessKey Secret

  • AccessKey ID 就是 PicGo 配置中要填的 KeyId
  • AccessKey Secret 就是 PicGo 配置中要填的 KeySecret

创建 AccessKey

4)在 Bucket 中新建目录

  • 目录 就是 PicGo 配置中要填的 存储路径

新建存储目录

四、测试

测试上传图床

进阶操作

  • 为图床增加自定义域名

    • 该域名需要进行 ICP 备案
    • 同时最好已经获取 SSL证书
  • 使用 RAM 访问控制

    • 创建用户,选择开通 OpenAPI,获取 AccessKey ID 和 AccessKey Secret
    • 别忘了给该用户添加上有关 OSS 的权限(例如:管理对象存储服务(OSS)权限)

FAQ

1)Mac系统安装PicGo时打开报错:“PicGo.app”已损坏,无法打开。 你应该将它移到废纸篓。

解决办法,打开终端输入以下内容,””为安装路径,默认是以下路径

1
sudo xattr -d com.apple.quarantine "/Applications/PicGo.app"

按照提示输入电脑锁屏密码回车即可

2)都配置好了,但还是上传报错

确认存储区域,就是上面的 Endpoint 的地址 ,比如你的是,oss-cn-beijing.aliyuncs.com 那么这里就是 “oss-cn-beijing”,去掉阿里云的后缀

面试官问我按钮级别权限怎么控制,我说v-if,面试官说再见

原文链接

按钮级别权限控制,怎么做?使用v-if ?可以,但不够通用。

要做权限控制,肯定需要一个code,无论是权限码还是角色码都可以,一般后端会一次性返回,然后全局存储起来就可以了

文章作者提供了三个思路

  1. 函数方式

    本质上就是通过v-if,只不过是通过一个统一的权限判断方法hasPermission

  2. 组件方式

    使用Authority包裹需要权限控制的按钮即可,该按钮需要的权限码通过value属性传入

  3. 指令方式

    v-auth

ps:评论区有其他见解

使用装饰器配置权限标识

前端无非就是调用后端权限状态集合,根据集合控制相应dom是否渲染,怎么实现都行,麻烦的就是状态集合的约定和维护,要有严格的规范和约定。
而且,真正的权限控制只让前端处理是不严谨,后端同时也要确保相应业务功能接口的无权访问,这就要把ui、权限码、api三者关联维护起来,这就考验团队整体素质了。

【English】挑战52天背完小猪佩奇

挑战52天背完小猪佩奇

小猪佩奇 第一季 英文版 Peppa Pig

B 站-挑战52天背完小猪佩奇,必看flag!

谁能想象一个已经毕业过了四六级的打工人,还在这里看小猪佩奇…

顺带恢复一下我颓掉的英语记忆

Day1 Muddy Puddle

  • younger brother/older brother 弟弟/哥哥(常用,little brother/big brother 更亲密更形容小孩子)

  • It’s stopped raining. 雨停了(此处是现在完成时,it has 省略为 it’s

  • go and play 去玩(有时下意识会 go to play)

  • have a lot of fun 玩得很开心

  • Guess what we’ve been doing 猜猜我们刚才在做什么(现在完成进行时 have been doing sth. 描述刚才某段时间的一直做的事)

  • Have you been watching television? 你们刚刚一直在看电视吗?

  • You’ve been junmping in muddy puddles. 你们刚才在泥坑里跳

  • Look at the mess you’re in. 看看你们有多脏(you are in)

  • when we’ve cleaned up 当我们清理干净(when+现在完成时态的句式很常见)

Day2 Mr.Dinosaur Is Lost

  • George’s favourite toy is Mr. Dinosaur. 乔治最喜欢的玩具是恐龙先生

  • Sometimes, George likes to scare Peppa with Mr.Dinosaur. 有时,乔治喜欢用恐龙先生去吓佩奇

  • at breakfast time/at lunch time/at supper time 在早饭/午饭/晚饭时间

  • at dinner time(正餐,比较丰盛,美国常指晚饭,英国常指午饭)

  • at bath time 洗澡时间

  • When George goes to bed, Mr.Dinosaur is tucked up in bed with him. 当乔治睡觉的时候,恐龙先生和他睡在一起(tuck sb in/tuck sb up in bed 给某人盖被子)

  • throw sth. up in the air and catch sth. when it falls back down

  • try and guess 猜猜看(有时下意识会 try to guess)

  • George doesn’t know where Mr.Dinosaur is. 乔治不知道恐龙先生在哪里(宾语从句)

  • It is a job for detetive 侦探登场

  • George always has Mr.Dinosaur have bath with him.(have sb do… 让某人做,安排某人做)

  • Mr.Dinosaur isn’t anywhere. 恐龙先生哪儿都没有

  • I was going to say that. 我正准备说这个呢

  • You do love to throw Mr.Dinosaur in the air. 你确实喜欢把恐龙先生扔到空中(do 表示强调)

  • There he is. 他在那儿

  • It’s nice to have you back. 很高兴你回来了

Day3 Best Friend

  • Suzy Sheep has come to play with Peppa. 小羊苏西来找佩奇玩

  • Why don’t you go and play in your bedroom?

  • So does George. 乔治也是(So do I 我也是 等同于 I do,too)

  • (我也是,表否定时,Neither do I === I don’t,either , Neither am/can I, Me neither)

  • Peppa and Suzy want to play on their own. 佩奇和苏西想要自己玩

    • on one’s own 不需要别人帮助 自觉自立自强,靠自己的感觉,与能力有点关系
    • by oneself 没有人陪同,表示一个人
  • I’am a tiny little fairy princess. 我是一位小小仙女公主

  • I am going to wave my magic wand. 我要挥舞我的魔法棒

  • turn sb. into sth. 把某人变成某物 turn you into a frog 把你变成🐸

  • will 和 be going to(be gonna) 的区别

    • 表将来时
      • will 聊天过程中的瞬时意愿
      • be going to 一般是经过思考规划的意愿
    • 表推测(一些细微差别)
      • will 表推测 觉得未来会发生 I think you will win
      • be going to 表推测 马上会发生 You are gonna lose. It’s going to rain.
  • Someone needs to lick out the bowl. 需要帮忙舔干净这个碗

  • Who’s gonna be the sick person? 谁来当病人呢?

  • take one’s temperature 量某人体温

  • I have a sore tummy. 我肚子有点痛 I have a sore head/stomach/throat 我头/胃/嗓子疼 === My stomach hurts.

  • That tickles! 这好痒啊 That hurts. 好痛

  • I hear it rumbling. 我听到隆隆叫

Day4 Polly Parrot

  • granny/granpa 奶奶/爷爷

  • What’s this called? 这叫什么?(例如喝了某饮料,不知道它叫什么)

  • That’s what parrots do. 鹦鹉就是这样的 (That’s what dads do. 这是父亲该做的事

  • Have you finished your cake?

  • Are you sure you’ve completely finished your chocolate cake? (宾语从句)

  • Off you go. 去吧(但说话并不客气)

  • George is a little bit shy. 乔治有一点点害羞

  • Peppa and George are pretending to be parrots. 佩奇和乔治在假装他们是鹦鹉 (**pretend to do sth.**)

  • Peppa is thinking of something else to say to Polly Parrot. (think of + sth. / think + 句子)

    • think of 简单地想 ps.Think of a number bewteen 1 and 10
    • think about 深入地思考 ps.What are you thinking about?

Day5 Hide and Seek

  • When is it my turn to be happy. 什么时候轮到我快乐

  • George has found somewhere to hide just in time. (just in time 正好,刚刚好 )

  • Here I come. 我来啦 (Genshin Impact. Here I come! 原神启动!)(对某个地方说我来了)

  • What can it be? 这会是什么呢?

  • Come over here. 过来 (距离远一点的 过来)come here.

Day6 The Playgroup

  • playgroup 幼儿游戏班 kindergarten 幼儿园(正经的幼儿园)

  • look forward to doing sth. 期待做某事

  • There’ll be you and Mr.Dinosaur there to keep him company. 你和恐龙先生会陪在他身边的。(to keep him company 不定时短语,对主语的附加说明)

  • brilliant 太棒了

  • Shall we show George how can we paint pictures? 让我们给乔治看看我们是怎么画画的好吗?

  • flower 花 petal 花瓣 stalk 茎 leaf 叶 leaves

  • How’s / How are xx going? xx怎么样?

Day7 Mummy Pig at Work

  • mum 英式 mom 美式
  • Can we go and watch Mummy work on her computer? (看某人做某事用 watch)
  • lap (坐下来的大腿,laptop computer 笔记本电脑,放在大腿上的电脑,desktop computer 台式电脑,放在桌子上)thigh 大腿
  • The computer is not meant to do that. (be meant to sth. 本应该是做某事)
  • What’s it? 怎么了?啥事?
  • mend the computer 修电脑
  • I am a bit of an expert at these things. 看来我是这方面的专家
  • What on earth is going on? 现在究竟是什么情况?

Day8 Piggy in the Middle

  • That’s how to catch the ball. 要这样才可以接到球 (=== You should catch the ball like this.)
  • That’s what you did. 你刚刚是这样做的
  • What a cheeky little piggy Peppa is. (naughty 顽劣 cheeky 淘气active 好动的 )
  • I’m just teasing you. 我只是在逗你 (tease)
  • I’ve been feeling a lot of stress lately 最近我感到很大压力(现在完成进行时)
  • Not really. 不太 xx (委婉的 No)
  • Here’s your coffee. (你要的咖啡)
  • Can you give me a hand? (你能帮帮我吗?)

Day9 Daddy Loses His Glasses

  • Daddy Loses His Glasses (标题用的是一般现在时)
  • Everything looks a bit soft and fuzzy. 所有东西看起来都有点模糊的。(soft 柔软的 轮廓不清的 fuzzy 模糊的)
  • Have you seen my phone? 见到我手机了吗?(找东西或找人的时候,问别人有没有见过一般都用现在完成时)
  • it make him very grumpy. 这让他很焦躁
  • This is ridiculos. 真荒谬
  • pillow 枕头 slipper 拖鞋
  • bump into 撞到 knock over 碰倒
  • You were sitting on them all the time! 原来你一直都坐在眼镜的上面(用过去进行时 + all the time 更适合当前语境,表达“原来”两字的意思)

Day10 Gardening

  • 介词
    • in + 大地方(国家、城市)
    • at + 小地方(at the library)有时候也可以用 in
    • on + 道路
  • What do we do? (通常等同于 What should we do? 我们应该做什么?)
  • Exactly. 确实,没错
  • We wait for it to grow. (wait for sb. to do sth. 等待某人做某事,注意 wait for)
  • Why aren’t you eating? 你怎么不吃啊?(当你觉得对方应该在做某件事,但是 他没有做的时候也会用现在进行时)
  • Next time you come,the seed will have growed into a plant. (时间状语从句,主将从现)(,… 好久没听到“主将从现”这个词了哈哈)

Day11 Hiccups

  • hiccup 打嗝 n v (I have/get hiccups now. )
  • not while 接条件 表示没有这个条件你可以做你说的事
  • You have done it all wrong. 你做的都是错的
  • stick your tongue out 伸出舌头(stick out 伸出)
  • turn around 转圈
  • You must be given a shock. 你必须得被吓一跳
  • This is just pretend scaring you. 这只是假装吓你 (这里 pretend 是作形容词)
  • I’m not as little as George, I can drink as quickly as I want (**as…as…**像某人的某个特征)
  • spoil the game 破坏这场游戏

Day12 Bicycles

  • Let’s race to Daddy’s pumpkin.
  • We have to be very careful not to bump into it. 小心别撞到它
  • Watch out for my pumpkin. 小心我的南瓜
  • stabilizer 辅助轮(小孩自行车后的)
  • Are you coming? 你要不要来?(常用)No, I will stay here.
  • Will you come? 你来吗?
  • You’ve never done it before. 你之前从没这么干过
  • Don’t let go. 别放手(Let go of me. 放开我 Let go of my hair. 放开我的头发)
  • Keep pedalling. 继续踩踏板 (pedal 踏板 n.v.)
  • for ages = for a long time 一段时间
  • I’m going to win! 我要赢了!
  • I squashed your pumpkin. 我压坏你的南瓜了

Day13 Secrets

  • That’s all your guess. Used up! 你所有的猜测机会都用完了 (完整是 I have used up)
  • What do you got there? 你手里拿着的是什么?(或者 What you got there? === What have you got there?)
  • I’ll never guess. 我永远也猜不到
  • On the count of three 我数到三
  • I’ve got nothing else. 我什么都没有了(have got 习惯这么写)
  • doughnut 甜甜圈
  • Are you goint to.. 你想要..

Day14 flying a kite

    • fast 速度快 (run fast)
    • quickly 快导致时间少(don’t drink juice too quickly)
  • No matter how fast you run, if there isn’t any wind, the kite won’t fly. 无论你跑多快..

  • We’ll just have to wait, until the wind picks up a bit. (我们必须等,等到稍微来点风)

  • I don’t want you coverd in mud. (我不想你们搞得浑身是泥)

    I think/know that + 句子 (比较正常)

    但如果是 I don’t want that you are coverd in mud. 显得怪,会误以为两句话

    I don’t want you coverd in mud. (其中 cover in mud 即补充说明 you)

    I don’t want you to get hurt. I don’t want you teaching me.

  • Nonsense 胡说 I know exactly how heavy I am. 我很知道我多重

  • Now that we are all in muddy, 既然现在(使用 that 表示既然的意味在里面)

  • I suppose so. 我想是这样的 (更委婉 比起)

Day15 Picnic

  • picnic blanket 野餐垫
  • This spot looks very nice. 这地方看起来不错 (与place相比 spot更精准的一块地方)
  • This looks like just the spot for our picnic!
  • have a nap 小睡一下
  • I certainly don’t want to run a around. 我可不想跑来跑去
  • I thought you wanted to run around a bit. 你不是想到处跑跑吗
  • they’ve had enough 他们已经吃够了
  • So much for … …也就这么多了 (so much for your knowledge!你的才学也就这么多了!)
  • if there’s any cake left over 如果有剩下的蛋糕
  • What a fuss. 别大惊小怪
  • All you have to do is sit here and be quiet 你要做的就是坐着并保持安静
  • Scram 滚开 get it off me 从我身上走开
  • Daddy is running too fast for the wasp to catch him. (以至于黄蜂抓不到他)
  • I didn’t believe you would actually do it.
  • You’re most welcome. 不要那么客气 (You’re most welcome to come 非常欢迎你来)

Day16 Musical Instruments

  • tidy the house 整理房子
  • used to 从前、以前常常(在某些语境下,暗含“常常”的意思)(通常代表现在已经不是这样了)
  • didn’t used to 从前不..
  • This is the violin I used to play when I was a little. 这是我小时候拉的小提琴
  • I haven’t play it for a long time. 我很久没拉了
  • I haven’t told her yet. 我还没和她说呢
  • I hope I haven’t forgotten how.. 我希望我还没忘记如何..(拉小提琴)
  • Bravo! 太棒了
  • accordion 手风琴
  • I think I used to be able to play it. 我记得我以前可以演奏这个的。
  • Just stick to the accordion. 你还是接着拉你的手风琴吧 (stick to 坚持做某事的意味)
  • Even if I say so myself 不是我自夸

Day17 Forgs and Worms and Butterflies

  • What a coincidence 真巧
  • Peppa is playing at being a butterfly. 佩奇在扮演一只蝴蝶
  • First, you have to lie down on the ground. Then you wriggle around. 躺在地上,扭来扭去 (wriggly 蠕动的)
  • Frogs aren’t as pretty as butterflies or **as wriggly as worms. **
  • I like frogs the best. === I like frogs best

Day18 Dressing Up

  • now for.. 现在到了..时间
  • George is getting a bit bored. 乔治正逐渐变得无聊(be getting + adj 很常用)
  • I’m nearly finished. 我马上做完了 === I’m nearly done.
  • All done. 搞定,做完了
  • I’m here to break up with you. / for your wedding. 我来这是和你分手的/我来这上参加你的婚礼的(常用)
  • You really have us fooled. 你真把我们骗了(重点在我们被骗了)
  • You can’t have the door closed (重点在门被关了)=== You can’t close the door

Day19 New Shoes

  • I’m sure we can find them.
  • Now I haven’t got any shoes to wear. === I don’t have any shoes to wear
  • Poor Peppa. Your shoes were a bit old. 可怜的佩奇
  • They make you look very beauty.
  • I don’t want to ever take them off. ( === I don’t want to take them off forever. 常用 ever = at any time 表任何时间) Don’t ever tell me what you did.
  • I don’t think you wanna go in there. 你最好别进去
  • even for me,即使是我
  • Peppa is in her pajamas 穿着她的睡衣
  • It has been raining all night. (现在完成)
  • She doesn’t want to get her shoes wet. 不想把鞋弄湿(get 常用 get my hands dirty)

Day20 Fete

  • Today is the day of the school fete. (fete 用的少,amusement park 游乐园)

  • the bouncy castle 充气城堡 (bouncy 有弹性的)

  • there isn’t time.

  • there aren’t any clothes

  • I‘ve got to get my license renewed

  • How do you know? 你怎么知道?

  • Tigers creep very slowly 爬

  • lick sth. clean 舔干净

  • Let’s get you all balloon. 每个人都有气球

  • I’ve got all those. 我全都有

  • Most important of all 最重要的是

  • I don’t seem to have any dinosaur balloon. 我似乎没有

  • You don’t seem to like it.

  • I’ve got an idea.

  • could we have two of the long ballons?

  • Can anyone guess what it is?

  • kangaroo 袋鼠 giraffe 长颈鹿

  • This is the best day ever. 这是最棒的一天(ever 常用 )

Day21 Mummy Pig’s Birthday

  • breakfast in bed 床上早餐

  • take your time 慢慢来

  • Who is it? (别人敲门或电话打来 It’s Tom)

  • We need the same number of candles as Mummy’s age.

  • Whisper it. 悄悄说

  • Do I have any other choice? 我有其他选择吗?

  • What hard work birthdays are. 过生日真费力

  • Why aren’t you coming inside?

  • Blow the candles out and make a wish. 吹灭蜡烛再许愿

  • two tickets to the theater 两张剧院的票

Day22 The Tooth Fairy

  • Where did it come from? 这是从哪来的?
  • Look in the mirror. 照镜子
  • Will you grow up? 你能不能成熟点?
  • How late did you stay up late last night? 你昨天熬夜到多晚阿?
  • Let’s stay up all night 通宵
  • Would you like this coin in return for your tooth? 你想要这个硬币交换你的牙齿吗?
  • I didn’t fall asleep. 我没睡着
  • You‘ve been in my room before. 来过
  • Where have you been? 你去哪儿了?

Day23 The New Car

  • I’m gonna go for a drive 我正要去兜风 (go for a run/walk 去跑步/散步)
  • I run a restaurant. 我开了一家餐厅
  • When you come back, I’ll have fix your car. (将来完成时)
  • Which button closes the roof ? 哪个按钮是关车顶的? === Which is the button to close the roof?
  • squirt all over your face with water 喷你一脸的水

Day24 Treasure Hunt

  • Have you done? / Are you finished/done? 你好了没?

  • No need to panic. I’m almost done. 别慌,我马上好了(Don’t panic 更常用)

  • You’re holding the map upside down. 你地图拿反了 (upside down上下反 inside out 里外反 backwards 前后反)

  • I thought as much. 我就知道/我猜到了

  • I can’t make it out. 我辨认不出来

  • Let’s take a look. 让我们来看一下

  • There doesnt’t seem to be anything here. 这里似乎没有东西

  • It’s worth a lot. 这很值钱(be worh a fortune)

  • Everyone gets cakes … 每个人都有蛋糕

Day25 Not Very Well

  • I don’t feel very well. 我感觉不太舒服 == I’m not very well

  • I’ll be right there. 我很快会到那儿 (常用)(== I’ll be there soon)

  • It’s not serious. 不严重

  • It doesnt’ taste good. 它不好吃 === it tastes terrible

  • I’ll come back later to see if she is better. 我等会来看看她有没有好一点

  • The rash doesn’t catching. 这疹子不传染

  • Are you really ill? Yes! It’s not pretend! 不是装的

  • (There are) no more red spots. 没有红点了

  • Aren’t I still a bit ill? 我不是还有一点病吗?(可以用 are)

  • Who wants to join us? Who told you that?

Day26 Snow

  • go play in the snow. (口语常用表达 go see a movie 简单)
  • make footprints in the snow 踩脚印
  • maybe it’s getting a little too rough 可能有点过火了
  • build a snowman

Day27 Windy Castle

  • get grumpy 变得焦躁
  • Are we almost there yet? 我们快到了吗? Not yet/quite. 还没
  • I’ll go first. 我先来
  • The load doesn’t look the same as it does on the map. 这条路看起来和地图上看起来不一样
  • Excuse me, could you tell me how to get to the bus stop?

Day28 My Cousin Chloe

Day29 Pancakes

Day30 Babysitting

Day46 End.

【Hexo】使用笔记

一、初识Hexo

1._config.yml

了解_config.yml配置文件的参数信息。网站的 配置 信息,可以在此配置大部分的参数。

2.生成文章

1
hexo new "post title with whitespace"

生成草稿

1
hexo new draft "draft test"

预览草稿(直接使用 hexo server 是无法看到草稿的)

1
hexo server --draft

3.生成静态文件

1
hexo g

4.部署

1
hexo d

二、配置

开启文章资源文件夹

1
post_asset_folder = true

三、分类

1
hexo new page categories

四、搜索

1
npm install hexo-generator-searchdb --save

然后将以下配置复制到你博客根目录下的 _config.yml 里:

1
2
3
4
5
# hexo-generator-searchdb
search:
path: search.xml
field: post
format: html
1
npm install hexo-generator-feed --save

然后将以下配置复制到你博客根目录下的 _config.yml 里:

1
2
3
4
5
6
7
8
9
feed:
type: atom
path: atom.xml
limit: 20
hub:
content:
content_limit: 140
content_limit_delim: " "
order_by: -date

【云计算】

云计算服务通常分为三个基本类型:

  • 基础设施即服务(IaaS):提供虚拟化的计算资源,如虚拟机、存储空间、网络等。
  • 平台即服务(PaaS):提供应用程序开发和部署的平台,包括操作系统、数据库管理系统、开发工具等。
  • 软件即服务(SaaS):提供通过互联网访问的应用软件,客户无需安装即可使用这些应用。

云服务器 ECS

云服务器ECS(Elastic Compute Service)是提供可弹性伸缩的计算能力的IaaS级别云计算服务。即虚拟的物理服务器,由服务商搭建维护,用户按需租赁使用。

用户可以通过互联网远程访问这些虚拟化的计算资源,并且可以根据业务需求快速地调整资源配置,例如CPU、内存、硬盘空间等。ECS消除了传统物理服务器的硬件投资和维护成本,提供了灵活、高效、可靠的计算服务。

PS:不同厂商对云计算服务有不同的叫法,

  • 阿里云 叫 云服务器 ECS(Elastic Compute Service)
  • 腾讯云 叫 云服务器 CVM(Cloud Virtual Machine)
  • 移动云 叫 云主机 ECS

云服务器 ECS 由什么组成?

云服务器通常包含实例、镜像、块存储、安全组、快照、网络等功能组件。

  • 实例:等同于一台虚拟服务器,内含 vCPU、内存、操作系统、网络额配置、磁盘等基础计算组件。
  • 镜像:等同于“装机盘”,为 ECS 实例提供操作系统和预装的软件。
  • 块存储:分布式数据存储设备。
  • 安全组:一种虚拟防火墙,划分安全隔离区域,实现网络访问控制
  • 快照:某一时间点云盘的实时副本,常用于数据备份/恢复、应用容灾、制作镜像等。
  • 网络:主要是有专有网络 VPC,在逻辑上可彻底隔离的云上私有网络。

以下是移动云的例子

实例:提供各种实例规格(CPU、内存),不同 CPU 内存比,从“1核2G”到“80核1280G”,移动云的通用型s5云主机规格,s5.large.2,vCPU 2 个,内存 4GB,s5.xlarge.2则是 4C8G

镜像:是用于创建 ECS 的模板。支持多种 Windows 和 Linux 操作系统,可以选择公共镜像、私有镜像(已部署好业务的 ECS 可创建为自定义镜像,镜像文件.qcow2)

块存储:移动云的云硬盘,有多种类型:容量型、性能型、性能优化型、高性能型

网络:虚拟私有云 VPC(Virtual Private Cloud)基于先进的SDN 技术,为云服务器、云容器、云数据库等云上资源构建隔离、私密的虚拟网络环境,使用户能够构建独立的网络空间。支持子网管理(子网是由一组IP地址组成的地址池,每个子网相当于一个分布式虚拟交换机),支持多网卡功能(创建云主机时系统自动创建一个虚拟网卡,为云主机提供虚拟网络功能)应用场景

专有宿主机 DDH

专有宿主机 (Dedicated Host,简称DDH)是专为企业用户定制优化的解决方案。具有物理资源独享、部署更灵活、配置更丰富、性价比更高等特点。专有宿主机为单租户独享物理资源,同时宿主机上可以灵活创建ECS云服务器,并和其他ECS云服务器一样,可以挂载云盘,可以通过VPC联通,具有高度的灵活性和使用便捷性。

负载均衡 SLB

负载均衡(Server Load Balancer,简称SLB)是云原生时代应用高可用的基本要素。是一种对流量进行按需分发的服务。通过将流量分发到不同的后端服务来扩展应用系统的服务吞吐能力,消除单点故障并提升应用系统的可用性。

弹性公网

弹性公网IP EIP(Elastic IP Address)是独立的公网IP资源,可与专有网络VPC类型的云服务器ECS、NAT网关、ENI网卡、私网负载均衡SLB绑定,并可以动态解绑满足灵活管理的要求。弹性公网IP可以给在云上部署的网站提供Internet访问服务。

EIP 与 ECS固定公网IP 的区别

下表描述了EIP与ECS固定公网IP的区别。

比较点 EIP ECS固定公网IP
支持的网络环境 专有网络 专有网络和经典网络
是否支持单独持有 支持 不支持
是否支持在ECS实例上的弹性插拔 支持

产品优势

EIP的优势如下:

  • 独立购买与持有
    您可以单独持有一个EIP,作为您账号下一个独立的资源存在,无需与其它计算资源或存储资源绑定购买。
  • 弹性绑定
    您可以在需要时将EIP绑定到指定的资源上,在不需要时将EIP解绑并释放,避免不必要的计费。
  • 灵活配置的网络能力
    您可以根据业务需求随时调整EIP的带宽峰值,带宽峰值的修改即时生效。
  • 计费灵活、成本低
    多种计费策略,支持包年包月、按固定带宽和按使用流量计费。EIP加入共享带宽后可以降低带宽成本。

虚拟私有云 VPC

虚拟私有云VPC(Virtual Private Cloud,简称VPC)是一个公共云计算资源的动态配置池,需要使用加密协议、隧道协议和其他安全程序,在民营企业和云服务提供商之间传输数据。一个VPC基本上把提供商的多租户架构变成单租户架构。

每个专有网络都由至少一个私网网段、一个虚拟路由器和至少一个交换机组成。

NAT 网关

NAT网关(NAT Gateway,简称NAT)提供公网NAT和私网NAT两种功能。公网NAT网关通过自定义SNAT、DNAT规则可为云上服务器提供对外公网服务、及主动访问公网能力;私网NAT网关(也即VPC NAT网关)可使VPC内的ECS实例通过私网地址转换服务,实现VPC与VPC之间、及VPC与线下IDC互访能力。

SSL 证书

SSL证书(Secure Sockets Layer证书)是一种安全协议,用于在互联网上的服务器和浏览器之间建立加密链接。这意味着所有在服务器和浏览器之间传输的数据都是加密的,这有助于保护敏感信息免受黑客攻击,如信用卡信息、登录凭据和个人信息等。

SSL证书的工作原理是通过使用公钥和私钥来加密数据。当用户访问使用SSL的网站时,浏览器和服务器会进行一个称为”握手”的过程,以建立一个加密连接。SSL证书还包含了证书持有人的身份信息,并由第三方机构(证书颁发机构,CA)签发和验证,以确保用户访问的网站是合法的。

可以在阿里云,申请免费证书,但免费证书的签发有效期是 3 个月(之前是 12 个月),到期要重新申请。

PS:在宝塔面板中添加 SSL 证书的密钥(key)证书(pem),并打开强制 HTTPS,别忘了安全组里要开放 https(443)端口

对象存储 OSS

对象存储 OSS(Object Storage Service)是一款海量、安全、低成本、高可靠的云存储服务,提供最高可达 99.995 % 的服务可用性。多种存储类型供选择,全面优化存储成本。

【React】笔记

创建 react

https://zh-hans.react.dev/learn/start-a-new-react-project

React 入门

JSX

JavaScript 和XML的缩写

在 JS 中编写 HTML 模板结构

通过 Babel 编译 成 JS

组件化开发模式

组件类型

  • 函数式组件
  • 类式组件

React 面向组件编程

组件三大核心属性

state

props

propType 用于对 prop 的类型和必要性的限制

refs

组件内的标签可以定义ref属性来标识自己,可以通过 ref 获取某个 dom 元素的值

  • 字符串形式的 ref (不推荐),从 this.refs 中取节点

  • 回调函数形式的 ref

    1
    <input ref={c => this.input1 = c } type="text" placeholder="点击按钮提示数据"/>

    把 ref 所处的当前的节点放到组件实例的 input1 属性中

函数柯里化(高阶函数)

生命周期钩子

  • constructor 构造器
  • componentWillMount 组件将要挂载
  • render 渲染
  • componentDidMount 组价挂载完毕
  • componentWillUnmount 组价将要卸载

生命周期(新)

React 应用(脚手架)

全局安装脚手架

1
npm i -g create-react-app

组件化编码流程

  1. 拆分组件
  2. 实现静态组件
  3. 实现动态组件
    1. 动态显示初始化数据
      1. 数据类型
      2. 数据名称
      3. 保存在哪个组件?
    2. 交互
1
2
3
<Item {...todo}></Item>
// 等价于
<Item id={todo.id} name={todo.name} ></Item>

状态在哪里,操作状态的方法就在哪里

组件通信

父 -> 子

通过 props

子 -> 父

通过 回调函数,父组件把函数传给子组件,子组件在合适的时候,调用该函数,将值传入该函数

兄弟组件之间通信

消息订阅与发布

1
2
3
1) import PubSub from 'pubsub-js' //引入
2) PubSub.subscribe('delete', function(msg,data){ }); //订阅
3) PubSub.publish('delete', data) //发布消息

React ajax

第三方 ajax 库 axios

1
import axios from axios

脚手架配置代理

实现跨域请求

中间代理 没有 ajax 引擎,而是通过请求转发的形式,不存在跨域问题,能获取返回的数据

多个不同代理,要编写 setupProxy.js 配置具体代理规则

后端 跨域用 cors

React 路由

Redux

创建 react 项目

1
npx create-react-app react-basic

index.js

App.js

useState

数据驱动视图

直接修改原对象 是无法改变视图的

需要替换整个对象

组件样式

拓展:tailwind 样式是什么?

浏览器插件:React Developer Tools

利用 lodash 实现排序

_.ordeBy

1
npm install classnames

连续结构赋值 + 重命名

1
2
3
4
5
6
7
8
9
10
let obj = {
a: {
b: {
c: 1
}
}
}

const {a:{b:{c:data}}} = obj;
console.log(data);

GitHub 搜索用户名

https://api.github.com/search/users?q=junglexs

【Markdown】使用笔记(MacOS)

Markdown教程

快捷键

  • 生成代码块 option + command + C
  • 源码模式 command + /
  • 标题 comand + 1 或 2 、 3、 4
  • 查找 comand + F
  • 超链接 command + K
  • 查找并替换 option + command + F
  • 无序列表 option + command + U- + tab
  • 有序列表 option + command + L1. + tab
  • 代码 control + `
  • 代码块 option + command + C
  • 引用 option + command + Q
  • 放大/缩小 shift + command + = / shift + command + -

语法与文本内容冲突

使用反斜杠\来将这些字符进行转义

1
*\*这样里面的文字就不会加粗了\*\*

使用多个反引号来创建代码块

如果你发现转义字符不起作用(例如,在某些Markdown解析器中可能会有差异),另一个方法是使用更多的反引号来创建代码块,并在里面放置你的代码

1
`` control + ` ``

请我喝杯咖啡吧~

支付宝
微信