Layui的form表单登录js提交代码及服务端的处理
Layui的form表单提交的很多处理写到了其自有的js逻辑中，需要注意的一项是如果使用js中的逻辑来进行提交的话，html部分中的登录button按钮需要写成button。不然会在js处理后仍然页面提交。Layui的form表单提交的js代码及服务端的处理代码示例如下： <!--表单登录html部分--> <formmethod="post"class="layui-form"> <inputname="username"placeholder="用户名"type="text"lay-verify="required"class="layui-input"> <hrclass="hr15"> <inputname="password"lay-...[>>…]
使用npm搭建VUE项目全过程
1.基础node环境和IDE的安装 vue项目的基础环境包括开发环境及IDE，IDE之前有篇文章记录：http://www.04007.cn/article/784.html安装VScode即可。开发环境需要安装node.js。vue.js开发为什么要安装node.js呢？准确的说是使用vue-cli搭建项目的时候需要nodejs。vue本身并不完全需要node.js。VUE同样可以像一个JS文件直接引入.html的script中来使用，但通过使用node使开发更方便，并能方便打包部署，解析vue单文件组件和vue模块，启动测试localhost,管理vue-router，vue-resource插件等。所以推...[>>…]
Bootstrap中自适应布局的一些设置
Boostrap本身就是一个响应式自适应的前端UI框架。使用栅格模式后，其自适应功能也能很好的运用。根据浏览器宽度的大小，Boostrap有四种栅栏类名提供使用，用法与Css样式表类名选择器样式调用是一样的：xs：col-xs-1~col-xs-12，多列始终在一行内。sm：col-sm-1~col-sm-12，多列在浏览器像素宽度大于等于768px时才在一行内。md：col-md-1~col-md-12，多列在浏览器像素宽度大于等于992px时才在一行内。lg：col-lg-1~col-lg-12，多列在浏览器像素宽度大于等于1200px时才在一行内。 &...[>>…]
利用img的usemap属性和css3实现圆形点击区域
css属性实现圆形点击区域有两种方式，一是利用img的usemap属性，二是使用CSS3中相关的border-radius属性。 一、使用img结合map实现。usemap属性提供了一种客户端的图像映射机制，通过特殊的<map>和<area>标签，可以将图片不同的区域映射到不同的链接。示例如下： <!doctypehtml> <htmlclass="notranslate"> <head> <metacharset="UTF-8"/> </head> <bodystyle="padding:100px;"> <imgsrc="test.png"usemap="#cri...[>>…]
Vue开发工具VSCode的安装使用以及nodejs中的npm安装
凭借着免费，开源，轻量，跨平台的特点收货了一大批忠实粉丝，现在使用Vscode作开发IDE的人越来越多，特别是前端开发。VSCode对JavaScript语言、库和Web环境的支持都很好。所有关于react、Vue.js、Electron的教程中也都推荐使用VSCode。 VSCode的安装使用，进入VScode的官网https://code.visualstudio.com/ 点击DownloadforWindows下载安装即可，非常方便。安装完成之后运行IDE进行一下语言选择，有方便的中文语言包支持。方法：使用快捷键:ctrlshift+p打开快速...[>>…]
http请求中的Referrer-Policy策略及应用
在页面调用图片等其它资源时，或者发生页面跳转时，都会向服务端发生一个带Referrer的HTTP请求，这也是一些网站做防盗链的抓手，在ReferrerPolicy策略发面前，浏览器可以按自己的默认规则来决定是否加上Referrer。2014年W3C下Web应用安全工作组（WebApplicationSecurityWorkingGroup）发布了ReferrerPolicy草案，对浏览器发送Referrer做了详细规定。在新的ReferrerPolicy中，可以实现隐藏Referrer，也可以只发送来源URL的host地址（不过不允许伪造）。 新的ReferrerP...[>>…]
Access-Control-Allow-Origin如何同时允许http和https的Origin跨域请求
因为后端在跨域的时候需要前端的cookie信息，因此跨域网站在输出Access-Control-Allow-Origin头信息的时候不能指定为*，但是因为网站请求支持http和https两种方式，而使用不同请求方式的时候传给服务器端的origin头信息内容是不一样的。 如果服务器是直接承接的https请求，443和80端口的配置是分开写的到也好处理，可以直接使用在添加header信息的时候根据当前请求的scheme添加头信息。add_headerAccess-Control-Allow-Origin"$scheme://www.04007.cn"always; &...[>>…]
CORS使用Access-Control-Allow-Origin来允许跨域请求
因为浏览器的同源策略，浏览器只允许请求当前域的资源，而对其他域的资源以不信任的态度处理。JSONP是可以解决跨域的一些问题，但JSONP只支持GET请求而不支持POST，因此还是有限，而使用Access-Control-Allow-Origin可以应对各种跨域请求。 CORS全称跨域资源共享（Cross-originresourcesharing）,这是W3C的标准，即是使用Access-Control-Allow-Origin来允许跨域请求，对这种请求也有标准的处理流程。 对于跨域的请求，浏览器端先向目标服务器...[>>…]
关于http的206状态码和416状态码的意义及断点续传
HTTP2xx范围内的状态码表明客户端发送的请求已经被服务器接受并且被成功处理了,HTTP/1.1206状态码表示客户端通过发送范围请求头Range抓取到了资源的部分数据，一般用来解决大文件下载问题，一般CDN服务器都会支持这种能力。能否支持206只要看服务端响应头信息中是否存在accept-ranges:bytes这种头信息。accept-ranges:bytes表明服务器支持Range请求,以及服务器所支持的单位是字节(这也是唯一可用的单位).Content-Length响应头表明了响应实体的大小,也就是真实的视频等文件的大小，如下即是99...[>>…]
前端请求出现414 Request-URI Too Large问题
某个请求一点开一看，报错414Request-URITooLarge。问题很清楚，就是请求的get数据太多了，MYGOD，这种情况怎么能存在，将这么多数据放在get请求中当参数。好吧，事已至此，只能去解决了。服务端是proxy+nginx+php结构，先得从nginx配置修改开始：client_header_buffer_size128k;large_client_header_buffers4128k;client_max_body_size128m; 一般来讲，幸运的话，改完这个你的问题也就解决了。因为你的请求数据并不是很大，或者直接说没有超过64K改完就能正常。不过...[>>…]
