谷歌浏览器

最近做的一个后台系统中，前后端都使用接口通讯，并且为了保证开发进度，确保只兼容新式浏览器，Chrome、Firefox。 结果在Chrome浏览器中，在处理AJAX向后台提交数据表单信息时，出现中文的地方，POST到后端的都是乱码。 先确保所有的js、html模板文件、以及合并、压缩后的js文件都是utf-8编码模式，但是还是不行。 遂在构造POST的参数的时候，手动加上了： 很不幸，chrome还是不给力，仍旧有乱码，看了下开发人员工具中的请求头如下： 好奇怪的Content-Type，为什么这个header被设置了两次，而且连接到了一块儿？？ 又翻开底层的 Tangram Ajax请求逻辑： 发现，在POST方式的情况下，Content-Type会被设置两次，貌似 Tangram 有那么一点瑕疵，作者在编写这里的时候，可能会想，浏览器在发送这个POST请求的时候，设置两次相同的header，后者就会覆盖前者。但是实际上在个别版本的Chrome中，两次被叠加了，遂修改之： 绕过第二次的设置，再次尝试，发现没有中文乱码了，同时请求头也正确了： 结论： 1，Chrome的版本更迭太快，不同版本之间，可能存在细微特性的差别，因为，在另一个同事的Chrome中，可以设置两次Content-Type，后者会覆盖前者，而不会拼接； 2， Tangram 的POST请求方式中

因为某些原因 国内墙谷歌的Chrome实在厉害 所以我比较推荐使用天行浏览器 原因不解释 你自己试着Google一下就知道了 插件也就不多说推荐了 Chrome的开发者工具已经强大到没朋友的地步了，特别是其功能丰富界面友好的console，使用得当可以有如下功效： 更高「逼格」更快「开发调试」更强「进阶级的Frontender」 Bug无处遁形「Console大法好」 console.log 大家都会用log，但鲜有人很好地利用 console.error , console.warn 等将输出到控制台的信息进行分类整理。 他们功能区别不大，意义在于将输出到控制台的信息进行归类，或者说让它们更语义化。 各个所代表的语义如下： console.log ：普通信息 console.info ：提示类信息 console.error ：错误信息 console.warn ：警示信息 当合理使用上述log方法后，可以很方便地在控制台选择查看特定类型的信息。 console.log('一颗红心向太阳','吼吼~'); console.info('楼上药不能停！'); console.warn('楼上嘴太贱！'); console.error('楼上关你毛事？'); 如果再配合 console.group 与 console.groupEnd ，可以将这种分类管理的思想发挥到极致

转自： https://www.cnblogs.com/jiangxiaobo/p/5669976.html 先来看下 ie、火狐、谷歌浏览器下各个字体显示情况 ie下： 火狐下： 谷歌下： 从上面的图可以很明显看出谷歌下 css设置字体大小为12px及以下时，显示都是一样大小，都是默认12px; 那么网上一直有一个方法就是给当前样式添加谷歌私有属性：-webkit-text-size-adjust:none; 可是我进行验证后发现，在谷歌现在的新版本里已经无效。那么我们应该如何设置谷歌下的字体呢？ 我们可以使用到 css3里的一个属性： transform:scale() 属性介绍可以戳这里： http://www.w3chtml.com/css3/properties/2d-transform/transform.html 这个属性前给-webkit-谷歌前缀，那么就可以控制字体的大小，代码如下： 1 2 3 4 5 6 7 < style > p{font-size:10px;-webkit-transform:scale(0.8);} /*这里的数字0.8，是缩放比例，可以根据情况变化。*/ </ style > < p >中梦测试10px</ p > 如下图： 但是要注意一点，如果这个<p>元素有背景的话，给这个属性会使背景也随着变化，所以，我们可以给<p>标签里再套个

之前做秒杀器的时候，使用的是 WPF 客户端，借助 HttpWebRequest 来实现远程调用。 后来看到别人抢火车票的软件是一个 Chrome 插件，发现这样写起来要简单太多了。一直想搞一个插件。 今天比较闲，做了一个简单的插件，用于一次性打开多个连续的连接地址，例如这个网页： 它一共有 15 页。一页一页点实在太累，这时，可以使用这个插件，点击一下，弹出以下窗口： Url 已经根据当前的连接地址修改好了，调整部分系数，点打开，即在 chrome 里面打开了所有的网页，看完一个关一个就好了： 这样一次性加载好，不用点一下等一会儿。 有兴趣的朋友可以下载下来玩下，看源码的也行，非常简单，下面是程序和源码： 程序与安装包 来源： https://www.cnblogs.com/zgynhqf/archive/2012/03/28/2421588.html

Audits和Chrome性能插件 Audits Audits 其实就是分析当前网页的性能的，比如说雅虎军规，这个东西能够大致给我们分析出来一些我们做的不好的地方而且能给我们一些解决意见。 雅虎军规参考网址： https://github.com/creeperyang/blog/issues/1 Audits 面板 performanceTracer -- Chrome 插件 Page Speed -- Chrome 插件 performance.timming 这是代码形式的一个 API ，是谷歌提供给我们的在浏览器里面我们可以通过网页去检测的 上面这个插件光学是没什么用的，得需要先了解浏览器的整个的执行机制，下图就是 整个的一个网页从我们用户输入到输出的时候这之间经过的很多的过程，上面的 performance.timing 很好的捕捉到了这样的一个节点，这个节点里面我们主要观察的是 DNS 这一阶段，就是查找 DNS 之间，然后是 握手的时间，请求的时间，输出的时间，还有就是 onload 的时间，那么中间隔着的 DNS TCP Request Response 这几个时间是需要我们非常非常关注的，如果我们是专注于性能开发的，这几个点做的非常漂亮，那么这样整个一个网页的性能是非常高的，所以做网页性能的时候这几个点一定要卡住 1、先打开 XAMPP 开启 Apache

