阿里云域名迁移

今天简单的告诉大家域名如何快速转入阿里云。

  1. 向原注册商索取转移密码
    不同的供应商索取的方式不同,请联系各自的供应商解决。


Figure: 以上为联网科技的方式

  1. 打开阿里云的转入地址 - https://wanwang.aliyun.com/domain/transfers
    在输入框中输入 [你的域名][空格][转移密码], 然后点击”立即转入” - 多个域名可以以逗号隔开

注意: 现在转入的时候会出产生域名转入费用,费用为1年的域名续费费用 (不过有效时间会给你增加1年,相当于又续费了1年)

  1. 接着在阿里云的域名转入列表中查看转入情况 - https://dc.console.aliyun.com/next/index#/transfer-in/list
    通常需要5-7个日

注意: 在转入之前,需要完成”信息模板实名认证” - 更多信息可以在此查看 - https://help.aliyun.com/document_detail/101438.html

感谢阅读

阿里云并发优化

不知道大家在业务上有没有遇到过某一段时间访问量激增的情况, 然后服务器扛不住压力.


Figure: 你可以在 “云服务器ECS | 实例 | 监控” 中找打它

如果你确认是你的公网带宽不足的时候, 你可以考虑几个点来进行优化

  1. 将你的一些资源迁移到OSS - OSS中的优化我们下期再讲

  2. 变更你的带宽, 提升你的带宽总量
    a. 直接生你的配置 - (较贵)
    b. 带宽临时升级 - 比如你人为的知道今天下午4点 - 9点会有很多人访问 (便宜)
    c. 使用自动化运维OOS实现周期性的带宽临时升级 - 比如你知道你每周的周一和周二下午3点-6点会有很多用户访问 - (便宜)
    d. 修改你的带宽为使用按量支付的方式 - 注意这个选项在 “降低配置”中 - 你完全不知道你的用户会在什么时候访问 - 这个配置目前最多允许100Mbps的爆发流量, 如果需要更多, 可以联系阿里云的业务经理

  3. 使用阿里云的负载均衡服务, 并且自己购买ECS服务器, 并且配置

  4. 使用阿里云的弹性伸缩服务, 配置规则, 来自动增加或者减少ECS实例

最后如果大家想要购买阿里云服务的话,可以看下云大使链接, 看看有没有可以用得到的优惠 - 点我

感谢阅读

Azure Mysql 的 full group by 问题

在初次使用Azure的mysql数据库的时候, 大家会发现使用group by会报错
这是因为sql_mode=only_full_group_by的原因

我们需要在Azure的数据库门户中关闭这一设定。

  1. 进入你的”Azure Database for MySQL 灵活服务器”门户

  2. 点击服务器参数导航栏

  3. 在文本框中搜索”sql_mode”

  4. 在sql_mode中去掉only_full_group_by的勾选

  5. 不要忘了点击左上角的保存

至此问题修复

感谢你的阅读

几步创建Azure的负载均衡服务

今天教大家以最快的方式处理数据库自动同步

  1. 首先进入Azure, 搜索负载均衡, 然后创建负载均衡器
  2. 选择资源组, 填写名称和区域, 其中SKU中,基本是免费的, 标准是收费的 - 差异性见此文档 - https://docs.microsoft.com/zh-cn/azure/load-balancer/load-balancer-overview#pricing-and-sla

    Figure: 根据自己的需求选择SKU
  3. 添加前端IP

    Figure: 如果没有空闲的IP,可以选择生成
  4. 接着点击”查看+创建”, 来创建一个负载均衡器

    Figure: 创建负载均衡
  5. 后续再添加相关的后端池即可, 后端池可以是自己的虚拟机, 也可以是ip地址

感谢阅读

数据库自动同步

今天教大家以最快的方式处理数据库自动同步

  1. 首先请自行安装Navicat
  2. 在工具中根据需要, 选择”数据传输”,”数据同步”,”结构同步”
    2.1 数据传输 - 结构和数据
    2.2 数据同步和结构同步如字面意思

    Figure: 根据自己的需求选择任务
  3. 选择好源数据库和目标数据库之后, 选择保存配置文件

    Figure: 保存配置
  4. 接着选择”自动运行”, 在其中选择你之前保存的配置

    Figure: 新建批处理作业
  5. 接着设置触发器就好

    Figure: 根据自己的需要,设置任务触发情况

感谢阅读

3 Steps To Create a middleware Service

今天教大家以最快的方式搭建一个代理转发服务

我们使用express和http-proxy-middleware来完成此项操作

  1. 安装express - 关于express的框架问题,我就不多赘述了

  2. 安装http-proxy-middleware - npm i http-proxy-middleware -S

  3. 使用如下代码

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    const express = require('express');
    const cors = require('cors');
    const { createProxyMiddleware } = require('http-proxy-middleware');


    const app = express();
    app.use(cors());


    app.use('/proxy', createProxyMiddleware({ target: '目标站点', changeOrigin: true,pathRewrite:{'^/proxy':'/'} }));
    app.listen(3001, function () {
    console.log('开始代理')
    });

