巨应打字员

# 一般做法

一般情况下必须在button上才能绑定分享功能像这样。

```xml
<button open-type="share"></button>
```

这样可以满足大部分情况但是样式极其不好调。

# 自定义做法

这里以 vant-weapp 的tabbar-item做测试。用一个label的for属性指向隐藏分享按钮即可。简单快捷，适用于任何元素。

```xml
<van-tabbar-item>
      <view slot="icon">
        <label for="share">
          <van-icon name="share" size="22px" />
        </label>
      </view>
      <label for="share">分享到群</label>
      <button id='share' open-type="share" hidden='true'>  </button>   
</van-tabbar-item>
```



实战在vant-weapp tabbar-item组件上绑定分享功能

小程序如何在Button以外的元素上绑定分享功能

# 方式一

拷贝nuxt generate生成的文件（dist目录下），到asp.net工程wwwroot目录下。

添加代码

```csharp
app.UseDefaultFiles();
app.UseStaticFiles();
```

完事

# 方式二

如果你想拷贝nuxt生成文件到自定义目录，例如：nuxtdist.

```csharp
var apptEntryDir = Path.GetDirectoryName(Assembly.GetEntryAssembly().Location);
            app.UseFileServer(new FileServerOptions
            {
                //注释掉这种写法，在商店打包项目中会找不到路径
                //FileProvider = new PhysicalFileProvider(Path.Combine(env.ContentRootPath, "nuxtdist")),
                FileProvider = new PhysicalFileProvider(
                 Path.Combine(apptEntryDir, "nuxtdist")),
            });
```



实战 ASP.NET Core 部署 Nuxt.js SSG 静态文件

ASP.NET 部署 Nuxt.js SSG模式生成的文件

某些常见骂人词和伟人名，使用小程序内容识别API任然能通过。例如傻b，周el，导致小程序被封禁。

经调查使用2.0接口可以过滤，不过目前任然灰度阶段，有问题的小伙伴们可以提前接入。

---

# 云调用接入方式

云函数

```js
// 云函数入口文件
const cloud = require('wx-server-sdk')

cloud.init()

// 云函数入口函数
exports.main = async (event, context) => {
  const wxContext = cloud.getWXContext()
  let openid = wxContext.OPENID;
  return await cloud.openapi.security.msgSecCheck({
    content: event.text,
    version: 2,
    openid,
    scene: 1
  })
}
```

这里注意，需要openid两小时内登陆小程序，开发IDE登陆无效，必须在真机登陆。 否则你可能会遇到报错`msgSecCheck:fail code is expired rid:xxx`

# HTTPS 接入

和以前一样，唯一的区别就是加几个参数

1.0调用参数

```json
{ "content":"检测文本" }
```

2.0 调用参数

```json
{

    "content": "检测文本",

    "version": 2,

    "openid": "xxxxxxxxxxxxxxxxx",

    "scene": 1

}
```

# 小程序端调用

```js
async function checkStr(text) {
  try {
    var r = await wx.cloud.callFunction({
      name: 'checkStr',
      data: {
        text
      }
    });
    console.log(r.result.result, r);
    if (r.result.result.suggest === "pass")
      return true;
    return false;
  } catch (error) {
    console.log(error);
    return false;
  }
}
```



解决小程序某些词无法过滤问题

小程序内容安全接口2.0接入教程，增加过滤非法字符

实战 nextjs 接入谷歌adsense广告

---

# 第一步

创建components/ad.js
需要引用 `yarn add uuid` 包

```js
import { useEffect } from 'react'

const Ad = ({ children }) => {
    useEffect(() => {
        try {
            (window.adsbygoogle = window.adsbygoogle || []).push({});
        } catch (error) {
            console.log(error);
        }
    }, [])

    return (
        <>{children}</>
    )
}

export default Ad
```

# 第二步

创建 pages/_document.js

```js
import Document, { Html, Head, Main, NextScript } from 'next/document'

class MyDocument extends Document {
    static async getInitialProps(ctx) {
        const initialProps = await Document.getInitialProps(ctx)
        return { ...initialProps }
    }

    render() {
        return (
            <Html>
                <Head>
                    {/* Adsense */}
                    <script key="adsense" data-ad-client="ca-pub-xxx" async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>                 
                </Head>
                <body>
                    <Main />
                    <NextScript />
                </body>
            </Html>
        )
    }
}

export default MyDocument
```

# 第三步

在需要广告的位置引用ad组件，并且为每个ad组件生成唯一的key，在route改变时才会重新加载广告。

```
import Ad from 'components/ad'
import { v4 as uuidv4 } from 'uuid';

export default function somePage(){
return (
...
            <Ad `key={uuidv4()}`>
                <ins className="adsbygoogle"
                    style={{ display: 'block' }}
                    data-ad-client="ca-pub-xxx"
                    data-ad-slot="xxx"
                    data-ad-format="auto"
                    data-full-width-responsive="true"></ins>
            </Ad>
...
)}
```

# 完事

---

