发表于 | 分类于 | 阅读次数

  就RN生态来说，绝大部分基础组件都能轻松找到开源实现，唯独在地图方面可选项并不多，要么是对系统地图组件的简单封装、要么就是像Mapbox这样使用门槛略高，反而是OpenLayers这样的纯js组件不仅使用简单、功能还强大。

devtools

  嘛…… 唯一的缺点是没有RN封装，需要借助于webview的hybird模式。

  一开始功能简单，就一个单一h5页面，什么逻辑都往里面塞，在源码目录下建个pages文件夹，iOS不用操心，打包时会自动拷贝至ios/assets目录下，Android在打包前需要手工拷贝至android/app/src/main/assets目录，然后使用WebView加载本地html文件即可：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
renderMap() {
    let source = require('../pages/explore.html');
    let originWhitelist = ['*'];
    if ('android' === Platform.OS && !Global['__DEV__']) {
      source = { uri: 'file:///android_asset/pages/explore.html' };
	  originWhitelist = null;
    }
    let view = null;
    view =
    <WebView
      ref={(webview) => {
        this.webview = webview;
      }}
      originWhitelist={originWhitelist}
      allowUniversalAccessFromFileURLs={true}
      source={source}
    />
    return view;
  }

  等到代码膨胀至几千行滚轮滚着实在太累、就又拆分出来数个功能函数js，但想再继续扩展就有些力不从心了：

  1. 只能使用ES5语法，好多ES6新特性用不上 —— 不是太清楚跟RN的打包怎么集成，也没有太多时间精力去研究；
  2. 页面上第三方组件库引入麻烦；
  3. 功能调试只能使用像是alert、console.log这类原始方法。
阅读全文 »

发表于 | 分类于 | 阅读次数

问题

  主角是google官网《远程调试 Android 设备使用入门》里提到的Chrome DevTools，别看文章最后更新日期是2018年8月29日，如果你用目前最新的Chrome版本（71.0.3578.98）来操作看到的就是下面这样支离破碎的界面布局：

devtools

  最后在Chrome DevTools论坛找到的根源，归结起来就是下面几点：

  1. 从Chrome 63版本开始永久的删除了对/deep/选择器的支持；
  2. Chrome DevTools对/deep/选择器有强依赖，在没有/deep/选择器支持的情况下项目组没有、也不打算再寻求新方案来修复；
  3. 如果还是希望继续使用Chrome进行远程调试，就只能下载63之前的版本；
  4. 63之前的版本在一些ES6新特性上的支持可能会有缺失；
  5. google做这个动作的时间点是在17年的12月份。
阅读全文 »

发表于 | 分类于 | 阅读次数

问题

  对程序猿来说，永远都希望用代码来解决一切问题，所以有了markdown就丢掉了word，有了plantUML就丢掉了visio，可是乱码是一道绕不过去的坎，当你兴高采烈写了一个Hello World，却发现了一堆方块……

hello
阅读全文 »

发表于 | 分类于 | 阅读次数

背景

  针对小、微型企业来说，IT往往只是辅助工具，或许全公司也就那么一个系统开发，当公司业务量上升，碰到人工效率天花板的时候，直接面向客户的业务系统开发又必须是优先于面向内部员工的编辑系统的，所以前期一些数据运营性工作就只能先找现成系统，如：phpMyAdmin, Adminer之类来直接暴露数据库勉强用着了。
  不过这种方式快倒是快，可直接暴露在公网上的东西，并且还是开源的，保不齐哪天一不留神来个授权漏洞公司数据可就尴尬了……
  所以企业微信这个东西吧，虽然以前一直不理解都有微信了干嘛还搞一企业版，现在看来也还是能解决一部分人群现实问题的，至少基于它的OAuth2加道系统访问的闸门，即使访问入口暴露在官网上也是放心多了。

实现

方案说明

阅读全文 »

发表于 | 分类于 | 阅读次数

