Salad taste like sad.

H5 调起第三方地图软件(百度、腾讯、高德)

新的需求,项目为 H5 嵌入 App,需要让 H5 能直接调起第三方地图软件实现目标地点的导航。

食用方法很简单,直接跳转相应的 URL 即可,不过 H5 无法判断用户是否安装了相应的地图 App。

区分用户端环境

1
2
3
4
5
6
7
let ua = navigator.userAgent.toLowerCase()
if (ua.indexOf('like mac os x') > -1) {
this.OS = 'IOS'
}
if (ua.indexOf('android') > -1) {
this.OS = 'Android'
}
H5 调起第三方地图软件(百度、腾讯、高德)

VSCode 使用代码片段快捷生成 Vue3 模板

习惯了 Webstorm 快捷的代码模板,而 VSCode 默认是没有 Vue3 代码模板的,无法愉快的食用 Vue3,那就扒贴自己创建一个模板!

创建模板:

  1. 界面右上角「文件」-> 「首选项」-> 「配置用户代码片段」-> 「新建全局代码片段文件」-> 键入vue3.json 回车。

  2. 进行一个copy,具体模板自由发挥。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
{
// Place your snippets for vue here. Each snippet is defined under a snippet name and has a prefix, body and
// description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the
// same ids are connected.
// Example:
// "Print to console": {
// "prefix": "log",
// "body": [
// "console.log('$1');",
// "$2"
// ],
// "description": "Log output to console"
// }
"Print to console": {
"prefix": "vue3",
"body": [
"<template>",
" <div></div>",
"</template>",
"",
"<script setup lang='ts'>",
"$1",
"</script>",
"",
"<style scoped lang='stylus'>",
"</style>"
],
"description": "Log output to console"
}
}
VSCode 使用代码片段快捷生成 Vue3 模板

使用 Crypto.js 实现 AES 加密解密

新的需求,前后端通信需要将数据加密后再传输,敲定了使用 AES。

安装:

1
2
npm install crypto-js
npm install --save @types/crypto-js

参数:

1.AES加密算法,ECB & CBC。

2.32位秘钥key(通过给定秘钥取md5值获得),”123456”。

3.16位初始向量iv,秘钥key的md5值前16位。

4.加密数据,”123456789”。

使用 Crypto.js 实现 AES 加密解密

微信小程序 IOS 端输入框提示存储密码的解决方法

由于 IOS 系统「自动填充密码」这个功能是默认开启的,在小程序的登录页面,当填写完账号密码的 input 框光标离开后,选择不存储的话,有一定几率登录的 button 按钮会无反应。

微信小程序 IOS 端输入框提示存储密码的解决方法