『酱的下午茶』团队全体成员预祝各位掘友新春快乐，岁岁安全，生活美满，兔年大吉！

来年咱们将继续努力，为咱们带来更多优质的内容，让咱们一同共同努力，共同进步！

Hello，又到了每天一次的下午茶时刻。酱酱们的下午茶新增优质作者介绍和码上板块，专心于发掘站内优质创作者和优质内容，欢迎咱们多提宝贵意见！

• 【本期酱的下午茶】亮点：
• 2023年 icon 图标的晋级计划
• 散布式微服务体系的跨库查询/操作的处理思路（联系型数据库）
• 怎么在uniapp中设置隐私政策弹窗
• 怎么让 vite 完美接入 qiankun 子应用
• ……

挑选规矩：文章发布时刻在本期「酱的下午茶」发布时刻的 1-3 天内，且符合社区引荐标准，也会同步发布在相关技能社群。

今日主办人｜下午茶

本期每日由 丘山子 担任制作，需求投稿下午茶请私信我的助理 小岳 。

PS：主办人目前正在招募中，有感兴趣的掘友们能够联系Captain

每日干货｜下午茶

主办人们会对近期（1-3 天）社区深度技能好文进行挖掘和挑选，优质的技能文章有时机呈现在下方列表，排名不分先后。

『前端』

• 2023年 icon 图标的晋级计划

iconfont 的计划其实是在 2016 年揭露，到现在也现已有 6 年之久，它的确在这一段时期的规划范畴中，别出心裁的处理了图标的问题，这么多年也有了丰富的堆集沉淀。但是前端的开展是日新月异的，图标范畴其实这些年也呈现了许多新起之秀。

满足现在的计划，往往是由于视野还不行。（没见过更好的）

• 登录校验的两种方法详解

在现在的大部分网站登录接口的完成，根据用户名和暗码调用登录接口，成功之后登录接口返回token信息，在请求其他接口时，就会携带上，用于登录认证。

那么自己是否思考过，为什么需求登录认证？曾经是怎样完成的？现在是怎样完成的？

• Lottie 动画库运用与原理浅析

之前做运营活动的时候，写了一个比较风趣的打开盲盒的交互动画，流程如下：一个挣扎的未打开的盲盒，点击呈现承认弹窗，承认后集齐的5张卡片会飞入盲盒，盲盒开启弹出礼品。怎样完成的呢？其间挣扎的效果是运用的CSS3做的一个呼吸加颤动的 Animation，飞入的效果是运用JS获取到盲盒的中心点坐标并设置弹窗只展现5张卡片和要改变后样式，盲盒开启的过程则是一个 Lottie 动画。

• 怎么让 vite 完美接入 qiankun 子应用

由于公司有运用微前端技能，技能栈为 qiankun，为了保证对 qiankun 的支持，运用了开发形式走 vite，构建走 webpack：怎么在 webpack 项目中运用 vite 加速。

但是 vite 的开发体验实在是太爽了，所以寻找了一波 qiankun 的 vite 插件，都没有对生产环境 js，css 沙箱的集成，所以只能自己动手写了一个：vite-plugin-legacy-qiankun

• JS闭包函数与柯里化彻底解析

手写完成函数柯里化、闭包

『后端』

• Seata AT形式：MySQL自增ID的场景下个人引荐运用 useGeneratedKeys

Seata AT 形式在 构建 insert 操作的 afterImage 时，如果是自增 ID 的情况下，需求获取刚刺进记载的自增 ID 值是什么。在《Seata-AT 形式+TDDL：排查 构建 Insert 操作的 afterImage 时执行 SELECT LAST_INSERT_ID()报错》 中有描述由于上下文环境中没有激活 useGeneratedKeys ，复用 insert 操作对应的PreparedStatement在执行 SELECT LAST_INSERT_ID()时，因 TDDL 内还会执行 insert 留传的三个占位符对应参数设置的逻辑，而导致了报错。关于报错之处statementProxy.getTargetStatement().executeQuery("SELECT LAST_INSERT_ID()");来说以下两种修复计划好像都能够考虑：

1. 执行 SELECT LAST_INSERT_ID()时，新建一个PreparedStatement
2. 若复用PreparedStatement，也可用clearParameters()办法将 insert 时设置的三个参数清除去

当然从 Seata AT 下的源码中梳理可知，选用useGeneratedKeys，可彻底躲避 Seata 内置的SELECT LAST_INSERT_ID()相关逻辑的执行。

• 聊透spring @Configuration装备类

