
页面前端
文章平均质量分 75
dakang
这个作者很懒,什么都没留下…
展开
-
position:fixed 没有相对浏览器窗口定位的原因 transform冲突
遇到一个有意思的现象, fixed 的元素没有相对 viewport 定位,而是相对于它的父元素进行定位了。逐一排查后 ,发现是transform捣乱了。fixed 元素的块级格式上下文 Block Formatting Context(BFC) 由 viewport 创建,也就是fixed 元素的 BFC 包含在根元素的 BFC 里w3c 对 transform 的[定义]():For elements whose layout is governed by the CSS box mo.转载 2021-07-15 15:12:43 · 2776 阅读 · 0 评论 -
微前端解决方案
文章目录 网易严选企业级微前端解决方案与落地实践 网易微前端的建设背景 建设要点分析 应用隔离 子应用与子应用隔离,js隔离 主应用与子应用隔离 应用间通信 配置中心等相关配套设施 网易严选企业级微前端解决方案与落地实践网易严选企业级微前端解决方案与落地实践网易微前端的建设背景 1.技术栈的迭代与升级 2.巨石应用的维护困难 3.新的前端复用模式探索,各系统之间有很多功能需要复用 即使.转载 2021-01-11 10:51:01 · 404 阅读 · 0 评论 -
vue使用keep-alive指令缓存页面和清除缓存
vue使用keep-alive指令缓存页面和清除缓存 业务背景 解决思路 实现 踩过的坑 业务背景手机端,创建视频会议的场景用户从首页home,点击创建会议,跳转到创建会议页面create,其中选择与会人员需要跳转到另一个联系人的页面contacts,勾选选联系人,选中联系人后,在返回到create页面,原来在create页面录入的数据要保持。解决思路使用keep-alive指令缓存create页面 使用keep-alive指令 的include属性 指定哪些需要.转载 2020-11-02 09:24:46 · 2109 阅读 · 0 评论 -
chrome浏览器解决跨域请求SameSite方案
在chrome浏览器地址栏输入chrome://flags并回车 在搜索栏中输入SameSite by default cookies搜索,并禁用如图中的两项设置 ,改为Disabled即可 点击右下键ReLaunch重启浏览器即可转载 2020-09-28 11:26:03 · 1109 阅读 · 0 评论 -
vue加了scoped反而导致样式不起作用了?
加scoped不就是为什么了保障样式不会乱一个.vue文件里的样式不会受其它文件样式的影响么为什么偏偏会有一个.vue文件里加了scoped反而导致这里面的样式不起作用了是可能是什么原因呢发现问题了是因为我的内容是调接口获取的html通过v-html绑定的可能是进入页面的时候先加载的样式然后绑定的内容...转载 2020-08-19 18:39:43 · 816 阅读 · 0 评论 -
IE11 跨域不能写入cookie解决方案
在做单点登录时,发现Firefox chrome浏览器都没有问题,就IE11有问题,查看了一下子系统的请求,发现子系统没有收到主站的cookie。只需要再header重添加P3P即可Response.AddHeader("P3P", "CP='CURa ADMa DEVa PSAo PSDo OUR BUS UNI PUR INT DEM STA PRE COM NAV OTC NOI DSP...原创 2020-02-22 21:27:19 · 997 阅读 · 0 评论 -
关于Vue/axios下跨域cookie的处理 (IE11)
一般在生产环境下尽量可以通过nginx等反向代理,把vue前端和api接口处理成同一端口和域名。在开发和测试时,也可以使用兼容性比较好的浏览器进行。凡事有例外,以下分别对待不同情况:服务器端 配置cors即可 客户端 配置Axios.defaults.withCredentials = true,这样大部分浏览器都支持跨域cookie了,反正新版本chrome下无问题。...转载 2020-02-22 21:24:17 · 1373 阅读 · 0 评论 -
CORS跨域发送两次请求原理及解决方法
CORS跨域时,为何会发送两次请求?跨域资源共享(CORS)是什么?跨域资源共享(CORS) 是一种机制,它使用额外的 HTTP 头来告诉浏览器 让运行在一个 origin (domain) 上的Web应用被准许访问来自不同源服务器上的指定的资源。当一个资源从与该资源本身所在的服务器不同的域、协议或端口请求一个资源时,资源会发起一个跨域 HTTP 请求。CORS需要浏览器和服务器同时支持...转载 2020-02-22 21:22:26 · 2182 阅读 · 0 评论 -
渐变色 filter:progid:DXImageTransform.Microsoft.Gradient 影响div的鼠标响应区域?
引用地址:http://nongfuit.com/problem/html_1246.aspx我在CSS文件中设置了一个类以设置某div属性,其中加入了渐变色: filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr= '#C3DAF5 ', endColorStr= '#edf5ff ', g转载 2012-04-28 11:23:51 · 1421 阅读 · 0 评论 -
CSS渐变滤镜兼容性工具,特别好用
链接地址:http://aliceui.com/linear-gradient/http://www.colorzilla.com/gradient-editor/生成出来的代码:background: #1e5799; /* Old browsers *//* IE9 SVG, needs conditional override of 'filter' to '原创 2012-04-28 13:43:10 · 798 阅读 · 0 评论 -
CSS 渐变多浏览器实现
转载链接:http://www.impressivewebs.com/css3-linear-gradient-syntax/CSS3 Linear Gradient Syntax BreakdownBy Louis Lazaris on April 20th, 2011 | 22 CommentsThis is not going to be an extensi转载 2012-04-28 10:33:34 · 624 阅读 · 0 评论 -
css之FILTER:progid:DXImageTransform.Microsoft.Gradient使用
引用链接:http://blog.youkuaiyun.com/mshopping/article/details/3292167FILTER:progid:DXImageTransform.Microsoft.Gradient使用 语法: filter:progid:DXImageTransform.Microsoft.Gradient(enabled=bEnabled,startCol转载 2012-04-28 10:30:43 · 628 阅读 · 0 评论 -
js转换汉字编码,解决GET方式传汉字乱码问题
转载地址:http://hi.baidu.com/langchao826/blog/item/100463d5284918de50da4b56.html如果以get方式请求服务器,地址中有汉字则会非常容易出现乱码。当然解决办法就是不要传汉字,遇到汉字的情况就将其转换编码后再传,这是非常常用的一种方法。例如下面两个地址:转码前的地址:http://localhost:8080/test.转载 2012-05-09 10:39:13 · 3726 阅读 · 0 评论 -
JS通过Get方式调用接口编码问题
先介绍下相关知识:javascript提供了3种对字符串进行转码的方法:escape(),encodeURI(),以及encodeURIComponent()。这三种编码所起的作用各不相同。 escape()方法:采用ISO Latin字符集对指定的字符串进行编码。所有的空格符、标点符号、特殊字符以及其他非ASCII字符都将被转化成%xx格式的字符编码(xx等于该字符在字符集表里面原创 2012-05-09 11:10:21 · 1835 阅读 · 1 评论 -
利用版本号来清空客户端文件缓存
1.用ajax来get或者post数据时,由于浏览器的缓存原因,导致获取的数据不是实时的,解决方案为:我们可以用时间戳做成一个get变量,这样就不会有浏览器的缓存了2.当html页面中的引用的js和css修改后,你会发现部分浏览器请求js和css文件得到的status竟然是304(可以通过Firebug等工具看到),说明读的还是浏览器缓存中老的文件。解决此问题的方法还是给文件的加上版本号原创 2012-05-31 14:38:07 · 1948 阅读 · 0 评论 -
过滤所见所得编辑器里的危险脚本
转载地址:http://bbs.51js.com/thread-77637-1-1.html所见所得的编辑器现在用得越来越多,原因之一,用户体验好。但是作为开发者,我们也应该清醒的认识到,这样的编辑器往往成了危险脚本、木马的温床。我们不能容忍蛀虫就在我们自己的东西里面滋生。下面我就来尝试用正则替换的办法,使得编辑器里面的脚本无所遁形。可能我想的不是很全面,希望有漏网之鱼的,朋友们请转载 2012-06-06 17:10:56 · 864 阅读 · 0 评论 -
XSS过滤函数 PHP
转载地址:http://bbs.php100.com/read-htm-tid-41980.htmlhttp://www.neatstudio.com/show-378-1.shtmlhttp://qa.taobao.com/?p=12129http://chaoyueziwo21.blogbus.com/logs/20491494.html第一个是老外写的转载 2012-06-08 18:00:42 · 2515 阅读 · 4 评论 -
XSS过滤函数修正版 PHP
前面这个帖子http://blog.youkuaiyun.com/kaosini/article/details/7646363已经介绍了XSS防御的两种方法,但是凡事还是应该以事实为依据,于是我测试了里面提到的两个方法1.function RemoveXSS($val)2.function filter_xss($string, $allowedtags = '')$test原创 2012-06-11 17:49:00 · 2198 阅读 · 4 评论 -
xss 语句大全
转载地址:http://blog.sina.com.cn/s/blog_3f595e9e010007pf.htmlalert(document.cookie)='>cript>alert(document.cookie)alert(document.cookie)alert(vulnerable)%3Cscript%3Ealert('XSS')%3C/script%3E转载 2012-06-12 13:59:22 · 1657 阅读 · 1 评论 -
NGINX_CONCAT_MODULE 安装和配置(静态文件打包下载)
转载链接:http://www.gracecode.com/archives/3044/简介nginxconcatmodule 是 淘宝研发的针对 nginx 的文件合并模块 ,主要用于 合并前端代码减少 http 请求数 。如果你的应用环境中部署了 nginx,那么可以考虑尝试此模块减少请求数。安装安装 nginxconcatmodul转载 2012-05-04 13:48:58 · 1297 阅读 · 0 评论 -
浏览器DNS解析ip后会缓存
今天把域名从一个ip上面换到另外一个ip上面,结果发现解析后好长时间了,原来的机器上还有量,就想着应该是浏览器DNS解析ip后缓存的问题,缓存失效后应该就不会再解析到原来的机器上了。下面也是别人遇到的同样的问题-------------------------------------------------昨天改IP的时候发现,虽然我新设置的的域名指向已经生效,但是本地原创 2012-07-05 15:27:49 · 2655 阅读 · 0 评论 -
javascript中toFixed不同浏览器解析不一样的问题,好扯。。。。
document.write("1.255:"+(1.255).toFixed(2)+"");document.write("2.255:"+(2.255).toFixed(2));IE6下为:1.262.26Chrome下为:1.252.25因此引用了哥覆盖方法,做到兼容//重写toFixed方法 Number.prototype.to原创 2012-07-31 16:33:02 · 3903 阅读 · 0 评论 -
Chrome的桌面通知
最近在使用朋友网(不加链接,避免有打广告的嫌疑),发现会出现提示“是否允许网站显示桌面通知?”,如下图所示:这种做法,在页面加载完时直接调用请求,比起开心网的这种提示感觉有些野蛮了。开心网的桌面通知提示如下:先检查用户是否已经允许了本站的桌面通知,在未允许的情况下:点击后Chrome才出现提示,感觉更人性化一些,起码这个通知出现是由用户主动触发的。 这两个网站,发现桌面转载 2012-09-27 14:52:44 · 1443 阅读 · 0 评论 -
Chrome的通知功能—webkitNotifications对象
在很多社交网站如facebook, 人人网上,都会有一种消息提醒的功能。当你在浏览网页时有人给你发了消息,在你页面的右下角会出现一个小的提示框。这是一个很实用的小功能,但在目前来说,它有一个局限性:提示框只能在浏览器的当前页面中显示。如果你此时在浏览其他页面,甚至是干其他事情,提示框就显示不出来了。当前,社交网站们都使用了提示声音来增强这种提示功能。但如果告诉你有一种办法能够实现在桌面上显示出一个转载 2012-09-27 14:09:51 · 3441 阅读 · 0 评论 -
"data"类型的Url格式
http://www.letuknowit.com/archives/76http://jinguangyao1127.blog.163.com/blog/static/131281854201112121312264/所谓"data"类型的Url格式,是在RFC2397中 提出的,目的对于一些“小”的数据,可以在网页中直接嵌入,而不是从外部文件载入。例如对于i转载 2012-09-21 13:10:15 · 7234 阅读 · 0 评论 -
Web开发Gzip适合的场合
很多人都会遇到服务器带宽打的很高的情况,通常最有效的方法就是打开服务器的gzip功能,但不是所有文件都适合gzip的,gzip对于文本文件的压缩效果最为明显,对图片进行压缩,反倒会增加服务器的负担。注:手机Wap开发的话打开Gzip也极为重要,可以为用户节省流量。作为网站服务器,从用户体验等来说开启gzip压缩是势在必行,对所有的静态资源都进行了gzip,包括所有的css,js,图原创 2012-11-16 10:06:56 · 848 阅读 · 0 评论 -
大型网站架构设计及技术分析
一个小型的网站,比如个人网站,可以使用最简单的html静态页面就实现了,配合一 些图片达到美化效果,所有的页面均存放在一个目录下,这样的网站对系统架构、性能的要求都很简单,随着互联网业务的不断丰富,网站相关的技术经过这些年的 发展,已经细分到很细的方方面面,尤其对于大型网站来说,所采用的技术更是涉及面非常广,从硬件到软件、编程语言、数据库、WebServer、防火墙等 各个领域都有了很高的要求,已转载 2012-11-16 11:07:27 · 971 阅读 · 0 评论 -
浅谈网站图片服务器
现在很多电子商务的网站上都会用到大量的图片,而图片是网页传输中占主要的数据量,也是影响网站性能的主要因素。因此很多网站都会将图片存储从网站中分离出来,另外架构一个或多个服务器来存储图片,将图片放到一个虚拟目录中,而网页上的图片都用一个URL地址来指向这些服务器上的图片的地址,这样的话网站的性能就明显提高了,图片服务器(ImageServer)的概念也就产生了。 那么这种方案对一个轻量转载 2012-11-16 13:08:05 · 787 阅读 · 0 评论 -
Cookie同步问题
最近负责的一个需要将一个域名的cookie信息同步到另外一个域名上,下面是自己尝试的各种方法。我们先假设有域名domain1.com和domain2.cn,需要实现这两个域名的名称为myCookie的Cookie实现两台机器上同步写了个服务器端写Cookie的页面,然后抓取不同域名之间互相抓取这个页面(将cookie名称,值作为参数传给这个页面实现写Cookie),结果失败原创 2012-12-24 18:04:46 · 1786 阅读 · 2 评论 -
WAP站开发之3G版、触屏版跳转验证工具
现在越来越多的手机开始支持HTML5等一些新技术,原本只能通过图片和Flash来实现的东西,可以通过HTML5来实现了。但是我们给用户的WAP站的入口只有一个,这就需要判别手机操作系统和手机浏览器后,自动跳转到适合的版本(3G版或者触屏版)。验证跳转的效果,我们可以通过手机来进行测试,但是仅仅为了测试这个功能,拿那么多手机来测试,个人感觉太过于浪费,况且我们的手头的测试手机也不可能一下子就那么原创 2012-12-26 13:57:21 · 1070 阅读 · 0 评论 -
HTML+CSS 画三角形
今天看了篇博文,说用HTML和CSS来实现画三角形的目的,于是比葫芦画瓢做了个例子,代码为:股票行情 *{margin:0;padding:0;}.rectangle{width:0;padding:0;border:100px solid transparent;border-left-color:red;}执行效果为:但是这个只是原创 2012-12-26 18:01:07 · 2148 阅读 · 0 评论 -
4种检测是否支持HTML5的方法
1,检查特定的属性是否存在于全局的对象里面,比如说window或navigator.比如geolocation,它是HTML5新加支持的新特性;它是由HTML5工作组以外的Geolocation工作组制定的。要检查浏览器是否支持它可以用一下方法。function supports_geolocation() { return !!navigator.geolocation;}转载 2012-12-27 15:23:32 · 840 阅读 · 0 评论 -
客户端与服务器端userAgent的区别
客户端通过JS来获取userAgent方法为:navigator.userAgent服务起端通过获取http头信息来得到userAgent方法为:Request.UserAgent(以Asp.net为例)这两者的区别为,客户端的userAgent没办法伪造,而服务器端获取的UserAgent可以伪造,因为我们可以修改发送给服务器端的请求的HTTP头信息。原创 2012-12-27 15:49:35 · 2430 阅读 · 0 评论 -
nginx淘宝网升级Tengine实现多文件合并加载
Tengine是由淘宝核心系统部基于Nginx开发的Web服务器,它在Nginx的基础上,针对大访问量网站的需求,添加了很多功能和特性。Tengine的性能和稳定性已经在大型的网站如淘宝网,淘宝商城等得到了很好的验证。它的最终目标是打造一个高效、稳定、安全、易用的 Web 平台。Tengine现已开源。 淘宝网现在已经将其服务器平台软件Tengine 开源,已提供下载。Tengine基于N转载 2013-03-15 14:31:32 · 1809 阅读 · 0 评论 -
iPhone 5/iOS 6新功能介绍
转载地址:http://www.qianduan.net/iphone5ios6-front-end-development-guide.htmliPhone 5和iOS 6已经发布好几天了,相信很多童鞋都已经刷上了iOS 6。我们在之前就发表过《iOS 6中Safari对HTML5的支持》,但是除此之外,实际上市的iOS 6具体支持还有哪些新功能?让我们一起看下。转载 2013-05-16 17:46:06 · 909 阅读 · 0 评论 -
部分国行Android手机缺少谷歌GSM服务包导致HTML5 Geolocation无法定位的问题
最近项目上用到HTML5的geolocation用于定位,用Chrome和手头的手机测试好好的功能,到终端用户那里反馈一些手机不能定位,最后确定出是部分三星、摩托的部分国行Android手机“阉割”了谷歌GSM服务包,导致HTML5的geolocation无法使用wifi和基站定位服务导致。值得一提的是前期在stackoverflow和google groups里搜到对症描述的解决方案转载 2013-07-18 13:24:14 · 4025 阅读 · 4 评论 -
canvas画矩形的时候出现边框样式不一致的问题解决
这两天需要用到同事HTML5画图的东东,发现里面画矩形的函数画出来的边框出现了样式不一致的问题,最后我经过一些排除法找到了问题的症结。先附上HTML5画矩形的的代码: var canvas = document.getElementById('myCanvas'); var context = canvas.getContext('2d');原创 2013-10-12 14:13:12 · 2031 阅读 · 0 评论 -
我所知道的几种display:table-cell的应用
by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=1187一、display:table-cell属性简述display:table-cell属性指让标签元素以表格单元格的形式呈现,类似于td标签。目前IE8+以及其他现代浏览器都是支持此属性的,但是IE转载 2013-11-04 13:00:00 · 894 阅读 · 0 评论 -
推荐个学习webkit css的网站
http://ued.ctrip.com/blog/wp-content/webkitcss/index.html这个站点下面还有不少携程旅行前端开发团队的不少技术类的文档,有兴趣的朋友也可以学习下。原创 2013-11-07 17:04:38 · 730 阅读 · 0 评论 -
background:url的一点妙用
最近WAP上做挺多顶通广告、漂浮广告的东东,我们会根据不同的机型,显示不同的图片。很多人估计都会把所有图片都直接写成,通过css样式display来控制显示与不显示的内容,这样做的好处是简单方便,坏处是所有图片都会加载,这在当今流量还比较珍贵的手机端显然不是个好的处理方式。后来我研究了其它网站的处理方式,发现他们大多是写在css中的,于是我写了几个demo并用firebug测试了下。demo1原创 2013-12-04 10:07:44 · 2638 阅读 · 0 评论