小宝管理系统爬坑记录

发表于 2018-04-26

1.前后端分离的跨域cookie的问题

我后端使用的node+express
最开始使用中间件设置下允许跨域
这下子前端可以通过ajax请求到后端的数据了

app.use(function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header('Access-Control-Allow-Methods', 'PUT, GET, POST, DELETE, OPTIONS');
    res.header("Access-Control-Allow-Headers", "X-Requested-With");
    res.header('Access-Control-Allow-Headers', 'Content-Type');
    next();
});

我以为这样就够了
后来发现前端无法携带后端set的cookie
此处一脸懵逼，一度怀疑我设置cookie的方法写错了，用cookies模块不行，用express自己的cookie也不行。
后来发现原来是cookie无法跨域。
需要再添加一条 Access-Control-Allow-Credentials:true
表示允许跨域携带cookie，
并且要将Access-Control-Allow-Origin指定到具体的域，否则cookie不会带到客户端。
感觉这样设置麻烦。。。。。
于是在npm发现了一个专门跨域的包 cors

1 2	const cors = require('cors') app.use(cors({credentials: true, origin: 'http://localhost:8080'}));

由于前端我用axios发送的ajax请求，所以还要设置下axios
withCredentials: true
允许携带凭证
这样就ok拉~

###2.async函数中foreach中嵌套异步操作(同步函数中使用foreach而且foreach中还包含异步请求，foreach不会等待异步执行完，才结束循环，而是直接循环玩调到foreach的下一段代码片段)

看不懂没关系，我只是做个记录，怕自己忘了，有时间写详细的！

function sendWeatherInfo({time="0 * * * * *",Contact}) {
    console.log('天气服务开启成功');
    console.log('天气推送时间间隔'+time);
    schedule.scheduleJob(time, async () => {
        //获取相关信息，citys用户有哪些城市['Beijing','Dalian']
        let citys = await getCity();
        let weatherUsers = [];
        //获取天气数据
        await(() => {
            return new Promise((resolve, reject) => {
              let n = 0;  
              citys.forEach(async item => { 
                  let { data } = await $http.get(baseURL + item);
                  if(data) n++;
                  weatherUsers.push({ city: item, user: [] ,data});
                  if(n==citys.length){
                      resolve('数据请求成功')
                  }
                });
            })    
        })()

        //将用户以不同的地区分类
        await getUsersClassify(weatherUsers);
        // console.log(weatherUsers);
        
        //处理天气
        let baseText = ``;
        weatherUsers.forEach((item) => {
            //处理数据
            let weCity = item.data.results[0].location.name;
            let weData = item.data.results[0].daily[0];
            // console.log(weData);
            //解构数据
            let {date,text_day,text_night,high,low,wind_direction,wind_direction_degree,wind_speed,wind_scale} = weData; 
            //获取eomoj
            let {getEmoj} = require('./getEmoj'); //TODO:完善emoji内容
            let dayEmoj = getEmoj(text_day);
            let nightEmoj = getEmoj(text_night);    
            let normalText = `${weCity}今日白天/:sun${text_day}${dayEmoj}\n今日夜间/:moon${text_night}${nightEmoj}\n最高气温${high}°C,最低气温${low}°C\n${wind_direction}风,💨指数${wind_scale}`;   
            item.user.forEach(async (user) => {
                let a = await Contact.find({
                    alias:user
                })
                if(a.star()){ //是否为星标用户，名字高亮
                  await a.say(`亲爱哒/:rose✨${a.name()}✨\n${normalText}`)
                  console.log(`向【VIP】用户昵称${a.name()},ID:${a.alias()}推送天气成功`);                                     
                }else{
                   //普通用户，无名字
                   await a.say(normalText);
                   console.log(`向【普通】用户昵称${a.name()},ID:${a.alias()}推送天气成功`);                   
                }
            })
        })
      });
}

Debian9安装最新版Nodejs和NPM

发表于 2018-04-13 | 分类于 Linux ， Nodejs

