使用nginx后目录链接自动加斜线“/”的问题

开始是用的Apache,出现了性能问题,于是采用了lnmp一键安装包,转为nginx服务器。

之后WordPress出现了一些问题,比如,偶现在用的模板前端页面不提供登录入口的,偶手写URL访问登陆页面,当偶访问http://www.cssor.com/wp-admin (最后不加/),进入页面后左侧的菜单链接都错了,比如文章下的编辑,点击edit.php链接,进入了cssor.com/edit.php ,而不是cssor.com/wp-admin/edit.php。

wp-admin本身是目录,由于没有自动加/,造成相对路径的链接都出错,无法访问。

Google搜索之,找到方法,来源于:http://www.vpser.net/manage/nginx-auto-add-slash.html

最近lnmp一键安装包的部分用户反映在访问http://www.lnmp.org/phpmyadmin时,因为域名结尾没有加斜线”/”而造成无法访问。

原来使用的自动添加斜线”/”的解决方法,通过查询Nginx wiki找到了更好的解决方法:

在nginx.conf中

http{

server_name_in_redirect off;      #自动添加斜线”/”语句

}

Nginx wiki 官网介绍:http://wiki.nginx.org/NginxHttpCoreModule#server_name_in_redirect

配置文件目录是:/usr/local/nginx/conf/nginx.conf,原来的配置文件是没有server_name_in_redirect off;这句话的,需要添加,而不是修改。off是开启自动加,on是关闭自动加,注意不能聪明的以为是on。

2010年10月16日21:55:58,注:改了以后发现不是很好使,后台登陆是自动加了,但是偶的demo却不会自动加。。而且致命的是,虽然vpser那篇回复中说不影响wp的伪静态,但是偶设置的固定链接%postname%.html全部404了,于是又改了回来。 据可靠消息,目前的最新版nginx已经优化了这个问题,所以只要是最新版nginx,是不会有这个问题了。

第二种解决方案,针对WordPress,官方给的方法:http://techtitbits.com/2010/08/wordpress-permalinks-in-nginx/

编辑该域名的虚拟主机配置文件,找到location并添加try_files $uri $uri/ /index.php?q=$uri&$args;,修改后的内容如下:

location / {
	        root   /var/www/nginx-default;
	        index  index.php index.html index.htm;
	        try_files $uri $uri/ /index.php?q=$uri&$args;
	}

继续阅读~ 参与评论~

《HTML5专业开发》英文电子书完整版下载

简介来自新闻:http://www.infoq.com/cn/articles/pro-html5-programming

由Peter Lubbers、Brian Albers和Frank Salim编著的《HTML5专业开发》(Pro HTML5 Programming)一书,旨在帮助开发者们构建能够挖掘当今浏览器全部能力的HTML5应用。

该书主要涉及领域有:

  • Communication APIs:探讨构建实时和跨源(cross-origin)通讯的两大基础: 跨文档通讯(Cross Document Messaging)与XMLHttpRequest Level 2。
  • Convas API:介绍有关动态生成与渲染图形、图表、图像和动画的API。
  • Geolocation API:使用这个API,用户便可共享自己的地理位置,并在Web应用的帮助下享用位置感知的服务(location-aware services)。
  • Web Sockets API:定义了一个全双工传输的通讯通道,它在Web之上通过单个套接字进行工作。
  • Web Storage API:探讨HTML5 Web存储(也就是DOMStorage),该API令在多个Web请求间持久化数据变得简单。
  • Web Workers API:该API为Web应用提供了后台处理的能力。
  • HTML5音频与视频:这些是HTML里新添的元素,它们为开发者提供了一套通用的、集成的、脚本式的处理音频与视频的API,而无需安装任何插件。

此次提供的下载非infoq上的只有一章节,而是4.98M大小的完整版,已测,来源于:http://www.houoop.com/html5-study-pro-html-5-programming-pdf-download.html。

点击这里下载:Apress.Pro.HTML5.Programming.Sep.2010.pdf

继续阅读~ 参与评论~

IE6下非注释引起的内容复制溢出-很奇怪

IE6下有个bug,一些文字内容等会被复制并出现在其他空白的地方,我管它叫 内容复制溢出。

以前调查搜索过解决方法,原来是HTML注释引起的,所以去掉某些html注释(一个个试验,直到找到目标注释),即可解决问题。

这是以前我处理的方法,的确管用。但是今天碰到的同样类似bug,却不能通过去注释来解决了,因为我已经去掉了文档中所有的html注释,问题依旧存在。

IE6本来就是个很奇怪的东西,因此我开始怀疑此bug的真正原因会是什么呢。很遗憾,到目前为止,这篇文章说的并不是解决方法。而是分析原因,而且是不确定的原因。

回想此bug诞生的环境及条件: 1、有浮动;2、清除浮动,zoom:1;3、HTML注释。

以上就是我猜测的可能性。条件3针对本文来说可以排除了,继续寻找原因中。

环境2,目前也可以排除了,即使去掉清除浮动的css,bug还是存在。

2010年10月11日14:39:51,好吧,偶错了。原因是宽度计算错误,左右两列各自左右浮动,总宽度960,左160+右800,但是右侧内部继续分两列,由于padding,margin等,虽然偶确实保证所有宽度和是没有问题的,但是。。。有空时候,希望偶可以把bug简单还原出来。暂时结束。

2010年10月11日15:35:18,最终原因是一个隐藏的弹出层代码导致的。。。杯具,到底是个虾米机制,IE6会有这么个bug…

