Debugging ASP.NET HTML5/Flash Upload Scripts

Error Logging

This strategy implies enclosing the part of the upload script which saves files in try/catch block and writing exception details to an external log file. The code sample below implements the LogError(String,String) method to create a current date log file in the /Logs folder of an application and write error message and stack trace to this log file.

private void LogError(string errorMessage, string stackTrace)
{
    string logPath = Server.MapPath("~/Logs/" + DateTime.Today.ToString("MM-dd-yy") + ".log");
    if (!System.IO.File.Exists(logPath))
        System.IO.File.Create(logPath).Close();

	using (System.IO.StreamWriter w = System.IO.File.AppendText(logPath))
    {
        w.WriteLine("{0} Error: {1}",
            DateTime.Now.ToString(System.Globalization.CultureInfo.InvariantCulture),
            errorMessage);
        w.WriteLine(stackTrace);
        w.Flush();
        w.Close();
    }
}

protected void AllFilesUploaded(object sender, Aurigma.ImageUploaderFlash.AllFilesUploadedEventArgs e)
{
    try
    {
        SaveFiles(e);
	}
    catch (Exception ex)
    {
        LogError(ex.Message, ex.StackTrace);
    }
}

private void SaveFiles(Aurigma.ImageUploaderFlash.AllFilesUploadedEventArgs e)
{
    // ...
    // Saving uploaded files
    // ...
}

This method writes error details in the following way:

10/18/2010 15:52:11 Error: Object reference not set to an instance of an object.
	at _Default.SaveFiles(AllFilesUploadedEventArgs e) in c:\inetpub\wwwroot\Uploader\ErrorLogging\upload.aspx:line 66
	at _Default.AllFilesUploaded(Object sender, AllFilesUploadedEventArgs e) in c:\inetpub\wwwroot\Uploader\ErrorLogging\upload.aspx:line 51

You may need to slightly modify the code above to use the described approach with other methods of Saving Uploaded Files in HTML5/Flash Uploader ASP.NET.

Handling Error Event

If you are not familiar with the client events in HTML5/Flash Uploader, please, read the Using HTML5/Flash Uploader at Runtime topic first.

HTML5/Flash Uploader exposes the Error event which fires when a server or client-side error occurs. Error type is defined by the errorCode argument of this event, and in the case of server-side error it is equal to 4. The full list of error codes can be found in Error event parameters. Detailed description of an occurred error is available through the errorPage which represents the web page returned from the server.

The following example shows how to display error details if a server-side error occurs.

<script type="text/javascript">
function errorHandler(errorCode, httpResponseCode, errorPage, additionalInfo){
	if (errorCode == 4) {
		var newWindow = window.open();
		with (newWindow.document) {
			open("text/html");
			write(errorPage);
			close();
		}
	}
}
</script>

<aur:ImageUploaderFlash ID="Uploader1" runat="server">
	<ClientEvents>
		<aur:ClientEvent EventName ="Error" HandlerName="errorHandler" />
	</ClientEvents>
</aur:ImageUploaderFlash>	

Using Sniffer

Sniffer is a network analyzer software which allows to track interactions between client-side and server-side parts of an application. Here we consider the Fiddler tool as an example of debugging server-side upload script.

1. Open default.aspx in your browser. If it is able to send traffic to Fiddler, the corresponded session will be displayed in the Web Sessions pane of the tool.
2. Send a file via HTML5/Flash Uploader.

3. Double-click the upload.aspx session in the Web Sessions pane.

   

   Find upload session details in the left part of Fiddler's interface. Here it contains the POST request sent by HTML5/Flash Uploader and the response returned by your upload script. If your upload script contains an error this error details will be displayed in the returned response.

Running Script in Debug Mode

Microsoft Visual Studio allows debugging ASP.NET Web applications in the same manner as Windows Forms. See the Debugging ASP.NET Web Applications During Development and Debugging Deployed ASP.NET Web Applications MSDN topics for step-by-step instructions on how to debug ASP.NET Web applications.

See Also

Reference

• Error Event
• UploadSettings.ActionUrl Property

Manual

• Saving Uploaded Files in HTML5/Flash Uploader ASP.NET
• Configuring HTML5/Flash Uploader ASP.NET
• Basic Steps in Troubleshooting of HTML5/Flash Uploader
• Using HTML5/Flash Uploader at Runtime

Other Resources

• Fiddler
• Debugging ASP.NET Web Applications During Development
• Debugging Deployed ASP.NET Web Applications