HTML5 Sortable 是一款使用原生 HTML5 drag 和 drop API 来对列表或网格进行排序的 jQuery 插件。
下载和使用:官网
步骤:
1、给 <ul /> 添加 sortable 样式类
2、引入 jquery.sortable.js
3、$('.sortable').sortable();
通过绑定 sortupdate 事件来获取排序后的 DOM 位置,示例:
$('.sortable').sortable().bind('sortupdate', function (event, ui) {
var item = $(ui.item[0]);
var prev = item.prev();
$.post(window.location.pathname, {
xdo: 'fn_sort',
cid: item.data('cid'),
prev: prev.data('cid') // 可能为 undefined
}, function (json) {
if (json.result.success) {
} else {
toastr['error'](json.result.info);
}
}, 'json');
});

在 VMware 虚拟机上安装 macOS 黑苹果系统的过程比较简单,分以下几个步骤进行:
1、用 Securable 工具检测电脑是否支持“虚拟技术”
2、下载并安装 VMware,写本文时最新版本 v12.5.5
3、下载 macOS 懒人版安装镜像,写本文时最新版本 v10.12.4
4、下载并安装 Unlocker,写本文时最新版本 v2.0.8,用于在 VM 中新建虚拟机时显示 Apple Mac OS X
5、新建虚拟机,用记事本打开虚拟机的配置文件 .vmx,底部加一行:smc.version = "0"
6、设置(详见下方链接图文教程)
7、将镜像文件后缀名 .cdr 改为 .iso,加载到虚拟机的 CD/DVD 中,启动,运行磁盘工具进行分区
8、安装完成后推出 CD/DVD,安装 VMware Tools
9、如果觉得卡,进行一些操作
请参考:Hegel_SU 撰写的《VMware 12 安装 macOS S 10.12》详细图文教程

兼容建议:(2017年初)
连淘宝都放弃 IE6 了,就不需要再坚持了;
IE7 跟错了老大(Vista),已经没有市场了;
当前市场份额最大的操作系统还是 Win7,所以 IE8 是必须要兼容的,就算国人都安装了国产浏览器,内核也未必会升到 IE9-11。
当然每个站的访客群体不同,具体还得参考网站统计数据来确定兼容级别。
为了友好,建议你在不打算兼容的浏览器上提供升级提示和新版下载链接。
如果是纯移动端,那么大胆地用 HTML5 就行了。
以下例举我遇到过的兼容问题:
浏览器版本 | 注意事项 |
IE6-7 | <input type="radio" /> 必须设置 name 才能被选中 |
IE6-7 | 不支持 console.log |
IE6-7 | 不支持 JSON.stringify |
所有 IE | 不支持 <input /> 新的 type 类型,查看详情 |

