Proverb Web Service: Creating the Admin Page - Part 2
Add Comment<div align="center"> <table class="outline" width="90%" border="0"> <tr> <td class="outline" width="40%"><b>Download File</b></td> <td class="outline" width="15%"><b>SDK</b></td> </tr> <tr> <td class="outline" width="40%"> <a class="wbox" href="../../file/proverbservice1.zip"> proverbservice1.zip</a> (15kb)</td> <td class="outline" width="15%">Beta2</td> <td class="outline" width="45%"> </tr> </table></div><p> <span class=wboxheado>Introduction</span><br> In continuation from the <a class="wbox" href="article.aspx?ArticleID=63&&TopicID=7">last part</a>, in this article I will construct the <b>Administration Page</b> for our Proverb Web Service. If you remember, in the last Article we built a Proverb Web Service, which supports 2 methods. One to view a random Proverb and another to add a Proverb for moderation. <br> The Administration page we build in this article will help the administrators of our web service to moderate (Accept / Reject) the Proverbs added by users to the web service.</p> <p><span class=wboxheado>Code</span></p> <p><b>1) adminpage.aspx</b> - The Proverb Web Service Administration page. I haven't made a very fancy page, you can add all the frills you want :)</p> <table width="100%" class="code"> <tr> <td width="100%"><pre><%@ Page Language="C#" debug="true" %> <%@ Import namespace="System.Data" %> <%@ Import namespace="System.Data.OleDb" %> <html> <head> <title>Proverb Web Service: Administration Page</title> <script runat=server> public void Page_Load(object sender, EventArgs e) { <span class=cmt>//If Page is loaded for first time call the BuildGrid method</span> if(!IsPostBack) BuildGrid(); } <span class=cmt>//Method to Databind the Grids</span> protected void BuildGrid() { string conString=@"Provider=Microsoft.Jet.OLEDB.4.0 ;Data Source="; conString+=Server.MapPath(".\\db\\proverb.mdb"); string sqlString ="SELECT * FROM Moderate"; <span class=cmt>//Create a OleDb DataAdapter</span> OleDbDataAdapter modAdapter= new OleDbDataAdapter(sqlString,conString); DataSet modSet = new DataSet(); <span class=cmt>//Fill the DataSet</span> modAdapter.Fill(modSet,"Moderate"); <span class=cmt>//Databind the grid </span> ModGrid.DataSource = modSet.Tables[0].DefaultView; ModGrid.DataBind(); sqlString ="SELECT * FROM Proverb"; OleDbDataAdapter proAdapter= new OleDbDataAdapter(sqlString,conString); DataSet proSet = new DataSet(); <span class=cmt>//Fill the DataSet</span> proAdapter.Fill(proSet,"Proverb"); <span class=cmt>//Databind the grid</span> ProGrid.DataSource = proSet.Tables[0].DefaultView; ProGrid.DataBind(); } <span class=cmt>//Method called when Add/Remove button is clicked in the DataGrid</span> void ModGrid_Command(Object sender, DataGridCommandEventArgs e) { <span class=cmt>//Get the Proverb from the 4th cell in the table //Since array's are zero indexed we get the value at index 3!</span> TableCell proCell = e.Item.Cells[3]; string proVerb = proCell.Text; <span class=cmt>//Get the ID from the 3rd Cell</span> TableCell itemCell = e.Item.Cells[2]; string item = itemCell.Text; <span class=cmt>//Check if Accept Button was pressed</span> if (((Button)e.CommandSource).CommandName == "Accept") { <span class=cmt>//Insert the proverb into the 'Proverb' table</span> string conString=@"Provider=Microsoft.Jet.OLEDB.4.0 ;Data Source="; conString+=Server.MapPath(".\\db\\proverb.mdb"); string sqlString ="INSERT INTO proverb (Content) VALUES ('"+proVerb+"')"; OleDbConnection proCon = new OleDbConnection(conString); OleDbCommand proCommand = new OleDbCommand(sqlString,proCon); proCon.Open(); proCommand.ExecuteNonQuery(); proCon.Close(); <span class=cmt>//Delete the proverb from 'Moderate' table</span> sqlString = "DELETE FROM moderate WHERE ID="+item ; proCommand.CommandText=sqlString; proCon.Open(); proCommand.ExecuteNonQuery(); proCon.Close(); <span class=cmt>//Rebuild the grids </span> BuildGrid(); } else if(((Button)e.CommandSource).CommandName == "Reject") { <span class=cmt>//Delete the proverb from the 'Moderate' table</span> string conString=@"Provider=Microsoft.Jet.OLEDB.4.0 ;Data Source="; conString+=Server.MapPath(".\\db\\proverb.mdb"); string sqlString = "DELETE FROM moderate WHERE ID="+item ; OleDbConnection proCon = new OleDbConnection(conString); OleDbCommand proCommand = new OleDbCommand(sqlString,proCon); proCon.Open(); proCommand.ExecuteNonQuery(); proCon.Close(); <span class=cmt>//Rebuild the grids</span> BuildGrid(); } } <span class=cmt>//Method to add a new Proverb</span> protected void InsertNew(object sender, EventArgs e) { <span class=cmt>//Insert a new proverb into the 'Proverb' table</span> string conString=@"Provider=Microsoft.Jet.OLEDB.4.0 ;Data Source="; conString+=Server.MapPath(".\\db\\proverb.mdb"); string sqlString ="INSERT INTO proverb (Content) VALUES ('"+proText.Text+"')"; OleDbConnection proCon = new OleDbConnection(conString); OleDbCommand proCommand = new OleDbCommand(sqlString,proCon); proCon.Open(); proCommand.ExecuteNonQuery(); proCon.Close(); <span class=cmt>//Clear the TextBox</span> proText.Text=""; <span class=cmt>//Rebuild the grids</span> BuildGrid(); } </script> </head> <body> <form runat="Server" > <div align="Center"> <h2>Proverb Web Service: Administration Page</h2> Add a Proverb <table border="1"> <tr><td>Proverb</td><td><asp:TextBox id="proText" runat="Server" /> <asp:RequiredFieldValidator ControlToValidate="proText" runat="server">*</asp:RequiredFieldValidator></td></tr> <tr><td colspan=2> <asp:Button id="AddNew" OnClick="InsertNew" text="Add New" runat="server" /></td></tr> </table> <br> Moderation Table <asp:DataGrid id="ModGrid" BorderColor="black" BorderWidth="1" CellPadding="3" AutoGenerateColumns="false" OnItemCommand="ModGrid_Command" runat="server"> <HeaderStyle BackColor="#00aaaa"> </HeaderStyle> <Columns> <asp:ButtonColumn HeaderText="Accept" ButtonType="PushButton" Text="Add" CommandName="Accept" /> <asp:ButtonColumn HeaderText="Reject" ButtonType="PushButton" Text="Remove" CommandName="Reject" /> <asp:BoundColumn HeaderText="Id" DataField="ID"/> <asp:BoundColumn HeaderText="Proverbs" DataField="Content"/> <asp:BoundColumn HeaderText="Date" DataField="Dt"/> </Columns> </asp:DataGrid> <br> Active Table <asp:Datagrid id=ProGrid BorderColor="black" BorderWidth="1" CellPadding="3" runat="Server" > <HeaderStyle BackColor="#00aaaa"> </HeaderStyle> </asp:Datagrid> Copyright <a href="http://www.mastercsharp.com">www.MasterCSharp.com</a> all rights are reserved. </div> </form> </body> </html></pre></td> </tr> </table> <p>Save this file as <b>adminpage.aspx</b> and you have the administration page ready!! Now copy this page into the '<b>ProverbService</b>' virtual directory you might have created in the last article. If you have hosted the Proverb Web Service in some other Virtual Directory, then copy this file into that directory. But remember, it has to be a Virtual Directory that hosts the Web Application.</p> <p><span class=wboxheado>Securing the Admin Page</span><br> Many of you might have got the hint that the page we have just created above is publicly accessible and totally beats it purpose. So we have to take some steps to restrict access to the page. There are many ways to do that, but for the sake of this example I will choose one of the easiest and that is <b>Form (Cookie) based authentication</b> provided by ASP.NET.</p> <p><span class=wboxhead>Step 1: Login Page - login.aspx</span><br> Since we are using Form Based Authentication for our application, we need to create another page that will redirect all unauthorized to a page to login.<br> <b>2) login.aspx</b> - The login page.</p> <table border="0" style="border-collapse: collapse" bordercolor="#111111" width="100%" class="code"> <tr> <td width="100%"><pre><%@ Page language=C# %> <%@ Import Namespace="System.Web.Security " %> <html> <script language="C#" runat=server> void Login_Click(Object sender, EventArgs E) { <span class=cmt>//Check if the Email and Password values correspond. //I have hard-coded the values... you can implement your own logic </span> if ((UserEmail.Value == "admin@mastercsharp.com") && (UserPass.Value == "abcd1234")) { <span class=cmt>//If credentials are proper, Authenticate the use and set the cookie</span> FormsAuthentication.RedirectFromLoginPage(UserEmail.Value, PersistCookie.Checked); } else { Msg.Text = "Invalid Credentials: Please try again"; } } </script> <body> <form runat=server> <h3><font face="Verdana">Login Page</font></h3> <table> <tr> <td>Email:</td> <td><input id="UserEmail" type="text" runat=server/></td> <td><ASP:RequiredFieldValidator ControlToValidate="UserEmail" Display="Static" ErrorMessage="*" runat=server/></td> </tr> <tr> <td>Password:</td> <td><input id="UserPass" type=password runat=server/></td> <td><ASP:RequiredFieldValidator ControlToValidate="UserPass" Display="Static" ErrorMessage="*" runat=server/></td> </tr> <tr> <td>Persistent Cookie:</td> <td><ASP:CheckBox id=PersistCookie runat="server" /></td> <td></td> </tr> </table> <asp:button text="Login" OnClick="Login_Click" runat=server/> <br> <asp:Label id="Msg" ForeColor="red" Font-Name="Verdana" Font-Size="10" runat=server /> </form> </body> </html></pre></td> </tr> </table> <p>As you can see above, the login page is very simple. I have hard-coded the values for e-mail and password but for a real world solution you can implement a database checking. Save this page as login.aspx and copy it into the same 'ProverbService' Virtual Directory.<p><span class=wboxhead>Step 2: Application Configuration - Web.Config</span><br> As the final step to secure the admin page, we have to inform the ASP.NET runtime to secure the AdminPage.aspx file and only allow authenticated users to view the page. The ASP.NET pick's up these settings from the Xml formatted <b>Web.Config</b> file. For more information on the Web.Config file see the ASP.NET Documentation. I would just add that there can only be one Web.Config per Web Application hosted in a Virtual Directory. Again, please note that your application has to reside in a Virtual Directory (not a normal directory) or you will start getting weird errors!<br> Explaining the different sections of this file will take up a series of articles on its own, you can look into the <b>ASP.NET Quick Start</b> for more information.<p> <table border="0" style="border-collapse: collapse" bordercolor="#111111" width="100%" class="code"> <tr> <td width="100%"><pre><configuration> <system.web> <authentication mode="Forms"> <forms name="ProverbService" loginUrl="login.aspx" protection="All" path="/" /> </authentication> </system.web> <location path="adminpage.aspx"> <system.web> <authorization> <deny users="?" /> </authorization> </system.web> </location> </configuration></pre></td> </tr> </table> <p>Save this file as Web.Config and place it into the 'ProverbService' Virtual Directory. Once that's done, your page is secure!<p><span class=wboxheado>Calling the Page</span><br> Once you have setup everything, its testing time!! Fire up your favorite browser and enter the url to the Admin Page i.e. http://localhost/provebservice/adminpage.aspx . Your browser should automatically redirect you to 'login.aspx' page to enter your credentials. If you enter the proper credentials you will be re-directed back to this page, automatically!!<p><span class=wboxheado>Conclusion</span><br> In this part of the Proverb Web Service, we learnt how to build the admin page for our service, as well as we learned how to secure the page using ASP.NET Form based authentication. With this, we finish the server deployment of our web service, next article onwards we will see how to build various Clients for our Web Service.