Debian9安装最新版Nodejs和NPM

Node.js是一个基于Chrome V8 JavaScript引擎构建的平台.Nodejs可用于轻松构建快速，可扩展的网络应用程序。最新版本node.js ppa由其官方网站维护。我们可以将这个PPA添加到Debian 9（Stretch） Debian 8（Jessie）和Debian 7（Wheezy）系统中。这篇我抄来的文章可以帮助你在Debian 9/8/7系统上安装最新的Nodejs和NPM。

一、添加Node.js PPA

首先，您需要在我们的系统中由Nodejs官方网站提供node.js PPA。如果尚未安装，我们还需要安装python-software-properties软件包。您可以选择安装最新的Node.js版本或LTS版本。

二、安装Node.js和NPM

添加所需的PPA文件后，可以安装Nodejs包。NPM也将与node.js一起安装。该命令还会在您的系统上安装许多其他相关软件包。

1	apt-get install nodejs

三、检查Node.js和NPM版本

安装node.js后，验证并检查安装的版本。你可以在node.js 官方网站上找到关于当前版本的更多细节。
检查Node.js版本

node -v

检查npm版本

npm -v

Deibian安装node模块puppeteer的依赖

发表于 2018-04-11 | 分类于 Linux

apt-get install -y

gconf-service libasound2 libatk1.0-0 libc6 libcairo2 libcups2 libdbus-1-3 libexpat1 libfontconfig1 libgcc1 libgconf-2-4
libgdk-pixbuf2.0-0 libglib2.0-0 libgtk-3-0 libnspr4 libpango-1.0-0 libpangocairo-1.0-0 libstdc++6 libx11-6 libx11-xcb1 libxcb1
libxcomposite1 libxcursor1 libxdamage1 libxext6 libxfixes3 libxi6 libxrandr2 libxrender1 libxss1 libxtst6 ca-certificates
fonts-liberation libappindicator1 libnss3 lsb-release xdg-utils wget

JavaScript数组迭代方法

发表于 2018-04-03 | 分类于 JavaScript

ECMAScript5为数组定义了5个迭代方法。每个方法都有接受两个参数。

第一个参数为在每一项上运行的函数。
第二个（可选）为运行改函数的作用于对象–影响this值。
这些函数会接收三个参数：数组项的值item，该项再数组中位置index，数组对象本身array

array.数组方法((item,index,array)=>{})

every():对数组中的每一项运行给定函数，如果该函数中对每一项都返回true，则返回true

const arr = [1,2,3,4,5];
let result = arr.every((item,index,array){
    return item>2    //有一项不符合条件就返回false
});
console.log(result) //false

filter():对数组中的每一项运行给定函数,返回该函会返回ture的项组成的数组。

const arr = [1,2,3,4,5]
let result = arr.filter((item,index,array)=>{
    return item > 2
});
console.log(result) // [3,4,5]

forEach():对数组中的每一项运行给定函数，这个方法没有返回值。

let arr = [1,2,3,4,5]
arr.forEach((item,index,array)=>{
    console.log(item) //一次打印1,2,3,4,5
})

map():对数组中的每一项运行给定函数，返回每次函数调用的结果组成的数组。

const arr = [1,2,3];
let result = arr.map((item,index,array)=>{
    return item*2
})
console.log(result) //[2,4,6]

some():对数组中的每一项运行给定函数,如果该函数对任一项返回true，则返回true

const arr = [1,2,3]
let result = arr.some((item,index,array)=>{
    return item>1;
})
console.log(result) //true

！！！以上的方法都不会修改原数组！！！！

关于ES6新增的数组方法,以后更新

程序员是一碗青春饭，吃了它永葆青春

发表于 2018-03-19

你要给我两个选择，一个是越老越值钱的行业，熬资历磨日子混关系，压着你的都是哆哆嗦嗦的大叔人老珠黄的阿姨；等老到不能享受的时候才实现了财富自由；一个是年纪轻轻就有很多机会，日新月异，千变万化，不学习就要失业，不奋斗就要贫穷，work hard play harder，工作起劲，玩得尽兴。