收录了一些个人觉得不错的网页开发插件。
由于插件更新频繁,本页如有错误请指正,也欢迎告知更多功能强大、使用方便的插件。
插件 | 简介 | 备注 |
框架 | ||
jQuery | 最流行的 JS 框架 | 下载、中文文档、英文整合文档、中文整合文档,浏览器支持、来自 css88 的文档 官方建议 IE 6-8 使用 1.12.4 |
Angular、中文版 AngularJS (version 1.x) | 一套框架,多种平台同时适用手机与桌面 | MVC 架构,使得开发现代的单一页面应用程序(SPAs:Single Page Applications)变得更加容易 |
Vue.js | 是一套用于构建用户界面的渐进式框架。 | |
Bootstrap、中文版 | 简洁、直观、强悍的前端开发框架 | 英文文档、v3中文文档、v2中文文档、视频教程,主题和模板 |
jQuery UI | 为 jQuery 提供更丰富的功能 | 示例:Datepicker、Color Animation、Shake Effect |
功能 | ||
jQuery File Upload | jQuery 文件上传 | 英文文档 |
jQuery Cookie | 读取、写入和删除 cookie | 浏览器支持,文档 |
json2.js | json 操作库 | 已弃用,旧 IE 用 jQuery 的 parseJSON,HTML 5 用 JSON.parse |
Lightbox | 老牌图片浏览插件 推荐使用更强大的 Viewer.js | |
Swiper、中文版 | 最现代的移动触摸滑块(Most Modern Mobile Touch Slider) | 英文文档,中文文档,旧浏览器支持版本:2.x.x,Swiper 2 英文文档,中文文档 |
jquery-cropper | 图片裁剪 | |
FastClick | 用于消除手机浏览器上触摸事件触发之间的 300 毫秒延迟 | 用法,不应用的场景 |
PACE | 页面加载进度条 | 文档,IE8+ |
toastr | jQuery 通知 | 文档 |
Autosize | 一款小巧的,可自动调整 textarea 高度的独立脚本 | IE9+ |
X-editable | 允许您在页面上创建可编辑元素 | 文档,Demo |
select2 | 一款提供搜索过滤、自定义样式的下拉框插件 | |
jQuery Tags Input | 标签输入框 | 用法 |
Viewer.js | 图片浏览插件 | GitHub(viewerjs)、GitHub(jquery-viewer) jquery-viewer 是 viewerjs 的 jQuery 插件,即在 jQuery 环境中要同时引用这两个脚本。 |
PDF.js | A general-purpose, web standards-based platform for parsing and rendering PDFs. | |
编辑器 | ||
UEditor | 百度在线编辑器 | GitHub 下载、文档、ASP.NET 部署教程 |
日期时间 | ||
bootstrap-datepicker | Bootstrap 日期选择器 | Online Demo |
DateTimePicker | 日期时间选择 | |
MultiDatesPicker | 多日期选择 | |
FullCalendar | 日历日程事件工作表 | IE 9+, jQuery 2.0.0+ |
TimeTo | 计时、倒计时 | |
图表 | ||
D3.js | D3.js 是基于数据驱动文档工作方式的一款 JavaScript 函数库,主要用于网页作图、生成互动图形,是最流行的可视化库之一。 | |
Highcharts、中文版 | 兼容 IE6+、完美支持移动端、图表类型丰富、方便快捷的 HTML5 交互性图表库 | 文档 |
ECharts | 百度图表控件 | |
AntV | 来自蚂蚁金服的专业、简单、无限可能的可视化解决方案 G2 - 专业易用的可视化类库 G2-mobile - 移动端高性能可视化类库 G6 - 关系图可视化类库 | 流程图, 关系图, 可视化规范, 地图, 河流图, 力导图, 网络图, UML图, 业务流程图, 时序图 |
SyntaxHighlighter | 功能齐全的代码语法高亮插件(JS) | |
动态排名数据可视化 | 将历史数据排名转化为动态柱状图图表 开源代码,非插件,修改使用 | GitHub、视频教程、EV录屏、网页示例、视频效果 |
图标 | ||
Font Awesome | 完美的图标字体 | IE 8+,v3.2.1 支持 IE 7,进阶用法(定宽/边框/动画/旋转/叠加) |
Glyphicons | 图标字体 | 作为 Bootstrap 组件 |
Iconfont | 阿里巴巴矢量图标库 | 用户可以自定义下载多种格式的 icon,也可将图标转换为字体,便于前端工程师自由调整与调用 |
UI 框架 | ||
WeUI | 同微信原生视觉体验一致的基础样式库 | Demo、Wiki |
Apple UI Design Resources | 苹果用户界面设计资源 |

将字符串作为文本文档输出:
Response.AddHeader("Content-Disposition", "attachment; filename=文件名.txt"); Response.Write(字符串内容); Response.End();
直接提供服务器文件下载:
FileInfo thefile = new FileInfo(path); Response.Clear(); Response.ClearHeaders(); Response.Buffer = false; Response.ContentType = "application/octet-stream"; Response.AppendHeader("Content-Disposition", "attachment;filename=" + HttpUtility.UrlEncode("刮刮卡参与") + id + ".csv"); Response.AppendHeader("Content-Length", thefile.Length.ToString()); Response.WriteFile(thefile.FullName); Response.Flush(); Response.End();
输出使用 NPOI 创建的 Excel(MemoryStream):
HSSFWorkbook book = new HSSFWorkbook(); …… MemoryStream ms = new MemoryStream(); book.Write(ms); Response.AddHeader("Content-Disposition", string.Format("attachment; filename={0}.xls", scene.d.drama + " " + scene.s.time_show.ToString("yyyy年MM月dd日HH时mm分"))); Response.BinaryWrite(ms.ToArray()); Response.End(); book = null; ms.Close(); ms.Dispose();
最后,如果要指定文件编码,加上这句就行:
Response.ContentEncoding = Encoding.xxx;

