2024年微信小程序webview缓存处理，2024年最新Web前端开发面试准备

学习笔记

主要内容包括html，css，html5，css3，JavaScript，正则表达式，函数，BOM，DOM，jQuery，AJAX，vue等等

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

HTML/CSS

**HTML：**HTML基本结构，标签属性，事件属性，文本标签，多媒体标签，列表 / 表格 / 表单标签，其他语义化标签，网页结构，模块划分

**CSS：**CSS代码语法，CSS 放置位置，CSS的继承，选择器的种类/优先级，背景样式，字体样式，文本属性，基本样式，样式重置，盒模型样式，浮动float，定位position，浏览器默认样式

HTML5 /CSS3

**HTML5：**HTML5 的优势，HTML5 废弃元素，HTML5 新增元素，HTML5 表单相关元素和属性

**CSS3：**CSS3 新增选择器，CSS3 新增属性，新增变形动画属性，3D变形属性，CSS3 的过渡属性，CSS3 的动画属性，CSS3 新增多列属性，CSS3新增单位，弹性盒模型

JavaScript

**JavaScript：**JavaScript基础，JavaScript数据类型，算术运算，强制转换，赋值运算，关系运算，逻辑运算，三元运算，分支循环，switch，while，do-while，for，break，continue，数组，数组方法，二维数组，字符串

//下面是利用Promise进行同步调用的写法

return new Promise(function (resolve, reject) {

wx.request({

//下面是本机调试的一个地址，上线时请改成自己服务端的地址

url: ‘http://192.168.0.168:8090/getFEVersion’,

data: {},

method: ‘POST’,

header: {

‘content-type’: ‘application/json’,

},

success: function (res) {

if (res.data.success) {

const app = getApp();

//res.data.version 是从服务端返回的最新fe的版本号，即上面的数字101

app.globalData.feUrl = ‘https://www.yourdomain.com/’ + res.data.version + ‘/#/index’

}

resolve();

},

fail: function (error) {

console.log(error);

reject();

}

})

});

},

Nginx 配置

Nginx 正则规则，~ 表示区分大小写的正则匹配，\d 是数字的匹配的正则表达式，正好可以匹配 101 这样的数字表达式。

server{

##其他配置

##…

##其他配置

location ~ /\d {

root /mnt/projects/FE/;

}

}

在服务器上存放项目的路径为 /mnt/projects/FE/101，下图是 Vue 项目构建好的样子。

服务端接口

下面是服务端接口的参考代码，我们可以将最新的版本号存入数据库：

@RequestMapping(value = “getFEVersion”, method = RequestMethod.POST)

public Object getFEVersion(HttpServletRequest request) {

ResponseVo responseVo = new ResponseVo();

//从数据库中获得最新的版本号

responseVo.setSuccess(“101”);

return responseVo;

}

总结

到此，我们将小程序发布上线，重启 Nginx 使得配置生效，后续每次构建前端工程，都生成一个新的版本号，如 102、103 等等，将该版本号填入数据库中，后端接口都会及时返回最新版本号，使得小程序总是以最新的路径加载，从而做到 web-view 都能及时的加载最新的 H5 页面。

结束

一次完整的面试流程就是这样啦，小编综合了腾讯的面试题做了一份前端面试题PDF文档，里面有面试题的详细解析，分享给小伙伴们，有没有需要的小伙伴们都去领取！

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

战+最新讲解视频】](https://bbs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0)**