搞定

3步对接来运的短信服务

  1. 在阿里云的控制台上找到短信服务,点击立即开通


    Figure: 免费开通,按量服务

  2. 在服务创建完毕之后, 我们需要添加一个签名, 签名通常会在48小时内审核通过


    Figure: 大家可以根据实际情况,选择不同的签名来源

  3. 在签名完毕之后,就可以使用SDK来进行发送短信以及批量发送短信了, SDK以及体验地址 - https://next.api.aliyun.com/api/Dysmsapi/2017-05-25/SendSms?spm=api-workbench.SDK%20Document.0.0.60871e0fRHQqlN&params={}


    Figure: 在这里可以直接下载完整的功能和运行实例,注意在这之前获取AK来进行授权,也要注意你的发送地址,不同的区域地址是不同的

到此为止,对接短信就成功了,感谢阅读

3步对接阿里云发送邮件

今天教你3步对接阿里云的发送邮件

  1. 使用你的包管理工具安装包AlibabaCloud.SDK.Dm2015112

  2. 创建Client

1
2
3
4
5
6
7
8
9
10
11
12
13
public static AlibabaCloud.SDK.Dm20151123.Client CreateClient(string accessKeyId, string accessKeySecret)
{
AlibabaCloud.OpenApiClient.Models.Config config = new AlibabaCloud.OpenApiClient.Models.Config
{
// 您的AccessKey ID
AccessKeyId = accessKeyId,
// 您的AccessKey Secret
AccessKeySecret = accessKeySecret,
};
// 访问的域名, 不同的数据中心,你的域名不同
config.Endpoint = "dm.ap-southeast-1.aliyuncs.com";
return new AlibabaCloud.SDK.Dm20151123.Client(config);
}
  1. 发送邮件 (或者调用其他接口)
    1
    2
    AlibabaCloud.SDK.Dm20151123.Models.SingleSendMailRequest singleSendMailRequest = new AlibabaCloud.SDK.Dm20151123.Models.SingleSendMailRequest();
    client.SingleSendMail(singleSendMailRequest);

注意: 对于澳洲和新加坡区域的用户,需要使用另外一个包 - https://www.alibabacloud.com/help/zh/doc-detail/113955.htm?spm=a2c63.p38356.b99.61.664a6f18AGrooo
同时, SDK要选择2017-06-22的, 虽然这个包被官方标注为不推荐 - https://next.api.aliyun.com/api/Dm/2017-06-22/SingleSendMail?params={}&sdkStyle=old

React 父组件调用子组件简单的方法

在React中, 我们通常使用子组件来调用父组件的方法以及属性,但是在少数情况下,也会存在父组件调用子组件方法的时候。

通过forwardRef这个hook, 可以向父组件传递ref, 父组件再通过ref来操作其内层元素.
官方示例如下

1
2
3
4
5
6
7
8
9
const FancyButton = React.forwardRef((props, ref) => (
<button ref={ref} className="FancyButton">
{props.children}
</button>
));

// You can now get a ref directly to the DOM button:
const ref = React.createRef();
<FancyButton ref={ref}>Click me!</FancyButton>;

然而这个ref返回的是dom节点, 有的时候我们需要调用子组件的方法
对于这种情况, 我们可以使用useImperativeHandle, 来自定义返回的ref
官方示例如下

1
2
3
4
5
6
7
8
9
10
function FancyInput(props, ref) {
const inputRef = useRef();
useImperativeHandle(ref, () => ({
focus: () => {
inputRef.current.focus();
}
}));
return <input ref={inputRef} ... />;
}
FancyInput = forwardRef(FancyInput);

感谢阅读

Web Responsive Component

我们也可以通过响应式的组件来实现响应式,响应式的组件很多,这里我们就暂时先通过介绍react-responsive,来让大家做一下了解

对于react-responsive,非常直观的表现就是

1
2
3
4
5
6
<Responsive minWidth={1200}>
//TODO: <Desktop />
</Responsive>
<Responsive maxWidth={1199}>
//TODO: <Mobile />
</Responsive>

以上代码表示,当分辨率>= 1200时, 显示PC端, 当分辨率<1200时, 显示手机端组件

除此之外, 此组件还有useMediaQuery等,可以通过hooks来辅助你进行一些逻辑判断, 例如

1
const isDesktop = useMediaQuery({ minWidth: 1200 })

优点在于可以更好的实现PC端和手机端的分离,假设他们的交互以及逻辑处理非常的不相似
缺点是会更加开发周期

PS: 在使用栅格时, 也可以通过响应式尺寸, 以及通过设置span=0,一样也可以实现此功能

下一节,我们会接着讲一下响应式中对于不同手机的分辨率适配