打死我都要选第二个。

程序员是一碗青春饭，吃了它永葆青春。

转自：poilynx

常用ECMAScript6语法归纳

发表于 2018-03-15 | 分类于 JavaScript

声明变量

可以使用let、const关键字声明变量，而不推荐使用var声明变量

var声明变量的问题:

可以多次重复声明同一个变量名，存在覆盖的风险
在全局声明的变量会挂在全局对象上
var不能形成块级作用域，例如：if、for范围外依然可以使用var声明的变量
var声明的变量具备变量提升（hoisting）特性— 允许使用在前，声明在后

var存在很多问题，let横空出世。
let允许创建块级作用域，let声明的变量只在它所在的代码块内有效

{
  let test = 10;
  var foo = 1;
}

console.log(test) // ReferenceError: test is not defined.
console.log(foo) // 1

在if中使用：

if(false){
  let test = 10;  // 只在这个代码块内有效，形成了块级作用域
  var foo = 1;
}

console.log(test) // ReferenceError: test is not defined.
console.log(foo) // undefined

在for中使用,i只能在循环体内使用，循环体外会报错：

for (let i = 0; i < 10; i++) {
  // ...
}
console.log(i); // ReferenceError: i is not defined

const声明变量同let声明变量一样，在块级作用域有效。不同的是，const用来声明常量，一旦声明赋值后，变量不能被重新赋值：

1
2
3

const test = 123;
test = 10;
console.log(test);  // Uncaught TypeError: Assignment to constant variable.

如果赋的值是引用类型，那么可以通过变量来修改引用类型的值：

const test = {};
test.a = 1;
test.b = 2;
console.log(test);  // {a: 1, b: 2}

总结let和const：

声明的变量不具备变量提升（hoisting）特性
只在声明所在的块级作用域内有效
不允许重复声明
暂时性死区（TDZ）所声明的变量绑定在定义的区域，使用let命令声明变量之前，该变量都是不可用的
const 在声明时必须被赋值

解构赋值

ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构。通过这种方式可以避免在对象赋值时产生中间变量。

数组的结构赋值

function test(){
    return [1,2,3,4];
}

let [a,b] = test();
console.log(a,b); // 1,2

test函数执行后，返回的是一个数组。取数组前两个值分别存在变量中，根据解构赋值的规则，在左侧声明变量，放在中括号中，会把右边数组中的值一一对应赋值给左边的变量。

对象的解构赋值

function test(){
    return {a:1,b:2,c:3};
}

let {a,b} = test();
console.log(a,b); // 1,2

test函数执行后，返回的是一个对象。分别取出对象中属性为a和b的值，根据解构赋值的规则，在左侧声明变量，放在大括号中，变量名要和属性名保持一致。

函数参数的解构赋值

function test({a,b}){
    console.log(a,b);
}

test({a:1,b:2,c:3})

在形参中定义变量，得到实参对象指定的属性。

默认值

可以给变量设置默认值和另声明一个变量

let {a:otherVar,b,d='默认值'} = {a:1,b:2,c:3};
console.log(d); // 默认值
console.log(otherVar); // 1
console.log(a); // Uncaught ReferenceError: a is not defined

使用=给变量赋一个默认值，如果右边对象中没有与之对应的属性，则按默认值来。
使用:重新声明一个变量，会把匹配到的a的值赋给新的变量otherVar，此时在外面使用时候，不能使用a。
也可以连着一起使用：

1 2	let {a,b,d:foo='默认值'} = {a:1,b:2,c:3}; console.log(foo); // '默认值'

模板字符串