2010年10月14日15:23:41,弹出层里面是个老外写的文件上传组件,官方:http://github.com/valums/file-uploader,其中用到拖拽文件到上传区域自动上传的功能。。。复杂的东东,他隐含的意思难道就是:埋葬IE6?

2011年11月30日13:19:32,又一个同事碰见了这个问题,不是注释引起,不是以上所述原因,最后解决是把代码格式化了一次,bug消失。由此似乎可以推断,IE6下会发生内容克隆(复制) 溢出的根本原因在于一些特殊字符,只要能清除掉这些不可见的特殊字符,就可以解决问题。

继续阅读~ 评论(2)

目前可用的CSS3圆角属性(border-radius)详细记录

来源:http://blog.nixternal.com/2009.06.19/css-border-radius/

CSS3的圆角支持,不同浏览器有不同的css属性实现。偶个人最喜欢Opera ,它是严格按照标准css3属性实现的。

属性详单:

FireFox(火狐浏览器,FF):

/* 5px四角全部是圆角 */
-moz-border-radius: 5px;
/* 5px左上、右下角的圆角
 注: 四个值代表从左上角顺时针方向的各个角 */
-moz-border-radius: 5px 0 5px 0;
/* 5px坐下,右上角的圆角 */
-moz-border-radius: 0 5px 0 5px;
/* 5px左上圆角*/
-moz-border-radius-topleft: 5px;
/* 5px左下圆角 */
-moz-border-radius-bottomleft: 5px;
/* 5px右上圆角 */
-moz-border-radius-topright: 5px;
/* 5px右下圆角*/
-moz-border-radius-bottomright: 5px;

继续阅读~ 评论(1)

PNG图片压缩工具-PNGGauntlet

png图片(据说无损)压缩工具PNGGauntlet, 官方网站:http://benhollis.net/software/pnggauntlet/。

PNGGauntlet压缩PNG文件的软件截图

偷懒,引用自:http://witmax.cn/pnggauntlet.html,其博客还介绍了结合使用PNGGauntlet和JPEGImager的教程。

软件介绍:

PNGGauntlet是一个.NET程序,通过Ken Silverman的PNGOUT命令行工具来优化PNG文件。现在流行的图像编辑软件像Photoshop、Fireworks制作的PNG文件都不能做到容量最小的。PNGGauntlet能够去除掉PNG文件中多余的数据,而且过程不造成任何图像损伤,只是减少文件大小。你只要选择你想要优化的文件,选择输出路径,点击Optimize(优化)按钮后即可搞定压缩。PNGGauntlet同样可以用来转换JPG,GIF,TGA,PCX和BMP文件为PNG文件。

继续阅读~ 参与评论~

ToFishes系列jQuery插件 – jCuteForm美化的表单插件

jCuteForm插件,针对单选、多选、下拉框的一个替代美化插件。jCuteForm实际上是3个插件的组合,可以分别拿出来使用,它们是: jRadio, jCheckbox, jSelect。

而且不同于其他一些美化插件的工作原理,是对现有的<radio />,<select />等标签进行拆解,内容再封装,生成div模拟的方式,外观定制有些繁琐,而且比较难调控。本插件跳过这几步,依旧遵循ToFishes系列插件结构,表现,行为相分离的原则,结构自定(提供的Demo使用em,a等标签,只是需要一些class等给插件提供参考点,即使是这些class也可以自定),外观由前端人员根据结构自定预先写好,之后调用jCuteForm实现功能。

jCuteForm表单美化插件预览图

继续阅读~ 评论(5)

总结自己的前端学习经验

今天给一个同事简单讲如何去把一个psd效果图实现为一个html网页。很自然的就总结出了自己是如何过来的。

应该是水到渠成了吧。从3年多前开始由 阿捷 (可惜无缘其人)的《XHTML+CSS经典重构教程》入门,很感谢他对w3c标准的推广,以致于偶从一个dw表格布局都不熟悉,直接开始了手写XHTML+css的路程。

而js方面也是,当偶2年前知道jQuery的时候,以致于偶从一个js不熟悉的情况下,直接用jQuery实现了很棒的效果。

前端暂时应该还没有大学专业课程学习的吧。而偶的成长完全是在工作中大量实践、应用起来的。

因此,偶深深的觉得:没有不会的,只有不用的。工作是最好的学习课堂。不会很多东西没关系,只要能跟随工作的需要一步步提高就行了。

学习css和jQuery,一是《XHTML+CSS经典重构教程》+CSS手册,二是来源于网络的jQuery15天教程+jQuery手册。由此,偶另外的一个经验就是:知道如何用,知道啥能用。

继续阅读~ 参与评论~

透明背景的一点研究

偶然被同事引发的研究(他在做一个透明背景,问了偶),如何设置透明背景。貌似游戏类网站最多这种应用。

透明背景可以是纯色,也可以是背景图,偶只用纯色测试了。

大概思路:由于透明会继承到子元素,从而不能达到满意效果,故写一个冗余标签p,设置背景透明,然后将其绝对定位,并置于内容层之下,达到背景透明的目的。

继续阅读~ 参与评论~

1 2 21 22 23 24 25 26 27

全部分类
Books(4)code(7)database(6)html&css(24)java(11)JavaScript(48)jQuery(24)linux(20)python(1)React(1)share(1)soft(4)solution(53)thinking(17)vim(9)WordPress(8)前端优化(12)拓展(33)服务器(31)移动开发(4)自然(22)