XHR

我在较早之前的随笔《 基于MVC4+EasyUI的Web开发框架形成之旅--附件上传组件uploadify的使用 》Web框架介绍中介绍了基于Uploadify的文件上传操作，免费版本用的是Jquery+Flash实现文件的上传处理，HTML5收费版本的没有试过。随着Flash逐渐退出整个环境，很多浏览器都可能不再支持Flash的了，因此在更新原有EasyUI整个框架的时候，我们对框架全面进行了完善，包括替换了这个Uploadify的文件上传模块，使用EasyUI内置的FileBox控件，结合Jquery的Ajax操作，我们就可以实现了单文件或者多文件的上传操作了。本篇随笔就主要基于这个主题，介绍基于FileBox控件实现文件上传处理，包括前端页面代码和后端的C#处理代码的操作。 1、FileBox控件的使用 FileBox控件原理上是一个TextBox控件和隐藏的一个File控件，因此对于TextBox控件的变化时间onchange依旧可以使用，而由于其隐藏了File控件，那么需要根据DOM规则获取其下面的File控件，从而可以获得文件列表进行Ajax的上传操作，同时由于File文件是一个特殊的内容，我们在上传的时候，使用了JS的FormData对象容器来进行承载文件信息和其他信息，从而能够顺利把文件及其他内容信息一并通过AJax调用，上传到后台去处理。 按照官方的示例

前段时间研究 二进制流图片展示 遇到了Blob对象,在这里做一下笔记。 在一般的Web开发中，很少会用到Blob，但Blob可以满足一些场景下的特殊需求。Blob，Binary Large Object的缩写，代表二进制类型的大对象。Blob的概念在一些数据库中有使用到，例如，MYSQL中的BLOB类型就表示二进制数据的容器。在Web中，Blob类型的对象表示不可变的类似文件对象的原始数据，通俗点说，就是Blob对象是二进制数据，但它是类似文件对象的二进制数据，因此可以像操作File对象一样操作Blob对象，实际上，File继承自Blob。 Blob基本用法 创建 可以通过Blob的构造函数创建Blob对象： Blob(blobParts[, options]) 参数说明： blobParts ： 数组类型， 数组中的每一项连接起来构成Blob对象的数据，数组中的每项元素可以是 ArrayBuffer(二进制数据缓冲区), ArrayBufferView,Blob,DOMString 。或其他类似对象的混合体。 options ： 可选项，字典格式类型，可以指定如下两个属性： type，默认值为 "" ，它代表了将会被放入到blob中的数组内容的MIME类型。 endings， 默认值为"transparent"，用于指定包含行结束符 \n 的字符串如何被写入。

Quill富文本的使用 官网 https://quilljs.com/docs/quickstart/ 1、安装quill 使用 mpn i quill -S 2、新建myquil.vue文件，内容如下 < template > < div class ="quill-editor" > < slot name ="toolbar" ></ slot > < div ref ="editor" ></ div > < div id ="editor" ></ div > <!-- 测试video标签 --> <!-- <video src="https://www.w3school.com.cn/i/movie.mp4" controls="controls" width="100%" height="100%" webkit-playsinline="true" playsinline="true" x5-playsinline="true"></video> --> < input id ="uploadImg" ref ="uploadImg" type ="file" style ="display:none" accept ="image/jpeg, image/png" @change ="uploadImage" > < input id ="uploadVideo"

tinymceeditor富文本编辑器的使用 官网链接： https://www.tiny.cloud/docs/quick-start/ 1、安装tinymce 使用 mpn i tinymce -S 2、新建tinymceeditor.vue文件，内容如下 < template > < section id ='tinymceeditor' > 这是tinymceeditor富文本编辑器 </ section > </ template > < script > import tinymce from ' tinymce ' import ' tinymce/themes/silver/theme.min.js ' import ' tinymce/skins/ui/oxide/skin.min.css ' import ' tinymce/skins/ui/oxide/content.min.css ' // import 'tinymce/skins/content/default/content.min.css' import ' ./zh_CN ' import ' tinymce/plugins/preview/plugin.min.js ' import ' tinymce/plugins/colorpicker/plugin.min.js ' import '