问题

  网上一搜Vue项目中怎么引入微信的JS-SDK清一色都是告诉你怎么用weixin-js-sdk这个封装，倒不是说这样不好，但毕竟不是官方，各种bug的更新同步上还是有些问题，比如截至到目前的1.4.0-test版本，就有iOS下chooseImage选择的图片无法展示的问题。但实际上微信官网放置的链接：http://res.wx.qq.com/open/js/jweixin-1.4.0.js 是解决掉了这个问题的，所以直接使用官网提供的文件会节约下来很多排查定位问题的时间。

解决

  其实直接引入也并不复杂，不过就是多一行代码……

index.html修改

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
    <title>store.huizutech.com</title>
  </head>
  <body>
    <noscript>
      <strong>We're sorry but store.huizutech.com doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
    </noscript>
    <div id="app"></div>
    <!-- built files will be auto injected -->
    <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
  </body>
</html>

vue.config.js修改

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
const path = require('path');
function resolve (dir) {
  return path.join(__dirname, dir)
}

module.exports = {
  ……
  // 配置别名
  chainWebpack: (config)=>{
    config.resolve.alias
    .set('@', resolve('src'))
    .set('wx',resolve('https://res.wx.qq.com/open/js/jweixin-1.4.0.js'))
  }
  ……
}

  这样后续的用法就跟weixin-js-sdk介绍的完全一样了，类似还有其他外部js的引入也可以参考着来。

发表于 | 分类于 | 阅读次数

问题

  昨个好不容易在公司下完10来个G的语音训练文件，打算在本机跑跑ASRT_SpeechRecognition这个开源的中文语音识别项目、自己训练训练模型，结果项目导入PyCharm，一跑就给甩一错误：

1
2
3
4
5
6
7
8
9
Using TensorFlow backend.
E:\语音数据集
[*Info] Create Model Successful, Compiles Model Successful. 
[running] train epoch 0 .
[message] epoch 0 . Have train datas 0+
Epoch 1/1
Intel MKL FATAL ERROR: Cannot load mkl_intel_thread.dll.

Process finished with exit code 2

  好吧，直译就是mkl_intel_thread.dll这个动态库加载不上……

解决

where

  于是在Anaconda Prompt下执行”where mkl_intel_thread.dll”，这分明摆着俩，还说加载不上 😥

  不过等等，进到文件目录一看大小都不一样…… 好嘛，一个版本是2018.0.1.1，一个版本是2018.0.2.1，那问题就比较明显了，PyCharm里设置的解析器是envs目录下的(这里的dll版本比较新)，不过嘛，IDE加载dll的默认目录还是在ProgramData下，这样两边就对不上了……

  最简单粗暴的解决办法：直接把envs目录下的mkl_intel_thread.dll给拷贝到ProgramData目录下替换掉原来的就完事了👌

发表于 | 分类于 | 阅读次数

问题

  最近折腾个微信公众号的东西，对于登录态的处理，按照各路教程指点写了一axios拦截器来统一添加到请求头里，类似下面这样： 

1
2
3
4
5
6
7
8
9
axios.interceptors.request.use(config => {
  if ( store.state.user && store.state.user.token ) { 
    config.headers.uid = store.state.user.uid;
    config.headers.token = store.state.user.token;
  }
  return config;
}, err => {
  return Promise.reject(err);
});

  嘛，日志啥的看着都挺正常的，但从网络请求包看就是没有附带上对应的头部信息，再一细看，发现请求是OPTIONS，还不是预期的GET……

options
阅读全文 »

发表于 | 分类于 | 阅读次数

原理

引用一张网上广为流传的牛排熟度对比图：