各位站长好:
根据苹果相关通知,从2017年1月1日起,所有上架AppStore的应用必须支持https协议。
仍然采用HTTP传输的站点APP,将无法在AppStore被用户下载使用,也无法进行升级更新等工作。
官方视频
https://developer.apple.com/videos/play/wwdc2016/706/
相关新闻
http://www.chinaz.com/news/2016/1028/602635.shtml
根据AppStore审核要求,站长需要在2017年1月1日之前,在APP服务器全面部署https。
尽管不升级支持https后果严重,但诸位也不必太过担心,马甲根据要求为各位提供一份服务器升级https的技术文档,供您参考。
https的优点:
1. 相对于http,https可以确保数据在网络传输过程中不被篡改(如禁止运营商插入广告),同时可以提升网站的安全性。
2. iOS可以实现微信内部浏览器直接启动并打开App对应页面。
APP网站升级https步骤:
1. 为APP域名申请购买SSL证书(可选免费型);
2. 将SSL证书部署到APP站点。
https证书申请方法:
1. 进入阿里云(独立服务器客户可注册一个阿里云账号,无须购买阿里云主机)https证书申请页面 https://www.aliyun.com/product/security/markets/aliyun/product/cas
2. 购买https证书,选择免费类型,点击购买(无需实际付款)
3. 购买完成后,进入控制台-CA证书服务页面,找到证书订单,点击“补全”
4. 填写证书对应的域名信息,免费证书只能用于一个域名(请填写完整域名例如:test.magapp.cc 而不是 magapp.cc)
5. 继续补全证书信息,注意域名验证类型选择DNS,邮箱填写自己常用邮箱即可,稍后系统会往邮箱发送域名解析信息。
6. 下一步生成证书请求文件(CSR),这里建议选择“系统生成CSR”,点击右侧创建,创建完成后,点击提交审核,开始申请https证书。
7. 稍后系统会向邮箱发送一份该邮件,邮件包含需要在域名管理后台解析的信息。
8. 到域名管理后台添加新的域名解析,注意解析类型为CNAME
9. 添加新域名解析完成后,系统会对您的申请进行审核(审核时间在几分钟到几个小时不确定),如果审核成功系统会为你签发https证书,失败也会有相关原因说明,如果失败可根据提示重新申请。
10. https证书申请成功后,下一步就可以下载并部署到APP服务器。
11. 点击下载后,可以根据阿里云提供的部署文档,进行相关的服务器部署工作。
12. 部署完成后,验证是否部署成功
第一步:使用https协议访问域名是否能正常访问,例如 https://test.magapp.cc
第二步:在线检测域名是否满足苹果审核要求,网址为:https://www.qcloud.com/product/ssl.html#userDefined10
填写自己申请https的域名
如果域名检测各项满足会显示如下图所示
部署注意事项:
1. https使用的是443端口而不是默认的80端口,需要在wdcp安全管理-iptables开启443端口。
2. https免费证书有效期为一年,请各位站长作好记录,提前重新申请。
3. 站点从http转到https完全过渡需要一段时间,建议在部署时站点同时支持http和https。
4. 部署过程遇到任何问题,可联系您的专属运维人员。
MAGAPP技术部
最近做到微信语音时用到,将微信的媒体文件(.amr)下载到自己服务器上,并转码为 .mp3 格式。
下载 FFmpeg for Windows,放在网站目录下,譬如:网站目录/bin/ffmpeg/ffmpeg.exe
转换代码
string amr = HttpRuntime.AppDomainAppPath + media.sLocalPath.Substring(1).Replace("/", @"\"); string mp3 = amr + ".mp3"; string ffmpeg = HttpRuntime.AppDomainAppPath + @"bin\ffmpeg\ffmpeg.exe"; Process p = new Process(); p.StartInfo.FileName = ffmpeg; p.StartInfo.Arguments = $@"-y -i {amr} -ar {16000} {mp3}"; p.Start(); p.WaitForExit(); p.Close();
-y 若有提示用户选择,默认“是”
-ar 采样数,微信的 amr 是 8000 Hz,如果不加这个参数转换后的 mp3 的也是 8000 Hz,但是音质下降严重,所以设成 16000 Hz 才勉强保持了音质。
WaitForExit() 是等待转码完毕才继续往下执行。

最近做到微信语音时用到,将微信的媒体文件(.amr)下载到自己服务器上,并转码为 .mp3 格式。
引用“NAudio.dll”或直接搜索 NuGet 包,将音频文件转码为 .mp3 只需要:
var data = new MediaFoundationReader("..\\amr\\test.amr"); MediaFoundationEncoder.EncodeToMP3(data, "..\\test.mp3", 码率默认192000);
若出现异常:
无法加载 DLL“mfplat.dll”: 找不到指定的模块。
原因是没有安装音频解码组件,以 Windows Server 2012 R2 为例:
打开“服务器管理器”,添加角色和功能,勾选“桌面体验”(可能在“用户界面和基础结构”,默认还会勾上“墨迹和手写服务”)
安装完成需要重启计算机。
若出现异常:
不支持给定的 URL 的字节流类型。 (异常来自 HRESULT:0xC00D36C4)
原因可能是没有能够播放 .amr 的解码器,或音频驱动!
如果还是搞不定,本站搜索 ffmpeg 吧!

知其然,才能使其安——王震
常见的攻击手法
SQL 注入
文件上传
弱口令
Nday 攻击
XSS
社会工程学
等等……
被黑原因总结
不知道 | 不及时 | 不在意 |
不知道自用系统安全动态 | 不及时更新系统安全补丁 | 不在意个人信息安全 |
不知道常见黑客攻击手段 | 不及时修复漏洞 | 不在意用户数据安全 |
不知道该如何修复 | 不及时排查被黑系统 | 不在意各种安全软件提示、提醒 |
不知道今后该如何防御 | 不在意细节 |
那些年,醉人的“三字经”
网站渗透娱乐版 | 针对企业的实战版 |
进谷歌 找注入 没注入 就旁注 没旁注 用0day 没0day 猜目录 没目录 就嗅探 爆账户 找后台 传小马 放大马 拿权限 挂页面 放暗链 清数据 |
搞企业 先扫描 默认密 都知道 社工库 找一找 邮箱号 先列好 九头蛇 跑一跑 搞不定 放大招 发邮件 凭伪造 没邮箱 搞网站 二级域 皆可爆 老漏洞 没修好 新漏洞 刷一票 干研发 Git 找 原代码 全都要 CDN 可以跳 防火墙 可以撬 堡垒机 可以绕 云防护 可以秒 是企业 没有哪家搞不了 |
攻击手法统计
Nday攻击:45%
漏洞攻击:35%
其他攻击:15%
0day攻击:5%
一些箴言
80%的安全问题都是已知的安全问题,但是能抵御已知安全问题的网站只有20%
弱口令虽然看起来很弱,但是忽视弱口令只会让你的网站变得更弱
没有百分之百的安全,你所做的一切不是为了让自己无坚不摧,只是让自己不再弱不禁风
80%的系统安全问题都是可以通过升级补丁来解决,但是能做到这点的人只有20%
SQL注入存在十几年了,依然是主流攻击手段,可见安全比的不是谁更先进,而是谁更细心
不要得罪你的开发人员,这就跟你吃饭不要得罪服务员一样,你不知道他下一秒会不会在你的菜里吐口水
还有一句
永远不要觉得你安装的安全防护软件真的可以保护你的安全
服务器安全注意事项
不安装不必要的软件
排查所有系统弱口令
关闭不常用的端口
控制目录权限
不在服务器上下载、打开非官方提供软件
不在服务器上打开他人发来的网页链接
如何排查暗链?
利用查看网站的源代码来检查黑链
使用站长工具“网站死链检测”功能来检查黑链
用 FTP 查看网站文件的修改时间来检查黑链
接入 webscan.360.cn 检测
后门排查
Windows 下,D 盾、安全狗、主机卫士
Linux 下,Seay 一句话扫描脚本、主机卫士 Linux 版
用 FTP 查看网站文件的修改时间来排查恶意后门
接入 webscan.360.cn 等在线检测
安全类书籍推荐
《Web 安全深度剖析》——张炳帅 著
《白帽子讲 Web 安全》——吴瀚清 著
《Web 前端黑客技术揭秘》——钟晨呜(余弦)著
《黑客攻防技术宝典 Web 实战篇》——国外某黑客 著
联系方式