为什么要爬天气呢?1.可以练练手2.利用itchat库实现自动回复功能后，把查天气的功能集成起来，实现微信自助查天气功能! 首先，还是相似的套路，我们看看能不能在官网上直接抓包(XHR)来获取一个通用API。然后直接用API查询就OK?在百度搜关键词【天气】或者【南京天气】会跳出对应的网页: http://www.weather.com.cn/weather/101190101.shtml.点进去，可以看到相应城市下一周的天气情况： 再换一个城市上海，我们发现，浏览器地址变为： http://www.weather.com.cn/weather/101020100.shtml。原来101020100这串数字对应着相应城市的代码。我们来分析下页面上XHR请求，看看有没有直接抓包的可能 ? 经过谷歌浏览器——检查-Networt-XHR-刷新，发现并没有XHR请求，看来我们需要的天气内容和城市代码，可能是包含在页面中经过JS和服务器处理后呈现的.....好吧，尝试失败! 再看一下JS请求，发现太多了，无力去逐一查看!所幸网上有人早已记录下了所有城市对应的城市代码。我把拷贝了一下，存到了本地mysql，数据在百度云上，需要的可以自行下载下，执行SQL即可直接把SQL表和数据一并建好。 https://pan.baidu.com/s/1kXaN2Aj 密码是：8y6n。 好了

如下文章是早期编写，有一些错误，建议读新写的文章： https://www.cnblogs.com/mysticbinary/p/12620152.html JSONP Hijackin的中文意思是JSON劫持，而能产生JSON数据劫持的原因在于前端被跨站攻击了。跨站=跨域，跨域从字面上理解的话，就是指超出了范围、领域。继续追问一下，那超出了什么范围？原来指的范围有多大？理解跨站攻击的基础在于理解这个域有多大。为了更准确的理解JSON Hijackin攻击，建议读者可以先了解一下如下几个背景知识： 域概念 （下文会介绍） JSON （搜索引擎查一下） 接口回调 （建议看我之前的文章： https://www.cnblogs.com/mysticbinary/p/11869181.html） <br> 域概念解释 在计算机领域里很多地方都会用到这个 域 ，而不同地方所包含的含义却是不相同的，比如说写代码定义的变量有作用域，在局域网建设中有网络域，Internet有一项核心服务是域名解析系统（DNS）。本文所讨论的域就是指DNS的域名。 DNS的工作原理： 在全球各地有众多服务器（分布式），在这些服务器里面都同步的保存着域名和IP的一一映射，这样人们就可以不用记住枯燥的IP地址，只记住有意思的单词域名就行了。 域介绍： 域通过一个点 . 来来分开一个域。域名不区分大小写，有唯一性

【推荐阅读】微服务还能火多久？>>> 嘿嘿大家好！我又来水文章了！！ 今天带来的是实现一个简易的二维码海报分享的小组件！我们可以通过配置我们需要展示的数据，用户名啊，二维码图片等，整合在一起渲染，然后导出图片进行分享。 可以利用这个东东，可以做很多变形。例如生成表白网页等（手动滑稽） 如果对大家有点点帮助，希望大家点一个赞！ 效果预览 微信小程序的效果 点击预览按钮会直接打开生成的海报进行预览 H5上的效果 H5偷懒了，不想搞按钮啥的，直接点击图片生成海报的 base64 编码图片嘿嘿。 技术分析 以微信小程序举例 我们的顶部名字需要居中，而名字是变量会不定宽度 二维码也需要居中显示，根据比例进行缩放 下面的消息部分与上面类似，需要居中显示。用户信息部分，因为需要头像跟用户名进行组合，然后再居中显示。所以需要计算文字的动态宽度。 背景图，需要先进行背景的绘制，根据背景图确定canvas大小 代码实现 前提是，我们的背景需要定尺寸，我这里的背景图是 1030 * 1035 的，因为我这是基于背景图尺寸来确定 canvas 渲染的位置，所以尽量是竖图会比较好嘿嘿~ H5实现方法 1. 先定义一个canvas 定义一个 canvas 组件，弄个id待会获取一下，onclick是偷懒，其实应该弄个按钮来保存图片嘿嘿 <div class= "container" > <canvas id=

