天涯海角异孤星

微信小程序——网络请求之关于referer

发布于 2019年7月26日

首先解释一下referer：

HTTP Referer是header的一部分，当浏览器向web服务器发送请求的时候，一般会带上Referer，告诉服务器我是从哪个页面链接过来的，服务器籍此可以获得一些信息用于处理。

在微信小程序中：

网络请求的 referer 是不可以设置的，格式固定为 https://servicewechat.com/{appid}/{version}/page-frame.html，其中 {appid} 为小程序的 appid，{version} 为小程序的版本号，版本号为 0 表示为开发版。

总之，不要在head中写referer就可以了。

分类至 小程序，
含 0条评论

mysql字段定义不要用null的分析

发布于 2019年7月13日

(1) java的null

null是一个让人头疼的问题，比如java中的NullPointerException。为了避免猝不及防的空指针，需要小心翼翼地各种if判断，麻烦又臃肿.

为此有很多的开源包都有诸多处理

common lang3的StringUtils.isBlank();   CollectionUtils.isEmpty();

guava的Optional

甚至java8也引入了Optional来避免这一问题（和guava的大同小异，用法稍有一点点变化)

(2) mysql的null为什么横行滥用

(a) 创建不规范  null是创建数据表时候默认的，一些mysql客户端的自动生成表语句里面可能也没有not null的指定。

(b) 错误认识    会有人觉得not null需要更多的空间

(c) 图省事       null在开发中不用判断插入数据，写sql更方便

……

 

分类至 MySQL，
含 0条评论

MySQL 5.7：聊聊sql_mode

发布于 2019年7月5日

1、sql_mode=only_full_group_by 导致的语法错误问题 MySQLSyntaxErrorException

Caused by: com.mysql.jdbc.exceptions.jdbc4.MySQLSyntaxErrorException: Expression #1 of SELECT list is not in GROUP BY clause and contains nonaggregated column 'db.table.id' which is not functionally dependent on columns in GROUP BY clause; this is incompatible with sql_mode=only_full_group_by

该问题是因为MySQL Server 默认开启了 sql_mode=only_full_group_by 模式，此模式要求 group by 字段必须出现在查询项中（select），否则就会报出该错误。解决的方式也很简单见（5），借着这个异常问题，借机在本文就来学习一下，MySQL 5.7 中的 sql_mode。

2、简介

MySQL服务器可以在不同的SQL模式下运行，并且可以针对不同的客户端以不同的方式应用这些模式，具体取决于sql_mode系统变量的值。可以设置全局SQL模式以匹配站点服务器的操作要求，每个应用程序也可以设置会话级别的SQL模式来满足自己的需求。

sql_mode 模式会影响MYSQL语法及执行数据的验证检查。这使得在不同环境中使用MySQL以及将MySQL与其他数据库服务器一起使用变得更加容易。

3、MySQL 5.7 和 MySQL 5.8 中默认的sql_mode

…

分类至 MySQL，
含 0条评论

HTML5 FormData 方法介绍以及实现文件上传

发布于 2019年6月25日

XMLHttpRequest 是一个浏览器接口，通过它，我们可以使得 Javascript 进行 HTTP (S) 通信。XMLHttpRequest 在现在浏览器中是一种常用的前后台交互数据的方式。2008年 2 月，XMLHttpRequest Level 2 草案提出来了，相对于上一代，它有一些新的特性，其中 FormData 就是 XMLHttpRequest Level 2 新增的一个对象，利用它来提交表单、模拟表单提交，当然最大的优势就是可以上传二进制文件。下面就具体介绍一下如何利用 FormData 来上传文件。

分类至 JS/CSS，
含 0条评论

理解和使用Promise.all和Promise.race

发布于 2019年6月16日

Promise.all可以将多个Promise实例包装成一个新的Promise实例。同时，成功和失败的返回值是不同的，成功的时候返回的是一个结果数组，而失败的时候则返回最先被reject失败状态的值。
Promse.race就是赛跑的意思，意思就是说，Promise.race([p1, p2, p3])里面哪个结果获得的快，就返回那个结果，不管结果本身是成功状态还是失败状态。

分类至 JS/CSS，
含 0条评论

Vue使用watch监听一个对象中的属性

发布于 2019年6月16日

问题描述

Vue提供了一个watch方法可以让使用者去监听某些data内的数据变动，触发相应的方法，比如

queryData: {
    name: '',
    creator: '',
    selectedStatus: '',
    time: [],
},