模板字符串（template string）是增强版的字符串，用反引号（`）标识。
定义字符串

1
2
3

let str = `<li>
                hello
           </li>`

在模板字符串中拼写HTML结构，无需考虑回车换行。
在模板字符串中要渲染某个变量的值，可以写在占位符${}中

let message = 'hello';
let str = `<li>
        ${message}
    </li>`

打印出：

1
2
3

"<li>
    hello
</li>"

${}中可以写入任意的表达式（表达式是可以被求值的代码），例如：

let message = 'hello';
let str = `<li>
        ${message}
        ${1+1}
        ${1 > 2 ? true : false}
        ${
            [1,2,3].map(function(item){
                return item*2
            })
        }
    </li>`

注意:不能在${}中写入if和for这样的语句。

##箭头函数（Arrow Functions）
在ES6中，箭头函数就是函数的一种简写形式,允许使用“箭头”（=>）定义函数。

之前声明函数：

1
2
3

function foo(){
    return 1;
}

改为:箭头函数

1	let foo = () => 1;

上面使用“箭头”（=>）定义的函数，左侧的()包裹函数的形参，如果定义的函数没有形参或者多个形参，一定要使用括号：

// 没有参数，要使用()
let test = () => 1;

// 多个参数，要使用()
let foo = (a,b) => a + b;
let bar = (a,b,c) => a + b + c;

如果形参只有一个，可以省略括号：

1	let foo = a => a;

“箭头”（=>）的右侧是函数体代码，会在函数执行后作为函数的返回值，不需要显示的使用return

1 2	let foo = (a,b) => a + b; console.log(foo(1,2)); // 3

以上的简写方式，使代码变得非常简洁，忍不住再来个例子：

1
2
3

let arr = [1,2,3];  
let newArr = arr.map(item => item * 2);
console.log(newArr); // [2,4,6]

有多行代码，可以写在一对{}中，手动调用return返回值：

let foo = (a,b) => {
    console.log(a)
    console.log(b)
    return a + b; 
}

当要返回的是对象时，又不想手动调用return，记得加上()保证是一个对象整体，而不被误以为是函数体：

1 2	var obj = () => ({a:1,b:2}) console.log(obj()); // {a:1,b:2}

箭头函数中this指向

头函数内的this，绑定定义时所在的作用域的this，并不是在调用时候决定this的指向。

document.onclick = function (){
    setTimeout(function (){
        console.log(this); // 定时器执行的函数，在非严格模式下this指向window  
    },1000) 
}

如果要在setTimeout中使用点击时的元素，通常需要存一个变量。

document.onclick = function (){
    var that = this;
    setTimeout(function (){
        console.log(that); // that变量存的就是触发事件的元素
    },1000) 
}

如果使用箭头函数，一切讲变得非常简单：

document.onclick = function (){
    setTimeout( () => {
        console.log(this); 
    },1000) 
}

箭头函数是在事件处理函数中定义，事件处理函数this指向的是触发事件的元素，所以这个this，也就是触发事件的元素。
使用箭头函数的特性：

函数体内的this值，绑定定义时所在的作用域的this
不可以当作构造函数
不可以使用arguments对象

函数参数默认值

允许在形参声明时，写入默认值，说明这个值是可选的。
传统做法：

/*
    参数：
        a是必填项
        b可选的
*/
function fn(a,b){
    b = b || 10;
    return a + b;
}

以上的方式是参数b如果没传入的话，值就为10；
这样写会有一个问题,假如传到函数的参数为0，则b的值依然为10，正确的应该是0才对，因为||运算符左边不成立，就返回右边的值，左边为0则不成立，就返回10了。
ES6中，允许给函数参数默认值：

1
2
3

function fn(a,b=10){
    return a + b;
}

在形参中直接写上b=10即可。

##扩展运算符（spread）和Rest操作符
扩展运算符和Rest操作符都指的是…,根据上下文的语境不同，解析方式也不同。

###数组扩展运算符
将一个数组转为用逗号分隔的参数序列.

1 2	var arr = [1,2,3,4]; console.log([...arr]); // [1,2,3,4]

把数组的每一项扩展到另一个数组中。
也可以从数组中找到最大值：

1 2	var arr = [1,2,3,4]; console.log(Math.max(...arr)); // 会依次把数组的每一项传入到函数中

###对象扩展运算符
扩展运算符（…）用于取出参数对象的所有可遍历属性，拷贝到当前对象中，相当于浅复制。

1 2	var arr = {a:1,b:2,c:3}; console.log({...arr});

利用对象的属性是唯一的特性，后面定义的覆盖前面的属性，可以修改一个属性的值.

1 2	var arr = {a:1,b:2,c:3}; console.log({...arr,a:'修改了'});

###Rest操作符
在使用解构赋值时，会把剩余的值，放在一个数组中：

var arr = [1,2,3,4];
var [a,...b] = arr;
console.log(a);  // 1 
console.log(b); // [2,3,4]

如果是对象，会把剩余的属性放在新对象中：

var o = {a:1,b:2,c:3};
var {a,...d} = o;
console.log(a);  // 1
console.log(d); // {b:2,c:3}

在函数的形参中使用，会把剩余的形参都放在数组中

function fn(a,...b){
    console.log(a);  // 1
    console.log(b); // [2,3,4]
}

fn(1,2,3,4)

Rest操作符可取到arguments,把实参传入到一个数组中，而不是arguments类数组中：

function fn(...b){
    console.log(b); // [1,2,3,4]
}

fn(1,2,3,4)

注意，Rest操作符只能写在参数的最后，不能写在开头或中间，否则会报语法错误
1
2
3
4
5
6
7
function fn(a,...b,c){
    console.log(a); // 
    console.log(b);
    console.log(c)
}

fn(1,2,3,4); // Uncaught SyntaxError: Rest parameter must be last formal parameter

对象的简洁表示法

变量名和属性名相同，可直接写入变量名：

var a = 10;
var b = 20;
var o = {
    a,
    b
}

console.log(o); // {a:10,b:20}

定义函数可省略function关键字

1
2
3

var o = {
    fn(){}
}

相当于：

1
2
3

var o = {
    fn: function () {}
}

Mac下VSCode插件Color Picker安装失败解决方案

发表于 2018-02-27 | 分类于 VSCode

Mac下VSCode插件Color Picker安装失败解决方案

PS 先记录一下，有时间写详细的。

vscode扩展商店安装Color Picker插件

切记安装后不要在vscode控制台调用 pick color命令

打开mac终端使用cnpm方式安装

1	cd ~/.vscode/extensions/anseki.vscode-color-x.x.x

x.x.x 是版本号

进入文件夹后执行

1	sudo cnpm intall

此处输入图片的描述

大功告成~

Git&Github

发表于 2018-02-26

git&github

git

工具
Git是一款免费、开源的分布式版本控制系统

分区：

工作区：写代码的目录
缓存区：在工作区和版本库之间做一个缓存
版本库：最终成型的版本

命令：

初始化目录，把一个目录变成git可以管理的工作区

git init
敲这个命令后，会在这个目录下创建一个文件夹 .git
添加到缓存区

git add <. 某个文件>
添加到版本库

git commit -m ‘这是日志信息’
-m(message) 日志信息

github gayhub

用来托管代码的

问题：怎么使用git这个工具把本地代码库中的代码上传到github上托管？

git连接github

设置git的user和email

git config –global user.name “你的github名字”
git config –global user.email “你的github邮箱”
生成ssh秘钥
ssh-keygen -t rsa -C “your_email@youremail.com“
回车后在提示的路径下找到.ssh文件夹，在这个文件夹下会有两个文件：
- id_rsa 私钥
- id_rsa.pub 公钥未来给github用
设置github的ssh具体参考截图
测试是否连接上github

ssh -T git@github.com
出现：Hi 你的用户名! You’ve successfully authenticated, but GitHub does not provide shell access.
说明连接成功

把本地的代码上传的github仓库

第一次：

git init
git add .
git commit -m '信息'
连接远程仓库：git remote add origin 远程仓库地址
推送：git push -u origin master

以后：

1
2
3

git add .
git commit -m '信息'
git push

MozLee

MozLee的博客

GitHub 微博