我是计算机专业毕业，毕业后就做了程序员，很多同学也都做了程序员。 刚毕业时，大部分同学都认为考公务员很没劲，收入低没挑战！但工作几年后，同学中一些程序员转行做了公务员，但我却没见过有公务员的同学，转行去回来做程序员！ 程序员的普遍的标签多为高工资、高挑战、加班、青春饭；公务员则是 普通工资 、福利好、安逸、铁饭碗！ 标签是存在，但实际上，所谓的标签也因人而不同 ， 比如： 扶贫一线的公务员，忙起来完全不亚于程序员；而真正实力强悍的程序员，不但不会因年龄大而退居二线，反而大多担当着中流砥柱的作用！ 那么，程序员VS公务员，到底哪个职业更好呢？这个问题，不同的人心里一定会有不同的答案！在我看来，两个职业没有更好，只有更合适！只要这份职业，是你心中所爱，那它就是最好的职业！ 加油！程序员！ 加油！公务员！ 加油！各行各业努力的人们！ 本文原创公众号： 不会笑青年，授权转载请联系微信(laughyouth369) < END > 作者：不会笑青年 漫画师：鹦鹉 友情提示：关注后不会笑青年后，公号内回复 666 ，抽奖 1888 元 点赞 收藏 分享 文章举报 微笑很纯洁 博客专家 发布了291 篇原创文章 · 获赞 6785 · 访问量 205万+ 他的留言板 关注 来源： oschina 链接： https://my.oschina.net/u/4406280/blog/3230738

jQuery load() 方法是简单但强大的 AJAX 方法。 load() 方法从服务器加载数据，并把返回的数据放入被选元素中。 语法： $(selector).load(URL,data,callback); 必需 的 URL 参数规定您希望加载的 URL。可选的 data 参数规定与请求一同发送的查询字符串键/值对集合。可选的 callback 参数是 load() 方法完成后所执行的函数名称。 这是示例文件（"demo_test.txt"）的内容： <h2>jQuery and AJAX is FUN!!!</h2> <p id="p1">This is some text in a paragraph.</p> 下面的这句话会把文件 "demo_test.txt" 的内容加载到指定的 <div> 元素中： $("#div1").load("demo_test.txt"); 也可以把 jQuery 选择器添加到 URL 参数。 下面的例子把 "demo_test.txt" 文件中 id="p1" 的元素的内容，加载到指定的 <div> 元素中： $("#div1").load("demo_test.txt #p1"); 可选的 callback 参数规定当 load() 方法完成后所要允许的回调函数。回调函数可以设置不同的参数： •responseTxt -

CANVAS中使用跨域图片转base64图片时报错处理： function getBase64(imgUrl) { window.URL = window.URL || window.webkitURL; var xhr = new XMLHttpRequest(); xhr.open("get", imgUrl, true); // 至关重要 xhr.responseType = "blob"; xhr.onload = function() { if (this.status == 200) { //得到一个blob对象 var blob = this.response; // console.log("blob", blob) // 一：使用 base64 图片 // let oFileReader = new FileReader(); // oFileReader.onloadend = function(e) { // let base64 = e.target.result; // bgimgSrc = base64; // console.log(bgimgSrc); // }; // oFileReader.readAsDataURL(blob); // 二：使用 blob 图片 let src; if(window.createObjectURL!