Wely's Cloud Journey

This is the second post of “how-to” establishing virtual network connection between cloud and on-premise with Windows Azure. Please check out the first post of preparing on-premise server and firewall, in my case SQL Server.

In this post, we’ll prepare the application that will be hosted on the cloud. Honestly, this would be a simple ASP.NET Web application without any fancy thing. You may skip this part if you find that you have similar sample app that can perform similar capabilities. Otherwise, you may want to follow my step below.

1. Create new Windows Azure Cloud project on your Visual Studio and select an ASP.NET Web Role into the project.

2. Open the Default.aspx file from your WebRole project and make some changes inside tag <asp:Content ID=”BodyContent” . . . /> as following:

<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <h2>
        Windows Azure Connect Demo
    </h2>
    <p>
        This is a <a href="http://www.microsoft.com/windowsazure/virtualnetwork/default.aspx">Windows Azure Connect</a>  Demo which enables us to create virtual network connection between Windows Azure cloud instances to on-premise machine.
        <br />This app is hosted on Windows Azure whereby the data was retrieved from SQL Server of Wely''s computer.
    </p>
        <h3>Customer Data</h3>
    <p>
        <asp:GridView runat="server" ID="gv" AutoGenerateColumns="False"
            DataKeyNames="CustomerID" DataSourceID="SqlDataSource1" >
            <Columns>
                <asp:BoundField DataField="CustomerID" HeaderText="CustomerID" ReadOnly="True"
                    SortExpression="CustomerID" />
                <asp:BoundField DataField="CompanyName" HeaderText="CompanyName"
                    SortExpression="CompanyName" />
                <asp:BoundField DataField="ContactName" HeaderText="ContactName"
                    SortExpression="ContactName" />
                <asp:BoundField DataField="ContactTitle" HeaderText="ContactTitle"
                    SortExpression="ContactTitle" />
            </Columns>
        </asp:GridView>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server"
            ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
            SelectCommand="SELECT TOP 10 [CustomerID], [CompanyName], [ContactName], [ContactTitle] FROM [Customers]">
        </asp:SqlDataSource>
    </p>
</asp:Content>

It’s pretty clear that the code above simple uses a gridview to display basic information of Customers’ table in Northwind database.

3. Please also make sure that your web.config file contain a NorthwindConnectionString definition, in example:

  <connectionStrings>
    <add name="NorthwindConnectionString" connectionString="Data Source=[YOUR-PC];Initial Catalog=Northwind;Persist Security Info=True;User ID=username;Password=[putyourpasswordhere]" providerName="System.Data.SqlClient" />
  </connectionStrings>

I recommend you to use your computer name on the “data source”, not (localhost), ., or 127.0.0.1 since when your app is on cloud,it definitely will interpret differently.

4. If I run my application by pressing F5,it suppose to run well if everything is successfully configured. So far, nothing fancy, very basic stuff.

5 [OPTIONAL]. I strongly aware that my machine is not a server that alive 24 hours, yet the app on the cloud will connect back to my local machine specifically my database engine. You will see an error page when my machine is not connected due to reasons such as my machine is shutdown or the internet is not connected or whatever other reasons.

To prevent un-friendly standard error message, I am going to prepare an specific error page that explaining the reason why you are seeing the reason.

Do not forget to insert an custom error page setting on your web.config and set it to the intended page.

On the next post, I’ll show you more interesting stuff especially on Windows Azure Connect. See you.

1. How to establishing virtual network connection between cloud and on-premise with Windows Azure Connect (Part 3– Activating and Enabling Windows Azure Connect) | Wely's Cloud Journey... says:

   February 26, 2012 at 1:41 pm

   [...] This is the third post of Windows Azure Connect blog post series, please check out the first post on how to set up on-premise server and the second post for preparing the application. [...]

   Reply to this Comment