![](https://img-blog.csdnimg.cn/20200730094120388.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
过不去的坎
文章平均质量分 61
记录开发中遇到的问题
皮蛋很白
没有什么难点是一觉醒来解决不了的
展开
-
echart 设置 legend.type=“scroll“ 翻页时,中文上面被截取,显示不完整,解决办法
设置 legend 的。原创 2023-10-27 17:16:57 · 867 阅读 · 0 评论 -
vue2.6 和 2.7对可选链的不同支持导致构建失败
已知 node14 之后就支持可选链了,我和同事用的是 node14和node16,所以和node版本也没关系。有两个vue2项目,构建配置和依赖基本上都一样,但一个可以在 template 模板中使用可选链(已知 vue2.7 是支持可选链的,所以我怀疑是这个原因导致产生了现在的区别。已知 vue2.6 不支持可选链,但可以通过 babel 编译:需要安装。但是报错的那个项目,在另一个同事那又不报错。发现,其中支持可选链的项目中。,再次运行,项目也支持可选链了。了,而另一个不支持的项目中。原创 2023-10-12 16:39:16 · 1219 阅读 · 0 评论 -
Vue 项目安全扫描漏洞,JS 库版本太低,要求升级 YUI,过程总结
检测到目标站点存在javascript框架库漏洞 - YUI2版本引发的安全漏洞解决方案原创 2023-04-07 16:58:39 · 9326 阅读 · 5 评论 -
关于HTTPS网页不能发起HTTP协议请求(OpenSSL 生成密钥方法)
场景描述当 HTTPS 协议的网站中使用了 HTTP 协议的资源,Chrome 浏览器会发出警告:# Warning:Mixed Content: The page at 'https://aaa' was loaded over HTTPS, but requested an insecure image 'http://bbb'. This content should also be served over HTTPS# 混合内容:'https://aaa' 页面已通过 HTTPS 加载,但是原创 2021-01-08 14:07:54 · 5467 阅读 · 0 评论 -
Vue 滑块解锁组件(无UA算法校验)
依据 JS拖动滑块验证 开发的 Vue 滑块解锁组件。<template> <div ref="wrap" class="slider-unlock"> <div class="before">请按住滑块,拖动到最右边</div> <div ref="after" class="after"> <div class="after-inner">{{ success?'验证成功':'请按住滑块,拖动到最右原创 2021-11-01 17:28:46 · 648 阅读 · 0 评论 -
Video.js 加载视频失败切换其它 source
Video.js 加载视频失败切换其它 source使用 Video.js 加载视频(本例为 m3u8 直播视频源)时,如果失败就会显示错误提示 UI。一些场景下无法进行手动刷新,所以需要对加载失败的场景进行处理,尝试加载其它可用的视频源。本例介绍 Video.js 如何切换 source、如何捕获错误,以及一些细节。Video.js 提供的 API 有多种方式可以实现这个功能,本例只是其中一个方案。示例代码<!DOCTYPE html><html lang="en"&g原创 2021-10-27 11:40:00 · 13347 阅读 · 7 评论 -
关于 sharp libvips 图像处理库
libvips 是一个 C 语言编写的性能非常高效的图像处理库。Node 环境下无法直接使用 libvips,因为处理图像对效率和性能有要求,所以一般都是用 C/C++ 底层代码编写的sharp 是 Node.js 平台上相当热门的一个图像处理库,其实际上是基于 C 语言编写的 libvips 库封装而来,因此高性能也成了 sharp 的一大卖点。sharp 可以方便的实现常见的图片编辑操作,如压缩、裁剪、格式转换、旋转变换、滤镜添加等。Gridsome 内置了这个工具。sharp 参考:gi原创 2021-01-07 17:30:59 · 1873 阅读 · 1 评论 -
Nodejs 基于 Autodesk Forge 转化和展示 BIM(rvt 格式)
本人对于 BIM 一无所知,笔记中都是搜索引擎查找+猜测+总结的成果,一些结论和断言会有不准确和不专业之处,请多多见谅。背景工作的项目中需要在页面中展示 BIM。BIM 有很多解释,这里指的是 Building Information Model - 建筑信息模型,简单说就是为建筑工程绘制的 2D/3D 模型。功能需求是:将提供的 .rvt 文件的模型展示在 web 页面中。经过一番研究:BIM 模型文件有多种格式,.rvt 格式是 Autodesk Revit 开发的项目文件。前端无法.原创 2021-10-27 09:58:41 · 3914 阅读 · 3 评论 -
网站部署到服务器后 CSS 文件加载成功,但是没有生效
刚解决了一个问题,前端代码发布到服务器后,样式没有生效。开始以为 nginx 配置的静态资源路径有问题,通过 network 发现 css 文件确实请求成功。然后怀疑代码有问题,查看 css 文件中其中一个 dom 节点的样式,确实能匹配上(data-xxx 一致),将样式拷贝后通过 elements 看板手动添加上,样式也生效了。文件下载成功,内容没问题,但就是没有生效,好像浏览器并没有据此构建 CSSOM(这一点也许可以通过性能调试工具查看),如此神奇的事情之前没有遇到过。后来发现原来是 ngi原创 2022-05-09 11:35:43 · 2120 阅读 · 1 评论 -
配置过期 eslint-plugin-vue 规则导致 eslint 失效原因定位
今天使用 Vue CLI 创建 Vue 应用,然后从之前的项目中拷贝 ESLint rules,但是 vscode 并没有识别,格式化配置中也没有 ESLint 选项。一般这种情况应该是 ESLint 配置有问题,可能是插件、解析器或者规则。一个一个注释后重载 vscode 查看效果,最终定位到 eslint-plugin-vue 下的 vue/max-attributes-per-line 规则:// 强制每行的最大属性数'vue/max-attributes-per-line': [2, {原创 2022-03-23 10:18:41 · 7940 阅读 · 0 评论 -
使用 vscode 调试 node 无法进入内部模块的解决
vscode 提供调试功能可以调试 node php go 等程序。它需要先创建一个配置文件 launch.json 才能开始调试。以 Node 为例:自动创建的 launch.json:{ // 使用 IntelliSense 了解相关属性。 // 悬停以查看现有属性的描述。 // 欲了解更多信息,请访问: https://go.microsoft.com/fwlink/?linkid=830387 "version": "0.2.0", "configurations":原创 2021-10-09 09:24:30 · 1607 阅读 · 0 评论 -
禁止 input 自动填充
在编写 Form 表单样式的时候,修改自动填充后的 input 样式是很麻烦甚至不可行的,而且还有一些不需要自动填充的场景。自动填充常出现在表单中有 type="password" 的 input 控件,浏览器会在表单加载时候监测到存在 password 的表单控件,然后将保存在客户端的信息自动填充它和相邻的表单控件中。input 的 autocomplete 表示这个控件的值是否可被浏览器自动填充,设置为 off 表示用户必须手动填值,或者该页面提供了自己的自动补全方法。浏览器不对此字段自动填充。。原创 2021-09-17 10:13:22 · 5955 阅读 · 1 评论 -
Vue Cli 构建多页面应用时配置 preload 插件
Vue CLI 可以通过在 vue.config.js 文件下配置 pages 进行多入口打包配置,实现多页面应用开发。多页面模式下如果要修改插件配置,可能会出现一些问题,常见的就是 preload-webpack-plugin 插件。配置示例:// vue.config.jsmodule.exports = { pages: { pc: {/*...*/}, h5: {/*...*/} }, chainWebpack(config) { config.plugi原创 2021-09-06 14:44:39 · 7663 阅读 · 5 评论 -
AXIOS 请求被浏览器缓存
测试兄弟今天提了个 BUG,发现在 IE 下修改列表数据后再重新查询,列表没有变化,而 Chrome 浏览器上正常。经确认,是浏览器缓存所致,因为测试的时候习惯性打开 F12,勾选了 Disable cache(禁用缓存),所以没注意到。而 IE 浏览器不常用,并且设置禁用缓存的方式没有 Chrome 那么方便。但终其原因,还是代码编写上没有对 GET 请求进行缓存清理配置(同一个请求调用多次没有唯一标识)。然后测试取消勾选了 Chrome 的 Disable cache 再试一下,还是正常的,这又原创 2021-07-12 11:48:15 · 1347 阅读 · 0 评论 -
IE 浏览器 和移动端 new Date() 接收的参数不支持 YYYY-MM-DD 格式
项目中用到一个判断超时的操作,代码如下:function isOvertime(time) { // 由于还有其它判断条件,这里使用了 ! 而不是 <= return !(new Date(time).getTime() > Date.now())}const handleTime = getHandleTime() // 处理时限 -> 2021-03-24 15:40:00console.log(isOvertime(handleTime ))// IE -> fa原创 2021-03-24 15:44:05 · 364 阅读 · 0 评论 -
vue 函数式组件不生效 - render 函数要返回一个 vNode
Vue 在选项对象中提供一个 render 方法可以函数式编写渲染内容: render。一定要注意的是:return 的一定要是 vNode(createElement 方法返回的结果),否则内容不会显示,也不会报错。今天在项目中使用函数式组件,截取指定字数的文本,怎么搞都不显示返回结果,render 方法也是执行了,后来发现是返回内容的格式问题。原代码:export default { functional: true, props: ['text', 'max'], render.原创 2021-03-18 15:34:10 · 1949 阅读 · 0 评论 -
URL 长度限制
URL 长度限制结论:前后端任何请求的 URL 建议限制长度,否则请求可能会失败(414)。HTTP 协议对 URL 长度的描述HTTP手册The HTTP protocol does not place any a priori limit on the length of a URI. Servers MUST be able to handle the URI of any resource they serve, and SHOULD be able to handle URIs of u原创 2021-02-07 12:08:20 · 11239 阅读 · 0 评论 -
vscode JS括号后面没有加分号,导致代码高亮、注释不正常
如图当调用方法,或者定义数组、对象时。一些场景下如果在括号() 、[]、 {}后面没有写分号;,后面的代码的高亮就不能正常识别,并且使用快捷键注释后面的代码,也奇怪的用了 JS 的注释符。最后发现原来当 <script> 标签没有写 type="text/css" 属性的时候,vscode 在识别 JS 代码的时候就有点迷糊。源码:<!DOCTYPE html><html lang="en"> <head> <meta char.原创 2020-11-17 17:30:53 · 1431 阅读 · 2 评论 -
mockjs坑来坑去
mockjs 请求报 404在vue项目中使用 Mock.mock 方法拦截 GET 请求返回模拟数据。Mock.mock( rurl, rtype, template ) 官方文档参数的含义和默认值如下所示:参数 rurl:可选。表示需要拦截的 URL,可以是 URL 字符串或 URL 正则。例如 /\/domain\/list\.json/、'/domian/list.json'。参数 rtype:可选。表示需要拦截的 Ajax 请求类型。例如 GET、POST、PUT、DELETE 等。原创 2020-10-28 10:55:01 · 1395 阅读 · 0 评论 -
axios下载msword文件损坏
axios下载msword文件损坏场景项目中请求后端接口下载一个docx文件。Response如下:这时首先想到的是后端返回了二进制流,需要将流转换为Blob,生成downloadUrl,使用a标签下载。Ctrl V 百度的代码:axios({ url: 'http://localhost:5000/download', method: 'POST', data: { //... }, responseType: 'blob', // 设置服务器响应的数据类型(必选原创 2020-07-30 15:44:32 · 1291 阅读 · 0 评论 -
vue-cli创建的项目使用eslint+prettier格式化的问题
vue-cli创建的项目使用eslint+prettier格式化的问题背景项目框架:Vue CLI 4 创建,使用了ESLint。IDE:VscodeIDE插件:ESLint 、 PrettierPrettier 格式化快捷键:Alt + Shift + F现象在格式化非 HTML 原生标签时出现换行问题,例如:<el-button size="mini" typf="primary" @click=" openRouter({ name: 'name'原创 2020-07-24 15:28:06 · 1936 阅读 · 0 评论 -
forEach 和 for of/ for 循环在使用await上的区别
代码:// 延迟 num 秒后 打印 num const say = async (num) => { console.log(num, 'begin:') await new Promise(resolve => { setTimeout(() => { console.log(num) resolve() }, num * 1000) })}const nums = [2, 1]// 遍历 nums 打印async f原创 2020-07-21 15:31:10 · 1414 阅读 · 0 评论 -
webpack配置hot是否需要配置HotModuleReplacementPlugin
webpack配置hot是否需要配置HotModuleReplacementPluginwebpack官方文档(devserverhot)中介绍,使用hmr的时候,需要满足两个条件:配置devServer.hot为true配置webpack.HotModuleReplacementPlugin插件Note that webpack.HotModuleReplacementPlugin is required to fully enable HMR. If webpack or webpack-原创 2020-07-17 22:53:46 · 9266 阅读 · 1 评论 -
eslint-loader无法检查vue-loader编译的js部分的代码
eslint-loader无法检查vue-loader编译的js部分的代码在使用webpack+vue开发时,一般使用vue-loader对.vue文件进行处理。vue-loader原创 2020-07-13 17:30:44 · 1022 阅读 · 0 评论