本章节咱们来探究Spring中一个常用的注解@Configuration。咱们先来了解一下该注解的作用是：用来界说当时类为装备类。

 那啥是装备类啊，有啥用啊。这个咱们得结合实际运用场景来说，通常情况下。加了@Configuration的装备类内部，都会包括一个或多个@Bean注解的办法。

为了简化界说，在后续咱们称@Bean注解的办法为工厂办法。

 装备类的奥秘就在这儿，Spring会保证多次调用@Bean标示的工厂办法，不会重复发生新的目标，始终是同一个，这也遵循了Spring的单例哲学。

 多次调用创立办法，发生的竟然是同一个目标，这貌似违背了编程的基础原理。怎样可能，一定是Spring做了什么，那就跟随着贰师兄的脚步一同解开@Configuration的神秘面纱吧。

这儿咱们很容易发生一个误解，以为只有在加了@Configuration的装备类中，运用@Bean，才干将自界说创立的目标放入Spring容器中。其实不然，在Spring中：万物皆为装备类。在任何能够被Spring管理的类(比方加了@Component的类)中，界说@Bean办法，都能将自界说目标放入到Spring容器，@Bean自身的能力和@Configuration无关哦。

• 两段式轻松梳理SpringCloudGateway源码中心脉络

那这篇文章要点叙述两个事情，经过这两大块，咱们就能够对SCG中心源码有一个比较明晰的脉络：

1. 服务发动阶段在搞啥？
2. 接口调用阶段在搞啥？

• Openmp Runtime 库函数汇总（下）——深化分析锁原理与完成

在本篇文章傍边首要给咱们介绍一下 OpenMP 傍边经常运用到的锁并且仔细分析它其间的内部原理！在 OpenMP 傍边首要有两种类型的锁，一个是 omp_lock_t 别的一个是 omp_nest_lock_t，这两个锁的首要区别便是后者是一个可重入锁，所谓可冲入锁便是一旦一个线程现已拿到这个锁了，那么它下一次想要拿这个锁的便是就不会堵塞，但是如果是 omp_lock_t 不论一个线程是否拿到了锁，只要当时锁没有释放，不论哪一个线程都不能够拿到这个锁。在后问傍边将有仔细的例子来解释这一点。本篇文章是根据 GNU OpenMP Runtime Library !

• 散布式微服务体系的跨库查询/操作的处理思路（联系型数据库）

在后端开发过程中，咱们绕不开的便是数据结构规划以及相关的问题。

然而在传统的单体架构的开发中，处理数据相关的问题并不难，经过联系型数据库中的相关查询功用，以及MyBatis的级联功用即可完成。

但是在散布式微服务中，整个体系都被拆分成了一个个独自的模块，每个模块也都是运用的独自的数据库。这种情况下，又怎么处理不同模块之间数据相关问题呢？

事实上，散布式微服务是非常复杂的，无论是体系架构，仍是数据结构规划，都没有一个一致的计划，因而根据实际情况进行确认即可，关于数据相关的跨库查询，事实上也有许多办法，在网上有如下思路：

• 数据冗余法
• 长途连接表
• 数据仿制
• 运用非联系型数据库
• …

今日，我就来共享一个简单的散布式微服务跨库查询操作，咱们能够参考一下。

咱们仍是从一对多，多对多的角度来处理这个问题。

『移动端』

• ViewModel中的StateFlow和SharedFlow，运用主张以及单元测试

以读取数据库数据为例，Repository担任从数据库读取相应数据并返回一个flow，在ViewModel收集这个flow中的数据并更新状况(StateFlow)，在MVVM模型中，ViewModel中露出出来的StateFlow应该是UI层中仅有的可信数据来历，注意是仅有，这点跟运用LiveData的时候不同。

• 怎么在uniapp中设置隐私政策弹窗

在uniapp中Android能够运用uniapp内置的隐私政策弹窗，能够在应用程序发动前弹出弹窗。但iOS并没有，因而需求经过页面的方法进行设置，这种方法会在应用发动后弹窗弹窗。

趣味码上共享｜下午茶

• 码上精选，收集优秀的码上项目，供咱们一同学习：github.com/akira-cn/jc…
• 码上游戏精选：g.jcode.pub/#/716133153…

投稿专区｜下午茶

咱们能够在评论区引荐以为不错的文章，并附上链接和引荐理由，有时机登上下一期。文章创立日期必须在近 1-3 天内；能够引荐自己的文章、也能够引荐别人的文章。