牛排熟度图
熟读 英文 法文 中心温度 口感
全生 Raw Cru —— 指未经烹煮的牛肉料理，比如鞑靼牛肉这样，不过全生的牛排可能点起来需要点勇气呢
微煎 Blue Rare Bleu 46° 表面被煎烤，但内部通常是生冷的
一分熟 Rare Saignant 49° 表面肉质紧致，呈灰褐色，剖面为血红色，中心温热
三分熟 Medium Rare Saignant 52° 牛排的中心肉质依旧带有血丝，但牛排两侧已呈棕色，当食客没有明确要求时，在欧美的餐厅里，这个温度是最为常见的
五分熟 Medium à point, anglais 57° 牛排外部灰褐色，牛排中心也是烫的，而且已经全部为粉色，牛排温度口感均衡
七分熟 Medium-Well cuit, demi-angalais 66° 牛排中心，仅剩一点点粉红色，质感偏厚重，有咀嚼感
全熟 Well-Done bien cuit 71° 牛排内部也为灰褐色，略焦黑，口感厚重
过熟 Over Cooked trop cuit —— 牛排色泽偏黑，焦脆

  你看，决定牛排口感很关键的一个衡量指标就是中心温度的高低，传统的煎锅煎法因为是由外及内的热传导、加上人做饭时的焦急心态，很容易就会导致外枯里生的结果……

  因此才又出现了烤箱版攻略，就是先用煎锅高温快速煎出外部硬壳，一方面是借助梅拉德反应产生特俗的风味、另一方面也是为了尽可能的锁住内部水分，而最重要的一点，定个时就好了，你不用在傻傻的饿着肚子站灶台前等翻面了。

  嘛，不过烤箱版因为需要长时间暴露在热源下，肉汁水分还是有一定流失的，而且还费电，当然你也看到了，温度是衡量指标，肉汁的保留程度才说影响口感的关键。

  所以低温慢煮就又出现了，既然温度这么重要，那就设定好水温慢慢加热嘛；既然肉汁这么影响口感，那装真空袋里水分总归不能流失了吧。于是，低温慢煮的本质就是缓慢均匀加热的基础上锁住内部水分。

工具

锅具 用途
泰福高 4.5L焖烧锅 进行目标温度的长时间加热、淘宝上的低温慢煮机看起来就一个带温度计的热得快，还卖死贵死贵，实在是下不去手……
苏泊尔 28cm红点煎锅 水浴完成后煎出硬壳，完成梅拉德反应
阅读全文 »

发表于 | 分类于 | 阅读次数
Mint UI

问题

  嘛，国内开源库虽说文档是中文的看起来比较容易接受一点儿，不过基本都跑不掉更新不及时的通病，就像是饿了么开源的Mint UI，在Vue CLI已经升级到版本3，脚手架工程目录结构有大变更的情况下没跟上时代的步伐，一不小心就报错了：

Error: No PostCSS Config found in:

  接下来就是用国内开源库的第二个坑了，如果用报错关键字“Mint UI Error: No PostCSS Config found in:”来进行查找，国外的话因为没有用户群体，基本找不到对应问题，国内嘛，虽然可以找到很多结果、而且看起来更新日期还比较新，但点开一看通常都是转载的同一篇N年前早就不适用的老文章……

解决

  问题解决倒是也不麻烦，因为Vue CLI3调整了目录结构，以前基于postcss.config.js的改法就都不好使了，需要在工程目录下新建文件：vue.config.js，然后参考老版本的改法加入以下配置即可：

1
2
3
4
5
6
7
8
9
module.exports = {
  css: {
    loaderOptions: {
      postcss: {
        'autoprefixer': {browsers: 'last 5 version'}
      }
    }
  }
}

发表于 | 分类于 | 阅读次数
史料库首页

问题

  为了让APP上一切资源皆可搜索，最近几乎把所有数据内容都塞进了Lucene索引，相应发生产的时候这部分MySQL表的同步也就给省掉了。然鹅之前偷懒，对于“史料库”首页数据的刷新都是每次发版前通过SQL语句随机选取生成然后同步的，类似： 

1
SELECT * FROM xxx ORDER BY RAND() LIMIT 10;

  最近为了省事，决定加个Quartz定时任务来刷新，那么问题就来了，生产上没有完整的数据表，因为都给塞Lucene里了……

  或许因为已经有封装比较好的Elasticsearch跟Slor了，去网上找基于Lucene的随机搜索排序实现要么就是6-7年前的老版本、要么就是基于Slor之类的方案，无奈1U512M的拖拉机实在是拉不动大家伙(￣▽￣)”

阅读全文 »