Friday, May 8, 2009

Sending Emails from .Net using Google's SMTP servers

The .Net framework has a few classes to handle mail.
The System.Net.Mail namespace will let you send an email message via the SMTP server configured in your web.config file or app.config file.
This works very well for many providers - but if you are using Gmail or google apps things get a little sticky since the only way to connect to the SMTP servers is using SSL which is not supported by system.net.mail.
I found a workaround this problem using an open source component called stunnel - stunnel allows you to create SSL tunnels to communicate with specific addresses and ports.
The way this would work is this:
1. we will tell our program to send email using SMTP to a non standard port (say 8025 instead of 25).
2. We will tell STunnel to listen on this port and forward all the traffic through an SSL tunnel to Google's SMTP server.

So here are the step by step directions:
1. Download the Stunnel installer from Stunnel.Org - http://www.stunnel.org/ - install this on your server
2. go to the the install directory for stunnel and change the stunnel.conf file to look like:

cert = stunnel.pem
socket = l:TCP_NODELAY=1
socket = r:TCP_NODELAY=1
;debug = 7

output = stunnel.log
; Use it for client mode
client = yes
[GmailSMTP]
accept = XXX.XXX.XXX.XXX:8025
connect = smtp.gmail.com:465

You will need to replace XXX.XXX.XXX.XXX with the IP address for the server you are running on - do not use localhost or 127.0.0.1 - they failed for me.
3. From the start menu do - stunnel service install and then stunnel servic start (you can change the start mode for the service to automatic also).
4. You can test your work - so far - open a command prompt window and type the following:
Telnet XXX.XXX.XXX.XXX:8025 (where XXX.XXX.XXX.XXX is the address above).
If everything works well you should see something like:
220 mx.google.com ESMTP q18sm6397127pog.5
Close the window.
5. In your application edit the System.Net configuration section of web.config or app.config as follows:
<system.net>
<mailsettings>
<smtp from="name@domain.com" >
<network host="XXX.XXX.XXX.XXX"
port="8025"
password="YOUR PASSWORD" userName="name@domain.com">
</smtp>
</mailsettings>
</system.net>

That should do it.

The inspiration for this was an article I read here:
http://quack.me/2007/02/gmail_via_pop3_on_exchange.php

Friday, February 13, 2009

Disable user interface during ajax postbacks on ASP.Net

One of the biggest issues I have with public facing websites I work on is double clicks on buttons or users interrupting the postback process. This happens a lot with the payment button of credit card transactions and other time consuming postbacks.
I have done some Javascript and CSS tweaks and tricks to handle specific controls and I was unable to get something I was truely happy with.
Until I met jQuery. jQuery is a javascript library that does a whole bunch of things, introduces shortend syntax and a pluggable API. It can be downloaded at http://jquery.com/.
Coupling JQuery with a plugin called BlockUI. Can be downloaded at http://malsup.com/jquery/block/
What I came out with is a fairly generic solution for ASP.Net that handles all the ajax postbacks for a specific page or website by wiring the application_beginRequest and application_endRequest on the client side.
So here is the recipe:
Ingrediants -
1. ASP.Net 3.5 website
2. An aspx webpage
3. A script manager with a reference to:






  1. The JQeury library



  2. Block UI plugin



  3. A very short Javascipt file (enclosed below)



4. An update panel




Instructions:




1. Create your website - I use Visual Studio 2008




2. Add your page or your master page




3. Create a js directory and add the downloaded scripts from jQuery and JBlockUI




4. Add a new file to the js directory called wireRequestEvents.js




with the following code:





Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler);





Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
function BeginRequestHandler(sender, args)
{
$.blockUI();
}
function EndRequestHandler(sender, args)
{
$.unblockUI();
}




5. Drop a script manager in your page with the following syntax:














6. Add your update panels with contect templates and you are good to go.


To demonstrate the technique I created a simple page with a button and a label inside an update panel. Once clicked the button waits 4 seconds and then changes the label. This imulates a long transaction on the server.




Here is what the users will see:





After they click the button the UI is blocked by a semi transperant div





When the request returns the users will see the updated screen




Pretty simple!

The code for this is available at http://www.simplicityc.com/files/JQuerySample.zip