继vue单元测试，将进行vue的e2e测试学习。 学习点： 安装uirecorder 用工具（UI Recorder）录制测试脚本 测试脚本的回放 本文意在安装UI Recorder，并且利用该工具进行测试脚本（.js）的录制与回放。 一、安装 安装NodeJS（已安装）、Chrome（已安装）、UI Recorder、mocha。 解决权限问题： 在虚拟机Linux操作系统下，会涉及到另一种安装失败的情况： 权限不足（permission denied） 。故在install uirecorder之前，先配置权限： #sudo chown -R $(whoami) $(npm config get prefix)/{lib/node_modules,bin,share} 以上命令表示为当前用户设置npm相关安装目录的权限 chown全称为change owner，授予权限命令 -R 表示递归，对指定目录下所有的子目录和文件采取同种操作 $(whoami) 表示获取当前用户名，即为当前用户设置权限【也可以直接写用户名】 $(npm config get prefix) 表示获取 npm 全局安装默认目录　　 安装uirecorder和mocha： #npm install uirecorder mocha -g 若是安装失败（在安装到chrome相关包时可能会失败）

某厂面试归来，发现自己落伍了！>>> ###################### Chrome ###################### wget http://chrome.richardlloyd.org.uk/install_chrome.sh chmod u+x install_chrome.sh ./install_chrome.sh ###################### NTFS ###################### yum -y install ntfs-3g ###################### Virtualbox ###################### yum -y install kernel-devel ###################### Mplayer ###################### yum -y install svn yum -y install wget yum -y install yasm yum -y install gtk2-devel yum -y install make yum -y install gcc yum -y install git wget http://www.mplayerhq.hu/MPlayer/releases/codecs/essential

本次，转载一个怎么部署vue debug的chrome插件 先导 vue-devtools是一款基于chrome浏览器的插件，用于vue应用的调试，这款vue调试神器可以极大地提高我们的调试效率。帮助我们快速的调试开发vue应用。 第一步： 我们可以先从github上找到vue-devtools的项目，下载到本地。下载vue-devtools链接。 克隆方法：git clone https://github.com/vuejs/vue-devtools.git 第二步： 解压下载好的文件，进入到vue-devtools目录，安装项目所需要的依赖包。 安装方法：npm install 或者 cnpm install （注：cnpm命令是国内的镜像，速度会快一些） 第三步： 编译项目文件。 编译方法：npm run build 第四步： 修改安装目录vue-devtools\shells\chrome 中 的manifest.json文件。 persistent参数改为true，访问协议是否包含：1.http:// / ; 2.https:// / ; 3.file:///*;这三种情况 image.png 第五步： 添加至浏览器： 添加方法：在chrome浏览器输入地址：“ chrome://extensions/ ”进入扩展程序页面，然后点击“加载已解压的扩展程序...”按钮

以python环境为例，学习selenium首先电脑中应该安装了python环境。 在cmd界面通过 pip install selenium 命令来安装selenium。 以Chrome浏览器为例，首先在下载Chrome浏览器，可在官网进行下载，下载完成后，在地址栏输入chrome://version/，查看当前下载的chrome浏览器的版本。（如果下载的时候已经记得自己的浏览器版本，可忽略查看chrome版本信息步骤） 下载好浏览器后，就需要下载相应的浏览器驱动了，我们选择去相应的镜像网站进行下来，网址为： Chrome驱动下载地址 选择对应自己版本的chrome浏览器驱动版本进行下载，下载后为一个压缩包，将压缩版进行解压即可。如果想将解压路径就当做浏览器驱动的使用位置，那么路径中最好不要包括中文。同样我们也可以对驱动进行路径配置，这样每次在调用webdriver的时候就不用每次填写路径了。 下面通过selenium实现第一个自动化测试程序吧。 代码如下： from selenium import webdriver wb = webdriver . Chrome ( ) wb . get ( 'http://www.baidu.com' ) pass 通过from导入selenium中的webdriver，创建一个webdriver对象

　　这篇文章是根据目前 chrome 稳定版(19.0.1084.52 m)写的, 因为 google 也在不断完善chrome developer tool, 所以 chrome 版本不同可能稍有差别. 一些快捷键也是 windows 上的, mac 下的应该大同小异. 　　常规的断点相关的 breakpoint/conditional-breakpoint/call-stack/watch-expressions 等就不涉及了. 1. Beautify Javascript 　　js 文件在上线前一般都会压缩下, 压缩的 javascript 几乎没有可读性, 几乎无法设定断点. 在 Scripts 面板下面有个 Pretty print 按钮(这种符号 {}), 点击会将压缩 js 文件格式化缩进规整的文件, 这时候在设定断点可读性就大大提高了. 2. 查看元素绑定了哪些事件 　　在 Elements 面板, 选中一个元素, 然后在右侧的 Event Listeners 下面会按类型出这个元素相关的事件, 也就是在事件捕获和冒泡阶段会经过的这个节点的事件.在 Event Listeners 右侧下拉按钮中可以选择 Selected Node Only 只列出这个节点上的事件，展开事件后会显示出这个事件是在哪个文件中绑定的, 点击文件名会直接跳到绑定事件处理函数所在行, 如果