# 注意：

不要把代码放入layout或者其他地方，一定要放在_document.js的 head中。

否则你可能会遇到这个错误`

```
`"adsbygoogle.push() error: Only one AdSense head tag supported per page. The second tag is ignored."`
```

还可以参考：  https://github.com/vercel/next.js/issues/4838

---

vercel,nextjs 交流群：815526049



next.js 添加 adsense代码

一款根据 git 提交记录生成 changelog 的实用工具

---

# 安装

- 安装 [Ruby](https://www.ruby-lang.org/en/)
- 安装工具
  命令行执行 `gem install github_changelog_generator`
- 生成 [GitHub token](https://github.com/settings/tokens/new?description=GitHub%20Changelog%20Generator%20token)，
  否则请求 api 过多会被限制，报错：GitHub API rate limit exceeded
- 新建换进变量 CHANGELOG_GITHUB_TOKEN
  填写上一步生成的 token

# 使用

- 打开对应代码目录执行
  ` github_changelog_generator -u github_project_namespace -p github_project`
  该目录下就会生成 CHANGELOG.md
- 例如：
  
  ```shell
  github_changelog_generator -u giant-app -p livewallpaper
  github_changelog_generator -u giant-app -p livewallpaperengine
  ```

---

[官方文档](https://github.com/github-changelog-generator/github-changelog-generator#installation)



更新记录 Changelog生成工具，github-changelog-generator

当有多个腾讯云账号。每次都要执行tcb相关命令，都需logout,login，再扫码很是麻烦。

---

解决方法：
先去控制台获取密钥
https://console.cloud.tencent.com/cam/capi
然后每次直接密钥登陆

```shell
tcb logout
tcb login --apiKeyId <你的Id> --apiKey <你的key>
tcb hosting deploy <本地路径> -e <环境id>
```



TCB 部署静态网站时 避免登陆

解决Node 管理端SDK不支持直接获取envID

---
解决思路：
使用node-sdk内置符号初始化，然后获取上下文去找到envId，然后初始化管理端sdk。

同时用2个sdk有什么好处？ 
可以用nodesdk来验证用户，管理端sdk做一些高级操作，例如删除云储存文件夹。

直接上代码：
```javascript
const managersdk = require('@cloudbase/manager-node')
const nodesdk = require("@cloudbase/node-sdk");

exports.main = async (event, context) => {
  const tcbApp = nodesdk.init({
    env: nodesdk.SYMBOL_CURRENT_ENV
  });

  const envObj = nodesdk.getCloudbaseContext(context)
  const { storage } = managersdk.init({
    envId: envObj.TCB_ENV
  });
};

```

TCB Node Manager SDK获取当前云函数 envID


两种方式实现小程序返回页面传递值

---

## 方式一，直接调用上一页设置 data

```javascript
  let pages = getCurrentPages(); // 当前页，
  let prevPage = pages[pages.length - 2]; // 上一页
  prevPage.setData({
    subPageResult: "我是结果",
  })

  wx.navigateBack({ //返回
    delta: 1
  })
```

## 方式二，使用 wxStorage

定义 storage-manager.js

```javascript
async function set(key, data) {
  await wx.setStorage({
    key,
    data: JSON.stringify(data),
  });
}

async function get(key) {
  return new Promise((resolve, reject) => {
    wx.getStorage({
      key,
      success: function (res) {
        resolve(JSON.parse(res.data));
      },
      fail: function (e) {
        resolve(null);
      },
    });
  });
}

module.exports = {
  set,
  get,
};
```

子页面

```javascript
const storageManager = require("storage-manager");

async onClickBack(){
  await storageManager.set("subPageResult","我是结果")
  wx.navigateBack({ //返回
    delta: 1
  })
}


```

父页面

```javascript
const storageManager = require("storage-manager");

onShow: async function () {
  let r = await storageManager.get("subPageResult")
},

```


微信小程序返回上一页面传参


Flutter TextFormField 邮箱验证。

---

## 引用三方包

```
dependencies:
  email_validator: '^1.0.0'
```

## 使用

```
import 'package:email_validator/email_validator.dart';

...

Form(
  autovalidate: true,
  child: TextFormField(
    validator: (value) => EmailValidator.validate(value) ? null : "Please enter a valid email",
  ),
)
```


Flutter TextFormField 邮箱验证


解决 VsCode 安装 Golang 模块报错

---

## Golang

- 曾经尝试 Golang 确实不错。但是由于搞其他的耽搁了已几年没碰。
- 在体验过一些开源 go 项目之后，速度之快令人神往.
- 今天再次体验，vscode 打开项目各种报错。我本机已翻墙，为何还是这么多错。
  折腾一小会解决办法如下：

- ## 1 首先你需要把梯子

  Flutter，Go 这些玩意都要梯子。做开发没有梯子还是先去想办法弄一个。

- ## 2 设置 vscode 全局代理
  vscode 左下角打开设置，搜索 proxy，设置为
  `http://梯子ip：port`
  完事
