- 博客(26)
- 资源 (4)
- 收藏
- 关注
原创 记一次静态资源被CDN厂商劫持并添加广告
这个时候就很容易判断出来这个域名应该不是业务发起的,并且也没有配置过微信里面授信域名,那这个域名是怎么出来的呢。然后网上搜索了一圈,发现BootCDN还是有被植入后台代码的问题。然后我来就通过禁用这个js请求,发现就不会再有如下的请求地址了。最近频繁有人反馈在企微里面访问H5应用的时候,出现如下错误。然后我们经过N此的无痕模式下测试,最后发现了这个请求地址。经过查找发现业务里面引用了一个第三方的js文件。然后看了下正常情况下资源返回的内容是。通过解析这段代码发现,请求的地址是。
2024-03-12 11:16:46
1357
原创 Web端专业级H264/H265 直播流播放器实现-JessibucaPro播放器
这个主要是参加“深圳 liveVideoStack” 的ppt的文字版的分享。题目是:Web端专业级H264/H265 直播流播放器实现-JessibucaPro播放器
2023-11-30 10:24:05
2191
原创 基于nodejs的动态编译 weex 组件的平台
大纲在苏宁业务快速发展的背景下,以前的大促促销页使用到的组件已经无法满足业务的需求,为此我们设计了一套基于weex的组件动态构建方案,实现了模块的动态编译,减少了不必要的资源引用,提高了页面性能。目前苏宁易购的客户端的促销页都是使用了这套方案,支撑了日常和大促的用户体验和稳定性。业务背景介绍每个月都是大促苏宁作为中国零售业的巨头,几乎每个月都在搞促销活动,除了几个大促,例如618、818、十一国庆、双十一、双十二、元旦、过年。在这个频繁的促销活动的背景下,要求业务开发人员高...
2021-04-14 10:44:25
269
1
原创 electron 桌面端业务中的小结(坑)(二)
文章目录背景杀毒软件破坏检查防止debug调试客户端崩溃报告@sentry/electron提升客户端启动速度使用 V8 缓存数据性能监测分析v8-inspect-profiler延迟加载模块滚动条样式统一browserWindow 错误监听errorunhandledrejectionbrowserWindow a 标签,打开默认浏览器electron-中无法使用-jquery、requirejs、meteor、angularjs。electron-bridge代理设置PACHTTP系统版本比较(mac)
2021-04-13 13:38:18
1102
原创 基于vue和jsplumb的工作流编辑器开发(二)
背景本文是对 ‘基于vue和jsplumb的工作流编辑器开发’ 的扩展业务实现撤销初始化数据自动排列清空数据撤销对于撤销的实现,主要是需要一个缓冲内存,存储每次操作之后的数据结构,方便再点击撤销按钮的时候,从缓冲内存中拿出数据结构来渲染页面。利用数组来存储操作之后的数据结构。let MEMORY_LIST = [];这里只缓存10次操作。$_updateMemoryList() { <!--格式化数据结构--> const tempItem = t
2021-04-07 15:28:21
867
3
原创 利用http-proxy-middleware实现本地化前端项目dist目录预览
文章目录背景项目地址背景由于http-proxy 不支持 pathRewrite 参数,所以没得办法只能通过 http-proxy-middleware插件来实现。项目所依赖的connectserve-statichttp-proxy-middlewarehttpopen引用依赖const connect = require('connect');const serveStatic = require('serve-static');const http = require('h
2021-03-31 10:57:31
341
原创 electron 桌面端业务中的小结(坑)
文章目录简介安装electron依赖本地数据库选择indexedDB封装的库SQLiteLowdbelectron-storeelectron-json-storage-alt、electron-json-storagelocalstorage/sessionstoragecookie小结自动升级electron-updater自己写的升级模块window 平台mac 平台对于 asar文件对于 dmg 文件网络检查(window)主进程 http请求客户端net模块封装urllib封装axiosreque
2021-03-17 23:25:30
4666
原创 基于vue-next(vue3)企业微信H5搭建
背景业务需要,需要编写一个服务在企业微信里面的H5应用。需要解决的问题有:UI库选型响应式布局按需引入组件企业微信登录本地预览http请求水印企业微信桌面端支持UI库选型已有的移动端组件库(vue)有。vant(有赞) 支持 vue2,vue3NutUI(JD) 支持vue2,vue3Mint UI (element) 支持vue2,最新release 是2017年根据实际需求,选择适合自己的组件库。个人推荐 vant。一直持续更新中。响应式布局利用的是postcs
2021-03-11 23:49:17
1027
原创 利用http-proxy实现本地化前端项目dist目录预览
背景前后端分离项目,前端发布基本是在服务器放置一个目录,然后通过 nginx 代理方式,通过监听 / 跳转到前端dist目录存放的路径下的index.html。server{ location / { gzip on; add_header Cache-control no-cache; root 前端dist目录存放的路径; index index.html; try_files $uri $uri/ /inde
2020-05-14 11:01:19
455
原创 electron端快捷键打开devtools
背景当产品上线之后,出现现网问题的时候,如何定位问题呢。如果能够通过快捷键的形式唤起devtools就真香了。代码需要在 electron 的 jsbridge 中注入进去。关于 electron 的jsbridge 实现请看历史文章。// preload.jswindow.addEventListener('keydown',e=>{ const {altKey,ctrlKey,metaKey,keyCode} =e; <!--alt + ctrl + (Comm
2020-05-12 14:20:24
3294
1
原创 electron 端的jsbridge实现
背景想通过一套代码既能跑在浏览器端,又能跑在electron 端,这个时候就需要electron 在使用 BrowserWindow 的时候,参数上面需要添加webPreferences参数代码// main.jsconst mainViwndo = new BrowserWindow({ webPreferences: { webSecurity: false, nodeIntegration: true, preload: path.jo
2020-05-11 17:33:19
940
原创 撸一个jquery的ajax 方法
背景参考jquery 的ajax api 封装了一个ajax 方法技术难点jsonp封装promise支持formData支持便捷方法封装模块化支持jsonp封装jsonp的原理就是基于script 标签,给src 赋值 请求接口,通过传递 回调函数(?callback=jsonp12121)给服务器端,服务器端将响应通过typeof jsonp12121 === 'function' && jsonp12121(respData) 的形式响应给浏览器。完整的json
2020-05-10 09:33:54
436
原创 基于express 的mock工具
背景以前撸的一个简陋版本的 mock 平台,基于 express的,用mongoDB 存储数据,支持mockjs语法。数据库MongoDB依赖expressmongoosemockjs支持的功能mock数据CRUDmock数据分类mock数据编辑的历史版本对比mock数据的预览访问。项目截图githubhttps://github.com/b...
2020-05-08 11:11:01
255
原创 基于electron和ffmpeg下载rtmp直播流
背景利用electron 封装一个下载器,底层使用的是ffmpeg 去下载直播流。支持 单次下载文件的合并功能。技术electronffmpegchild_process.spawnelectron-packager核心打包利用 electron-packager 进行打包{ "package": "electron-packager ./"}测试可以利用...
2020-05-06 16:28:27
2391
原创 基于vue和jsplumb的工作流编辑器开发
背景需要实现一个工作流,支持拖拽节点生成工作流。业务实现支持页面布局缩放支持节点支持if else支持多分支技术点网格背景工作流缩放工作流技术实现节点拖拽技术选型vuejsplumbsortablejs(vue-draggable)难点攻破网格背景主要是利用css的 linear-gradient 和 background-size 实现的。<...
2020-04-29 16:23:29
4395
4
原创 基于vue的可视化大屏开发
简介业界解决方案百度的 sugar 可视化解决方案https://sugar.baidu.com/home阿里datavhttps://data.aliyun.com/visual/datav腾讯云图https://cloud.tencent.com/product/yuntu尺寸现在一般的大屏设计基本都是16:9 或者是 32:9的尺寸设计稿设计稿给出来的图也基本是16:9...
2020-04-27 10:55:32
9046
原创 http 请求头部和相应头部
简介对于请求头部和相应头部的认识请求头部在http请求头部里面 含有的参数有(常用):AcceptAccept-EncodingAccept-LanguageCache-ControlConnectionHostPragmaUpgrade-Insecure-RequestsUser-AgentCookieContent-LengthContent-TypeIf-M...
2020-04-26 17:24:53
259
原创 利用axios实现断点续传并支持进度条和取消上传
需求文件上传,如果文件大小小于5M 则直接上传,否则需要切割文件,每个最大5M 大小进行上传。技术选型axios服务器端提供的接口/*** data:传参,是一个formData 对象* processCallback :监听process的函数* cancelFun :取消函数*/function uploadFile(data, processCallback, can...
2020-04-25 10:27:50
1523
原创 react hook 小结
文章目录redux 的坑函数组件Hook 的含义注意项useState() 状态钩子demo更新state的函数 setXXXuseContext() 共享状态钩子useReducer() action 钩子useEffect() 副作用钩子业务上面的帮忙useCallback为什么 useCallback 比 componentDidUpdate 更好用useMemo 做 PureRenderu...
2020-04-24 10:01:36
506
1
原创 基于koa的h5视频录制异步上传
需求h5 录制视频,异步上传到 node 服务器端文件保存在服务器端。技术选型前端jquery后端koa技术坑点h5 录制视频<input type="file" name="file" accept="video/*" id="takeVideo" capture="camcorder"/>主要依赖 accept 属性 和 capture 属性...
2020-04-23 11:25:37
208
原创 基于nuxt.js 搭建的监控系统
背景纯nodejs 搭建的监控系统。依赖clientshelljsnode-schedulesocket.io-clientservernuxtkoaelement-uimongooseechartssocket.ioclient通过配置定时任务的方式,执行 shell 执行,然后往服务器端发送监控信息(websocket)。收集的数据cpu收集 cpu...
2020-04-20 09:48:43
399
原创 React Native StyleSheet 样式属性
简介React Native StyleSheet 提供一系类的对样式(类似css)属性。其中包括Layout 布局相关的transform 改变相关的shadow 阴影相关的View 视图相关的text 文本相关的image 图片相关的DangerouslyImprecise 相关的Layout 布局相关的export type LayoutStyle = $ReadO...
2020-04-19 10:26:42
298
原创 头像图片上传可能会用到的图片压缩和图片旋转技术
业务背景突然有一次搞活动,需要用户上传自己的自拍照,然后服务器端把头像做些特殊处理,这个时候可能会遇到的坑。坑点二:人像是倒着的如果用户直接采用摄像头拍照,这样的话获取到的照片可能会是倒着的,这样是影响业务的。坑点一:图片过大现在手机拍出来的照片,基本都是5M 以上的图片,对于上传压力太大了。解决方案人像是倒着的: exif.js 来解决可以通过 exif.js 来获取图片的各种信...
2020-04-18 17:16:20
183
原创 从头编写一个 HTTP 静态资源服务器
首先需要的Node 模块有 http,url,path,fs 模块。// 提供一个http 服务var http = require('http');// 用于处理 url 字符串和 url对象var url = require('url');// 用于处理文件路径var path = require('path');// fs 模块 用于读取文件的var fs = requir...
2020-04-18 12:23:34
177
原创 理解浏览器宿主环境下,javascript引擎对于脚本的处理
# 脚本处理模型## JavaScript的基本特点1. js是一门相当简单的运行时解释语言。2. 对象模型很直接也没有类的概念(ES5)。3. 有自动垃圾回收。4. 弱数据类型。5. 动态类型(dynamic typing):运行的时候才确定对象的类型。6. javascript没有内置的I/O机制。扩展:javascript程序与宿主环境进行交互,是通过一系列预定义的方...
2018-10-23 20:03:15
248
原创 从头编写一个 HTTP 静态资源服务器
文章目录首先需要的Node 模块有 http,url,path,fs 模块。// 提供一个http 服务var http = require('http');// 用于处理 url 字符串和 url对象var url = require('url');// 用于处理文件路径var path = require('path');// fs 模块 用于读取文件的var fs = r...
2018-10-18 11:04:05
243
基于linux的试卷
2012-09-01
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人