Friday, February 14, 2014

Using WURFL Cloud Client with an ASP.NET Web Application

Isn’t it great if you can detect the capabilities of incoming mobile website visitors, including capabilities such as whether the device is being used to access the site is a mobile/smartphone/tablet, device/model, resolution etc. With the WURFL Cloud, you can do them all. The WURFL Cloud Client is your interface to the WURFL Device Description Repository (The Device Description Repository (DDR) is a concept proposed by the Mobile Web Initiative Device Description Working Group (DDWG) of the World Wide Web Consortium.) which contains detailed definitions for thousands of mobile devices.

WURFL Cloud Client can be used with C#.NET, Java, PHP, Python, Ruby, Node.js and Perl. In this post let’s see how we can use WURFL Cloud Client with C# using an ASP.NET Web application.

First what you have to do is create an account with WURFL Cloud. There are different plans to select from such as Free, Basic, Standard and Premium. Higher the plan is, the more capabilities you get.

Here I have created a free account and after completing the necessary steps, I am in my account now. Here in the capabilities tab, you can see the capabilities which is enabled to your account.
Picture0
My Account
Picture2
Capabilities
Since it is the Free plan, I have been given with limited capabilities.

Now let’s start with creating a ASP.NET Web Application. I am going to create an empty Web Application and I will be adding a Web Form to the page. Now I need to add reference to “ScientiaMobile.WurflCloud.dll” which you can download once you have created your account.

Now Inside the page, I will have several labels to show all the capabilities for the free plan which are model_name, brand_name, is_smartphone, is_tablet and is_wireless_device.

I have the following class which will contain some properties of devices.
public class MyDeviceInfo
{
    public String UserAgent { get; set; }
    public String ServerVersion { get; set; }
    public String Library { get; set; }
    public String DeviceId { get; set; }
    public String DateOfRequest { get; set; }
    public ResponseType Source { get; set; }
    public IDictionary<String, String> Capabilities { get; set; }
    public IDictionary<String, String> Errors { get; set; }
}
Then I have another class which contains a method to get device information. Here I will need to mention the ApiKey, you can find it in your account.
Picture1
ApiKey
public class MyWurflClient
{
    public MyDeviceInfo GetDataByRequest(HttpContextBase context)
    {
        var config = new DefaultCloudClientConfig
        {
            // Your ApiKey
            ApiKey = "ApiKey"
        };
 
        var manager = new CloudClientManager(config);
 
        var info = manager.GetDeviceInfo(context, new[] 
        {   
            "model_name",
            "brand_name", 
            "is_smartphone", 
            "is_tablet", 
            "is_wireless_device" 
        });
 
        var model = new MyDeviceInfo
        {
            DeviceId = info.Id,
            ServerVersion = info.ServerVersion,
            DateOfRequest = info.WurflLastUpdate.ToString(),
            Library = manager.GetClientVersion(),
            Capabilities = info.Capabilities,
            Errors = info.Errors,
            Source = info.ResponseOrigin
        };
 
        return model;
    }
}
Now in the page load event, I am calling the above method and showing the results in the labels.
protected void Page_Load(object sender, EventArgs e)
{
    MyWurflClient client = new MyWurflClient();
    MyDeviceInfo deviceInfo = client.GetDataByRequest(new HttpContextWrapper(HttpContext.Current));
 
    Label1.Text = "model_name : " + deviceInfo.Capabilities.First(c => c.Key == "model_name").Value;
    Label2.Text = "brand_name : " + deviceInfo.Capabilities.First(c => c.Key == "brand_name").Value;
    Label3.Text = "is_smartphone : " + deviceInfo.Capabilities.First(c => c.Key == "is_smartphone").Value;
    Label4.Text = "is_tablet : " + deviceInfo.Capabilities.First(c => c.Key == "is_tablet").Value;
    Label5.Text = "is_wireless_device : " + deviceInfo.Capabilities.First(c => c.Key == "is_wireless_device").Value;
}
Now after publishing the site, I am accessing the site from my PC.
Picture1
From PC
Now when I accessed it from my phone,
wp_ss_20140213_0002
From Phone
I have uploaded the sample to my SkyDrive. Enjoy!


Happy Coding.

Regards,
Jaliya

1 comment:

  1. System.Web.HttpBrowserCapabilities browser = Request.Browser;
    string s = "Browser Capabilities\n"
    + "Type = " + browser.Type + "\n"
    + "Name = " + browser.Browser + "\n"
    + "Version = " + browser.Version + "\n"
    + "Major Version = " + browser.MajorVersion + "\n"
    + "Minor Version = " + browser.MinorVersion + "\n"
    + "Platform = " + browser.Platform + "\n"
    + "Is Beta = " + browser.Beta + "\n"
    + "Is Crawler = " + browser.Crawler + "\n"
    + "Is AOL = " + browser.AOL + "\n"
    + "Is Win16 = " + browser.Win16 + "\n"
    + "Is Win32 = " + browser.Win32 + "\n"
    + "Supports Frames = " + browser.Frames + "\n"
    + "Supports Tables = " + browser.Tables + "\n"
    + "Supports Cookies = " + browser.Cookies + "\n"
    + "Supports VBScript = " + browser.VBScript + "\n"
    + "Supports JavaScript = " +
    browser.EcmaScriptVersion.ToString() + "\n"
    + "Supports Java Applets = " + browser.JavaApplets + "\n"
    + "Supports ActiveX Controls = " + browser.ActiveXControls
    + "\n";

    ReplyDelete