现在我需要监听这个queryData，我可以这样做：

watch: {
    queryData: {
        handler: function() {
            //do something
        },
        deep: true
    }
}

里面的deep设为了true，这样的话，如果修改了这个queryData中的任何一个属性，都会执行handler这个方法。不过其实这样开销是蛮大的，尤其是对象里面结构嵌套过深的时候。而且有时候我们就想关心这个对象中的某个属性，比如name，这个时候可以这样

watch: {
    'queryData.name': {
        handler: function() {
           //do something
        },
    }
}

或者还可以这样巧用计算属性

computed: {
    getName: function() {
    	return this.queryData.name
    }
}
watch: {
    getName: {
        handler: function() {
            //do something
        },
    }
}

 

分类至 Vue，
含 0条评论

VSCode断点调试Vue项目

发布于 2019年6月15日

1、VSCode安装插件：Debugger for Chrome，并确保你的电脑上安装了 Chrome 浏览器；

2、VSCode菜单“调试-->打开配置”（即 .vscode\launch.json 文件），把 webRoot 配置项改成 "${workspaceFolder}/src"。注，原来的值是 "${workspaceFolder}"，因为Vue项目源代码是在 src 目录，所以要改。我的配置内容如下：

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "http://localhost:8080",
            "webRoot": "${workspaceFolder}/src"
        }
    ]
}

3、编辑Vue的配置文件 vue.config.js （如果没有则自己新建一个），添加 configureWebpack 的配置项 devtool ，值为 "source-map" 。我的 vue.config.js 内容如下：

module.exports = {
    publicPath: "/",
    outputDir: "dist",
    assetsDir: "static",
    lintOnSave: process.env.NODE_ENV === "development",
    productionSourceMap: false,
    devServer: {
        port: 8080,
        open: true,
        overlay: {
            warnings: false,
            errors: true
        },
        proxy: {
            [process.env.VUE_APP_BASE_API]: {
                target: "http://127.0.0.1:90/admin",
                changeOrigin: true,
                pathRewrite: {
                    ["^" + process.env.VUE_APP_BASE_API]: ""
                }
            }
        }
    },
    configureWebpack: {
        devtool: "source-map"
    }
};

4、启动vue项目：npm run serve 或 npm run dev 。如果之前已经启动过了，要关掉重新启动，因为我们改了配置文件；

5、关闭正在运行的Chrome浏览器（以防有干扰），VSCode菜单“启动-->启动调试”，这时候VSCode会以管理员身份打开一个Chrome窗口，并自动打开项目首页；

6、在VSCode中的代码设置断点，浏览器执行，遇到断点时，VSCode会高亮显示。同时，Chrome浏览器按F12，也可以看到相同的断点调试信息。

分类至 Vue，
含 0条评论

vue-cli 3.0 前后端API接口联调时跨域处理

发布于 2019年6月13日

vue项目开发阶段，使用npm run dev 或npm run serve 启动本地调试，请求后端的API接口时提示跨域。因为vue是Node.js运行（端口8080），后端是PHP开发（端口9090），地址都是127.0.0.1，但端口号不一样，所以造成了跨域请求。
vue-cli官方文档提示，我们可以在 vue.config.js 配置文件里设置代理，文档链接：https://cli.vuejs.org/zh/config/#devserver-proxy

分类至 Vue，
含 0条评论

MySQL的四种事务隔离级别

发布于 2019年5月27日

一、事务的基本要素（ACID）
　　1、原子性（Atomicity）：事务开始后所有操作，要么全部做完，要么全部不做，不可能停滞在中间环节。事务执行过程中出错，会回滚到事务开始前的状态，所有的操作就像没有发生一样。也就是说事务是一个不可分割的整体，就像化学中学过的原子，是物质构成的基本单位。
　　2、一致性（Consistency）：事务开始前和结束后，数据库的完整性约束没有被破坏 。比如A向B转账，不可能A扣了钱，B却没收到。
　　3、隔离性（Isolation）：同一时间，只允许一个事务请求同一数据，不同的事务之间彼此没有任何干扰。比如A正在从一张银行卡中取钱，在A取钱的过程结束前，B不能向这张卡转账。
　　4、持久性（Durability）：事务完成后，事务对数据库的所有更新将被保存到数据库，不能回滚。
二、事务的并发问题 ……
三、MySQL事务隔离级别 ……

分类至 MySQL，
含 0条评论