Content
OVERVIEW................................................................................................................................................. 4
Key Technologies..................................................................................................................................... 4
SETUP AND CONFIGURATION................................................................................................................. 6
Software Requirements........................................................................................................................... 6
TOOLKIT CONTENT................................................................................................................................... 7
Windows Phone Cloud Application Project Templates.............................................................................7
Samples and Libraries Source Code....................................................................................................... 8
BabelCam Sample................................................................................................................................... 8
Overview
The Windows Azure Toolkit for Windows Phone is designed to make it easier for you to
build mobile applications that leverage cloud services running in Windows Azure. The
toolkit includes Visual Studio project templates for Windows Phone and Windows Azure,
class libraries optimized for use on Windows Phone, sample applications, and
documentation. All this content is designed to be easily reused, simplifying your
experience and optimizing your time when building your own mobile applications
leveraging cloud services.
The toolkit includes membership services to provide authentication and authorization for
your phone applications. You can choose between two different access control
strategies: the toolkit can generate and include in your application a classic ASP.NET
membership store, or it can outsource authentication to the Windows Azure Access
Control Service (ACS). The latter enables your users to register and log in by reusing
their existing accounts from identity providers such as Windows Live ID, Google, Yahoo
and possibly from their Active Directory or Facebook.
Windows Azure
Windows Azure is a cloud-computing platform that lets you run applications and store
data in the cloud. Instead of having to worry about building out the underlying
infrastructure and managing the operating system, you can simply build your application
and deploy it to Windows Azure. Windows Azure provides developers with on-demand
compute, storage, networking, and content delivery capabilities.
Make sure to review the Change Log section to check the toolkit modifications from the
v1.3.1 release.
Key Technologies
The Windows Azure Toolkit for Windows Phone uses the following technologies:
1
ASP.NET MVC 3
Next Step
Setup and Configuration
Next Step
Toolkit Content
Toolkit Content
Windows Phone Cloud Application Project Templates
This toolkit contains the following two project templates for C#:
Windows Phone Cloud Application: This template makes it easier for developers to
create a Windows Phone application that relies on Windows Azure. This template
generates a Windows Azure project, an ASP.NET MVC 3 project (configured as a Web
Role), and a Windows Phone application project. All these projects working together
show how you can interact with Windows Azure Storage without needing to include the
storage account information (name and key) in the phone application, thus making it
more secure to distribute.
Windows Phone Empty Cloud Application: The same as the Windows Phone Cloud
Application template, but instead of creating a sample Windows Phone application to
highlight the toolkit services, it creates a default Windows Phone application project
with minimum settings and dependencies.
Note: Take into account that the content of each of the previous project
templates varies according to the Visual Studio edition for which it is targeted.
For more information, see the Visual Studio Supported Versions section.
Project Type
Windows Azure
Supported
Not Supported
Supported
Supported
Supported
Not Supported
ASP.NET MVC 3
Supported
Not Supported
Supported
Note: For more details about the project types supported in the Visual Studio
Express editions, check the following table:
http://www.microsoft.com/visualstudio/en-us/products/2010-editions/productcomparison#expressCompareTable.
If you are running the toolkit with the Visual Studio Express editions (Visual Web
Developer 2010 Express and Visual Studio 2010 Express for Windows Phone), one
project template will be installed for each of them. The template for Visual Web
Developer 2010 Express creates a Windows Azure project and its corresponding ASP.NET
MVC 3 Web Role that provides services to work with data in the Windows Azure Storage.
On the other hand, the project template for Visual Studio 2010 Express for Windows
Phone creates a Windows Phone sample client application that consumes those services
and lets users interact with Windows Azure Storage data.
Samples and Libraries Source Code
If you browse to the Samples\WP7.1 folder, you will find the following folders:
BabelCam: The source code for the BabelCam sample.
TweetYourBlobs: The source code for the Tweet Your Blobs sample.
CRUDSqlAzure: The source code for the CRUD SQL Azure sample.
ProjectTemplates: The source code for the Project Templates samples.
Libraries: The source code for the libraries included in the toolkit.
Note: You can find in the Samples\WP7.0 folder the source code of the legacy
samples and libraries targeting Windows Phone OS 7.0. The source code in them is
updated up to the v1.3.0 toolkit release (August 30th, 2011). This means that none of
the new features, updates, bug fixes and changes made to the toolkit afterwards are
available in these samples.
BabelCam Sample
The BabelCam sample application is based on a similar solution structure as the
Windows Phone Cloud Application project templates.
The application allows users to take a picture of a text, upload it to a Windows Azure
Blob and send a message to a Windows Azure Worker role using a Windows Azure
Queue.
The Worker role, in turn, invokes Microsoft Research Project Hawaii OCR in the
Cloud Service to recognize the text, and then, translates it to another language of the
users choice by using the Bing Translator Service. Finally, it sends a push notification
message of the resulting text back to the phone.
If you browse to the Samples\WP7.1\BabelCam folder, you will find three different
solution files:
BabelCam.sln: This solution only works with Visual Studio 2010 Professional (or
higher) and contains all the projects.
BabelCam.Phone.sln: This solution works with Visual Studio 2010 Express for
Windows Phone and only contains the phone projects:
BabelCam.Phone
Microsoft.Samples.Data.Services.Client
SL.Phone.Federation
WindowsPhoneCloud.StorageClient
BabelCam.Azure.sln: This solution works with Visual Web Developer 2010 Express
and only contains the Azure and Web projects:
AspProviders
BabelCam
BabelCam.Infrastructure
BabelCam.Web
BabelCam.Worker
DPE.OAuth
Hawaii.Services.Client
Hawaii.Services.Client.Ocr
WindowsPhone.Recipes.Push.Messages
10 In order to use Microsoft Research Project Hawaii services, you must accept
their EULA. Review the document and enter y to continue.
11 Obtain your ACS namespace and its management key. To do this, you can
follow the instructions in Appendix II: How to Obtain Namespace and
Management Keys?
12 If you have not created an ACS namespace, you can try out the sample without
creating one. Just press ENTER when asked for your ACS namespace and
service key and the sample will use the fully pre-configured sample
https://watwindowsphone.accesscontrol.windows.net/ ACS namespace.
13 Enter your Windows Azure Access Control service namespace and the
symmetric key you obtained in the first step.
Note: You can get more information about configuring Relying Party Applications
in the ACS Management Portal on the following article:
http://msdn.microsoft.com/en-us/library/gg185906.aspx.
16 Obtain your Bing Translator Application Id. To do this, you can follow the
instructions in Appendix VI: How to obtain a Bing Application Id?
17 Enter your Bing Translator Application Id and press ENTER.
18 Obtain your Microsoft Research Project Hawaii OCR in the Cloud Service
Application Id. To do this, you can follow the instructions in Appendix V: How to
obtain a Project Hawaii Application ID?
19 Enter your Microsoft Research Project Hawaii OCR in the Cloud Service
Application Id and press ENTER.
TweetYourBlobs.Phone
Microsoft.Samples.Data.Services.Client
WindowsPhoneCloud.StorageClient
TweetYourBlobs
TweetYourBlobs.Web
CRUDSqlAzure.Phone
SL.Phone.Federation
Microsoft.Samples.Data.Services.Client
WindowsPhoneCloud.StorageClient
CRUDSqlAzure
CRUDSqlAzure.Web
DPE.OAuth
Note: You can get more information about configuring Relying Party Applications
in the ACS Management Portal on the following article:
http://msdn.microsoft.com/en-us/library/gg185906.aspx.
30 Obtain your SQL Azure server name, username and password. To do this, you
can follow the instructions in Appendix IV: How to Create a SQL Azure Database
Server?
31 To use a local SQL Server Database, choose 1, enter your SQL Server instance
name and the name for the database you wish to use:
Note: If you use the name of an existing database, it will be dropped and
recreated with the schema needed for this sample. Do not use a database that
already exists if you need the data in that database.
32 To use a SQL Azure database, choose 2 and enter your SQL Azure server name,
username, password and the name for the database you wish to use:
Note: If you use the name of an existing database, it will be dropped and
recreated with the schema needed for this sample. Do not use a database that
already exists if you need the data in that database.
Microsoft.Samples.Data.Services.Client
WindowsPhoneCloud.StorageClient
WindowsPhoneCloud.Phone
WindowsPhone.Recipes.Push.Messages
WindowsPhoneCloud
WindowsPhoneCloud.Web
Before running the project template samples, you will need to update either your SQL
Azure Database or your Windows Azure Access Control Service Namespace information
in the configuration files. To do this, perform the following steps:
33 Double-click the SetupSample.cmd file located inside the
Samples\WP7.1\ProjectTemplates\{SampleName} folder to launch a tool
that will help you in the process of configuring the sample.
34 If you are using WPCloud.ACS or WPCloud.SQL.ACS samples, see the next
step. Otherwise, skip to step 7.
35 Obtain your ACS namespace and its management key. To do this, you can
follow the instructions in Appendix II: How to Obtain Namespace and
Management Keys?
36 If you have not created an ACS namespace, you can try out the sample without
creating one. Just press ENTER when asked for your ACS namespace and
service key and the sample will use the fully pre-configured sample
https://watwindowsphone.accesscontrol.windows.net/ ACS namespace.
37 Enter your Windows Azure Access Control service namespace and the
symmetric key you obtained in the first step.
Note: You can get more information about configuring Relying Party Applications
in the ACS Management Portal on the following article:
http://msdn.microsoft.com/en-us/library/gg185906.aspx.
40 Obtain your SQL Azure server name, username and password. To do this, you
can follow the instructions in Appendix IV: How to Create a SQL Azure Database
Server?
41 To use a local SQL Server Database, choose 1 and enter your SQL Server
instance name:
42 To use a SQL Azure Database, choose 2 and enter your SQL Azure Server name,
username and password:
Libraries
Inside the Samples\WP7.1\Libraries folder you will also find the source code of all the
libraries included in this toolkit:
Next Step
Getting Started
Getting Started
This section describes how to create a new Windows Phone Cloud Application using
the project template included in this toolkit. It also goes through the solution generated
and the steps required to explore it and run it.
Creating a New Windows Phone Cloud Application
After installing the VSIX extension as explained in the Setup and Configuration section,
perform these steps:
43 Open Visual Studio 2010 as administrator (this is required to run Windows
Azure projects).
44 In the File menu point to New and then click Project.
45 In the Installed Templates list on the left of the New Project dialog, select
Cloud under the Visual C# node, select the Windows Phone Cloud
Application template, enter the Name and Location of the solution, and then
click OK.
46 In the New Windows Phone Cloud Application Project dialog, select which
storage options you wish to use. You must select at least one of the Windows
Azure Storage or SQL Azure Database options.
Note: Windows Azure Storage is the project templates default choice to
store the Membership providers information and other infrastructure data. In
case SQL Azure Database is the only storage choice selected, this information
will instead be stored on a SQL Azure database.
Note: The last storage option about connecting to an OData Service is not
currently supported. It will become available in future releases of the toolkit.
50 If the SQL Azure Database option was selected, you need to provide your SQL
Azure database Server information (server name, user and password).
In case you want to use a local SQL Server instance instead of a SQL Azure Database,
then check Use local SQL Server instance, and select which instance of SQL
Server you wish to use from the list.
If the Apple Push Notification Service (APNS) support option is checked, a dialog
window appears showing a list of the certificates installed in your local machine.
Select the certificate to use as the APNS certificate identity and click OK.
Note: To create and install the Apple Push Notification certificate for a specific
iOS application, you first need to register within the iOS Developer Program and
get an SSL certificate from the iPhone Provisioning Portal. For more information,
you can check the Provisioning and Development article in the iOS Developer
Library.
Note: The Android Push Notification Service is not currently supported. It will
become available in future releases of the toolkit.
Note: For additional help on how to choose the authentication mechanism most
suitable for your application, check Appendix I: How to Choose Between ASP.NET
Membership and ACS?
If the Windows Azure Access Control Service (ACS) option is selected, you need to
provide the Namespace and Management key of your ACS service. For instructions
on how to obtain your own Windows Azure Access Control Service namespace and
management key, see Appendix II: How to Obtain Namespace and Management
Keys?
Note: If ACS authentication is selected, the template will perform the following
configuration steps in your ACS namespace:
- Add the following identity providers: Windows Live ID, Google and Yahoo.
- Add the new application as a Relying Party Application.
- Define a default set of claim transformation rules (needed for the application).
55 Click OK and wait until Visual Studio finishes creating the projects.
56 Explore the solution generated. You should see the following projects:
a
57 Additionally, the project template also creates a Libs folder containing the
following assemblies:
d AspProviders.dll: ASP.NET Providers for Windows Azure Tables
(Membership, Roles, Profile and Session State Store).
e
59 Make sure that the target for Silverlight for Windows Phone projects is set to
Windows Phone Emulator.
Password:
(with a zero)
are some differences between ASP.NET Membership and ACS regarding the
authentication flow.
65 In the log in page, click the Install certificate link. This will open Internet
Explorer in the Windows Phone Emulator at
http://127.0.0.1:10080/127.0.0.1.cer.
Note: In order to consume the REST services over HTTPS in a Windows Phone
device or in the Windows Phone Emulator, you need to use a trusted SSL
certificate. If you do not have one, you can use a self-signed certificate, but you
need to install it in the phone before consuming the services.
Since the Computer Emulator always uses the 127.0.0.1 self-signed certificate,
we need to install it in the Windows Phone Emulator before continuing with the
next steps.
66 Click the shield icon to install the Windows Azure Compute Emulators SSL
certificate in the Windows Phone Emulator. Finally, click install to confirm that
you want to install the certificate.
Important: If you leave the Windows Phone Emulator open, you do not need to
install the certificate every time that you run the application. However, if you
close the Windows Phone Emulator, you will have to install it again.
67 Once the certificate is installed, click ok and navigate back to the running
application using the left arrow ( ).
Note: The Windows Phone Emulator supports mapping of the keyboard on your
development computer to the hardware keyboard on a Windows Phone (by
default is not enabled). To enable the keyboard in the Windows Phone Emulator
press the PAGE UP or PAUSE/BREAK key. To disable it, press the PAGE DOWN
or PAUSE/BREAK key. For more information, see the following article:
http://msdn.microsoft.com/library/ff754352(VS.92).aspx.
70 Back in the log in page, enter the credentials of the user you have previously
created and then click log in. If the log in is successful, you will be redirected
to the main pivot page.
Note: In case you want to log in with different credentials, you need to log out
by clicking the log out button ( ) in the phone application bar, which will
redirect you to the log in page.
Note: These steps only apply if you selected the ACS authentication mechanism
when the application was created.
71 In the log in page, a list with the configured identity providers is shown. Select
the identity provider you want to authenticate with and log in providing your
account information.
Note: Windows Live ID, Google and Yahoo identity providers are automatically
configured into your ACS namespace when the application is created from the
Windows Phone Cloud Application project template.
72 If this is the first time you logged into the application, you will be redirected to
the register page. Enter a name and an email address for the user, and then
click register. Wait for the registration to complete. If the registration was
successful, you will see the Registration Successful message. Click ok and
you will be redirected back to the log in page.
Note: The Windows Phone Emulator supports mapping of the keyboard on your
development computer to the hardware keyboard on a Windows Phone (by
default is not enabled). To enable the keyboard in the Windows Phone Emulator
press the PAGE UP or PAUSE/BREAK key. To disable it, press the PAGE DOWN
or PAUSE/BREAK key. For more information, see the following article:
http://msdn.microsoft.com/library/ff754352(VS.92).aspx.
Note: In case you want to log in with different credentials, you need to log out
by clicking the log out button ( ) in the phone application bar, which will
redirect you to the log in page.
74 Check the Enable push notifications option and wait until you see a
message saying that the notification updates were received.
Note: When the user enables push notifications, the application is registered
with Microsoft Push Notification Service (MPNS) and the sample notification
service included in this toolkit. After doing that, the application then downloads
the queued messages for that Windows Phone device if there is any available.
For more information about MPNS, you can read the Understanding Microsoft
Push Notifications for Windows Phones and Understanding How Microsoft Push
Notification Works Part 2 articles.
75 Switch to the Web browser showing the Mobile Cloud Application Services Web
site. Click the Log On link in the top-right corner.
76 To log into the Web application use the following credentials:
Password:
(with a zero)
77 Once logged in, additional menu options will be shown to manage user
permissions to tables, blobs and queues, and to send push notifications.
Note: The menu items displayed in the Mobile Cloud Application Services Web
site may differ depending on the option you selected in the template wizard
steps. For example, if you selected SQL Azure Database as the only data
provider, you will not see the Tables and Queue menu items.
78 Click the Microsoft Push Notifications menu option, type raw message in
the textbox for the user you have just created and click Send Raw. You will see
a success message.
79 Now, type tile message in the textbox and click Send Tile. You will see an
error message saying that the notification was not received by the Windows
Phone device.
Note: In order to receive tile notifications you first need to pin the application to
the Windows Phone Start menu.
80 Switch back to the Windows Phone Emulator. You will see the raw notification
message displayed in the Messages list.
82 Switch to the Web browser and click Send Tile to send the 'tile message'
notification again. You will now see a success message.
83 Now, type toast message in the textbox and click Send Toast. You will see
another success message.
84 Switch back to the Windows Phone Emulator. You will see that the WAT
Windows Phone icon now displays a number (in this case 1) and there is a
toast notification available too. Click on the toast notification or the icon to
open the WAT Windows Phone application. In the notifications page, you
will see that both messages ('tile message' and 'toast message') are
displayed in the Messages list.
Note: You were not redirected to the log in page because the authentication
token that you had received the first time you logged in, is stored by default in
the Isolated Storage.
Note: The menu items displayed in the Mobile Cloud Application Services Web
site may differ depending on the option you selected in the template wizard
steps. For example, if you selected SQL Azure Database as the only data
provider, you will not see the Tables and Queue menu items.
Note: The push notifications can only be sent to the iPhone, iPad, and iPod touch
devices running the iOS application associated to the APNS certificate that was
configured when creating the Windows Phone Cloud Application.
89 Flick or pan to the left to navigate to the sample data pivot item. You will see
the rows available in the SampleData table. If this table does not exist in your
Windows Azure Tables storage, it is first created.
90 In the sample data pivot item click the plus button ( ) in the application bar
to add a new row. You can also click over each of the existing rows to edit or
delete them.
91 Flick or pan to the left to navigate to the list blobs pivot item and click the
camera button ( ) in the application bar. The phones camera will be open.
Click the button in the top-right corner of the screen to take a photo and then
click accept. This will redirect you to the upload picture page.
92 In the upload picture page, type the name of the container where you want
to upload your picture. Notice that the autocomplete list of available containers
is filtered while you type. If you type a container name that does not exist in
the storage, it will be created. Additionally, if you check the Make container
public option, the Container ACL will be changed to full public read
access.
93 Type a name for the blob. Additionally, check the Include location data and
Include author data options if want to include the GPS location and the user
ID values as blob metadata. Finally, click upload. If everything worked as
expected, you will see a message box saying that the image was successfully
uploaded. Click ok to navigate back to the main pivot page.
94 Back in the list blobs pivot item, chose the container where have just upload
the picture in the previous step, and then click list blobs (notice that you can
also filter the blob name by choosing a prefix).
95 Wait until the blob list finishes loading. You should see a thumbnail of the
picture you have previously uploaded along with a link to the blob. If you click
the link, it will open Internet Explorer in the phone displaying the picture.
Additionally, you can click the delete button (
delete one.
).
97 Flick or pan to the left to navigate to the queues pivot item and click list
queues to see the list of available queues in your Windows Azure storage.
Notice that you can also filter the queues using a prefix.
add a new queue (notice that you can click the delete button (
queues name to delete it).
) next to the
99 Click the name of the queue you have just created in the previous step to
navigate to the queue details page.
100
In the queue details page, type 'message 1' in the textbox and click
queue. Then type 'message 2' in the textbox and click queue again. Finally,
click dequeue two times to get the previous messages from the queue in the
right order.
101
Click the windows button ( ) in the Windows Phone Emulator to navigate to
the Start menu.
102
Switch to the Web browser and click the User menu option. Notice that new
users (like the one you have created) have by default granted permissions to
access Tables, Blobs, Queues and SQL Azure.
Note: The Web Sites administrator user (admin) is displayed in the list only if
the application is configured to use ASP.NET Membership authentication, in
which case the admin user is also a valid application user.
Note: The column SQL is displayed only if the application is configured to use a
SQL database.
103
Uncheck the Tables, Blobs and Queues checkboxes for the user you have
created.
104
Click the Tables menu option. In this page, you can grant permission to
each user for each of the tables available in the Windows Azure Table storage.
105
Click the Queues menu option. In this page, you can grant permission to
each user for each of the queues available in the Windows Azure Queue
storage.
106
Click the Blob Containers menu option. In this page, you can grant
permission to each user for each of the blob containers available in the
Windows Azure Blob storage.
107
Switch back to the Windows Phone Emulator and click the WAT Windows
Phone icon to open the application again.
108
Flick or pan back to left to navigate to the tables list pivot item and then
to the sample data pivot item. You will see error messages in both pages
saying that you have no permissions to use tables.
109
Flick or pan to left to navigate to the list blobs pivot item and then click
list blobs. You will also see an error message saying that you have no
permissions to use blobs.
110
Flick or pan to left to navigate to the queues pivot item and then click list
queues. You will see an error message saying that you have no permissions to
use queues.
111
Flick or pan to the left to navigate to the sql azure data pivot item. You
will see the rows available in the SqlSampleData table.
112
Click the windows button ( ) in the Windows Phone Emulator to navigate to
the Start menu.
113
Switch to the Web browser and click the User menu option. Notice that new
users (like the one you have created) have by default granted permissions to
access Tables, Blobs, Queues and SQL Azure.
Note: The Web Sites administrator user (admin) is displayed in the list only if
the application is configured to use ASP.NET Membership authentication, in
which case the admin user is also a valid application user.
Note: The columns Tables, Blobs and Queues are displayed only if the
application is configured to use Windows Azure Storage.
114
Uncheck the SQL checkbox for the user you have created.
115
Switch back to the Windows Phone Emulator and click the WAT Windows
Phone icon to open the application again.
116
Flick or pan back to left to navigate to the sql azure data pivot item. You
will see an error message in the page saying that you have no permissions to
use SQL Azure.
Next Step
BabelCam
BabelCam
This section provides a walkthrough for the BabelCam sample application. This
application was developed using the Windows Phone Cloud Application project
template included in this toolkit.
Starting the Application
After installing the toolkit as explained in the Setup and Configuration section and
running the SetupSample.cmd setup script for this sample, perform the following steps
to go through the BabelCam application.
Note: If you face any problems while following these steps, please make sure to
review the Troubleshooting section.
117
Open Visual Studio 2010 as administrator (this is required to run Windows
Azure projects).
118
119
Browse to the Samples\WP7.1\BabelCam folder, choose BabelCam.sln
and click Open.
120
121
Additionally, the solution includes the source code for the following libraries
used:
122
Make sure that you do not have any Web site running in ports 443 and
10080 on your local IIS.
Note: By default, the ASP.NET MVC 3 Web Role is configured to run over two
different endpoints: one HTTPS in port 443 and another HTTP in port 10080.
123
Make sure that the target for Silverlight for Windows Phone projects is set
to Windows Phone Emulator.
124
In Solution Explorer, right-click the Windows Azure project, point to
Debug and click Start new instance.
125
Wait for the Web Role to start and click the Continue to this website
(not recommended) link to be able to browse the site despite of the
certificate warning.
126
Password:
(with a zero)
127
In Solution Explorer, right-click the Windows Phone project, point to
Debug and click Start new instance. This will launch the Windows Phone
Emulator and start the application.
128
129
In the log in page, click the Install certificate link. This will open Internet
Explorer in the Windows Phone Emulator at
http://127.0.0.1:10080/127.0.0.1.cer.
Note: In order to consume the REST services over HTTPS in a Windows Phone
device or in the Windows Phone Emulator, you need to use a trusted SSL
certificate. If you do not have one, you can use a self-signed certificate, but you
need to install it in the phone before consuming the services.
Since the Computer Emulator always uses the 127.0.0.1 self-signed certificate,
we need to install it in the Windows Phone Emulator before continuing with the
next steps.
130
Click the shield icon to install the Windows Azure Compute Emulators SSL
certificate in the Windows Phone Emulator. Finally, click install to confirm that
you want to install the certificate.
Important: If you leave the Windows Phone Emulator open, you do not need to
install the certificate every time that you run the application. However, if you
close the Windows Phone Emulator, you will have to install it again.
131
Once the certificate is installed, click ok and navigate back to the running
application using the left arrow ( ).
134
If this is the first time you logged into the application, you will be redirected
to the register page. Enter a name and an email address for the user, and
then click register. Wait for the registration to complete. If the registration was
successful, you will see the Registration Successful message. Click ok and
you will be redirected back to the log in page.
Note: The Windows Phone Emulator supports mapping of the keyboard on your
development computer to the hardware keyboard on a Windows Phone (by
default is not enabled). To enable the keyboard in the Windows Phone Emulator
press the PAGE UP or PAUSE/BREAK key. To disable it, press the PAGE DOWN
or PAUSE/BREAK key. For more information, see the following article:
http://msdn.microsoft.com/library/ff754352(VS.92).aspx.
135
After completing the log in page, you will be taken to the babels page,
wait until the application finishes registering for push notifications before using
the application. The connection status should be connected and the
application should indicate the time it received the last notification:
Flick or pan to the left to navigate to the babels pivot item and click the
camera button ( ) in the application bar. The phones camera will be open.
Click the button in the top-right corner of the screen to take a photo and then
click accept. This will redirect you to the upload picture page.
137
In the upload picture page, select English in the From list and English in
the To list and finally clicked upload. If everything worked as expected, you
will see a message box saying that the images was successfully uploaded. Click
ok to navigate back to the babels pivot page.
138
Back in the babels pivot page, wait for a few seconds while the image is
processed. After a short period, you should receive a push notification
indicating that no text was found on the image.
139
The solution contains a sample image that can be used for testing. Go back
to Visual Studio or Visual Studio Express for Windows Phone and in the
Solution Explorer, choose the BabelCam.Phone project and find the
Resources and Toolkit.Content folders:
140
To see how BabelCam works with this sample image, go back in the
Windows Phone Emulator and, in the babels pivot page, click Translate a
sample text image. In the upload picture page, choose French as the
target language and click upload. If everything worked as expected, you will
see a message box saying that the images was successfully uploaded. Click ok
to navigate back to the babels pivot page.
141
Back in the babels pivot page, wait for a few seconds while the image is
processed. After a short period, you should receive a push notification with the
translated text to French.
Note: If you want to use a different sample image for translation, replace the
sampletext.jpg file in both Resources and Toolkit.Content folders, rebuild
the application and restart it.
Flick or pan to the left to navigate to my babels pivot item and click in the
refresh icon ( ). The pivot page will show all your previous babels sent for
translation with the date and time it was processed.
143
If you scroll down or up the list of babels, you can see all your past babels.
144
Click in the text of any babel and a browser window will open showing the
original image that generated that babel.
Next Step
TweetYourBlobs
145
Open Visual Studio 2010 as administrator (this is required to run Windows
Azure projects).
146
147
Browse to the Samples\WP7.1\TweetYourBlobs folder, choose
TweetYourBlobs.sln and click Open.
148
149
Additionally, the solution includes the source code for the following libraries
used:
150
Make sure that you do not have any Web site running in ports 443 and
10080 on your local IIS.
Note: By default, the ASP.NET MVC 3 Web Role is configured to run over two
different endpoints: one HTTPS in port 443 and another HTTP in port 10080.
151
In Solution Explorer, right-click the Windows Azure project, point to
Debug and click Start new instance.
152
Wait for the Web Role to start and click the Continue to this website
(not recommended) link to be able to browse the site despite of the
certificate warning. You will get a forbidden error because the Web site does
not have any pages (it only hosts a WCF Service), and IIS by default does not
allow anonymous users to list the site directory.
153
In Solution Explorer, right-click the Windows Phone project, point to
Debug and click Start new instance. This will launch the Windows Phone
Emulator and start the application.
154
155
In the main page, click the Install certificate link. This will open Internet
Explorer in the Windows Phone Emulator at
http://127.0.0.1:10080/127.0.0.1.cer.
Note: In order to consume the REST services over HTTPS in a Windows Phone
device or in the Windows Phone Emulator, you need to use a trusted SSL
certificate. If you do not have one, you can use a self-signed certificate, but you
need to install it in the phone before consuming the services.
Since the Computer Emulator always uses the 127.0.0.1 self-signed certificate,
we need to install it in the Windows Phone Emulator before continuing with the
next steps.
156
Click the shield icon to install the Windows Azure Compute Emulators SSL
certificate in the Windows Phone Emulator. Finally, click install to confirm that
you want to install the certificate.
Important: If you leave the Windows Phone Emulator open, you do not need to
install the certificate every time that you run the application. However, if you
close the Windows Phone Emulator, you will have to install it again.
157
Once the certificate is installed, click ok and navigate back to the running
application using the left arrow ( ).
159
In the tweet picture page, type the name of the container where you want
to upload your picture. Notice that the autocomplete list of available containers
is filtered while you type. If you type a container name that does not exist in
the storage, it will be created. Additionally, if you check the Make container
public option, the Container ACL will be changed to full public read
access.
160
Type a name for the blob. Additionally, check the Include location data
option if want to include the GPS location value as blob metadata. Finally, click
tweet. If everything worked as expected, Internet Explorer will be opened in
the Windows Phone Emulator showing the Twitter mobile page.
In the Sign in! page, enter your Twitter credentials and click Sign in.
162
You will see a message ready to be tweeted with the blob URL shortened by
bitly. Click Tweet to publish it. If you then click the link inside the tweet you
have just sent, you will navigate to the blob containing your picture.
Next Step
CRUD Sql Azure
163
Open Visual Studio 2010 as administrator (this is required to run Windows
Azure projects).
164
165
Browse to the Samples\WP7.1\CRUDSqlAzure folder, choose
CRUDSqlAzure.sln and click Open.
166
167
Additionally, the solution includes the source code for the following libraries
used:
169
Make sure that the target for Silverlight for Windows Phone projects is set
to Windows Phone Emulator.
170
In Solution Explorer, right-click the Windows Azure project, point to
Debug and click Start new instance.
171
Wait for the Web Role to start and click the Continue to this website
(not recommended) link to be able to browse the site despite of the
certificate warning. You will get a forbidden error because the Web site does
not have any pages (it only hosts a WCF Service), and IIS by default does not
allow anonymous users to list the site directory.
172
Password:
(with a zero)
173
In Solution Explorer, right-click the Windows Phone project, point to
Debug and click Start new instance. This will launch the Windows Phone
Emulator and start the application.
174
175
In the log in page, click the Install certificate link. This will open Internet
Explorer in the Windows Phone Emulator at
http://127.0.0.1:10080/127.0.0.1.cer.
Note: In order to consume the REST services over HTTPS in a Windows Phone
device or in the Windows Phone Emulator, you need to use a trusted SSL
certificate. If you do not have one, you can use a self-signed certificate, but you
need to install it in the phone before consuming the services.
Since the Computer Emulator always uses the 127.0.0.1 self-signed certificate,
we need to install it in the Windows Phone Emulator before continuing with the
next steps.
176
Click the shield icon to install the Windows Azure Compute Emulators SSL
certificate in the Windows Phone Emulator. Finally, click install to confirm that
you want to install the certificate.
Important: If you leave the Windows Phone Emulator open, you do not need to
install the certificate every time that you run the application. However, if you
close the Windows Phone Emulator, you will have to install it again.
177
Once the certificate is installed, click ok and navigate back to the running
application using the left arrow ( ).
179
If this is the first time you logged into the application, you will be redirected
to the register page. Enter a name and an email address for the user, and
then click register. Wait for the registration to complete. If the registration was
successful, you will see the Registration Successful message. Click ok and
you will be redirected back to the log in page.
Note: The Windows Phone Emulator supports mapping of the keyboard on your
development computer to the hardware keyboard on a Windows Phone (by
default is not enabled). To enable the keyboard in the Windows Phone Emulator
press the PAGE UP or PAUSE/BREAK key. To disable it, press the PAGE DOWN
or PAUSE/BREAK key. For more information, see the following article:
http://msdn.microsoft.com/library/ff754352(VS.92).aspx.
181
In this page, you can see the detailed information of each record in the
Products entity set.
182
Change the Name of the product and click the save button (
). You will
notice an error message saying that you do not have permissions to update
products.
183
Go to the administration site and in the Users tab, choose SQL Update for
the user you have created and click Save.
184
Back in the phone application click the save button (
) again. This time,
the changes will be saved and you will be taken to the Products page where
you can see the new data for the product.
185
Now, choose another item in the products list and in the details page select
186
Go to the administration site and in the Users tab, choose SQL Delete for
the user you have created and click Save.
187
Back in the phone application click the delete button ( ) again. This time,
the item will be deleted from the database and you will be taken back to the
products page, the product will not be in the list.
188
189
Go to the administration site and in the Users tab, choose SQL Create for
the user you have created and click Save.
190
Back in the phone emulator, click the save button (
) again. This time the
product will be added and the application will navigate to the products page.
To see the item you have just added, scroll to the bottom of the page, when
you reach the end, click Load More, repeat this action until you reach the
end of the list.
191
Finally, go to the administration site and in the Users tab, choose SQL
Read for the user you have created and click Save.
192
Back in the phone emulator, click the refresh button and notice the error
message saying that you do not have permissions to read the products entity
set.
Next Step
Troubleshooting
Troubleshooting
User is Unable to Install the Certificate, Log in and Register in the Windows
Phone Application
Symptoms
When you start up the Windows Phone application, an error is displayed when you try to:
Install the SSL certificate
Log in with an existing user
Register a new user
Cause
The Windows Phone application is unable to communicate with the Web Role that is
hosting the toolkit services.
Solution
193
Make sure that the Web Role services are running in the Windows Azure
Compute Emulator. If it is not, in Solution Explorer right-click the Windows
Azure project, point to Debug, and click Start new instance.
194
Once the Windows Azure Compute Emulator is running, open its user
interface. To do this, in the Windows taskbar right-click the Windows Azure
Emulators icon (
195
In the Windows Azure Compute Emulator window, review the Service
Details of the current deployment to make sure that the service is running
over HTTPS on port 443 and HTTP on port 10080, both on IP address
127.0.0.1. If it is running on a different port or IP address, stop the
deployment and exit the Windows Azure Compute Emulator. Before starting a
new debugging instance as explained above, make sure that the ports 443 and
10080 are unlocked.
The 'take picture' Button Doesnt Open the Camera When the Phone App is
Tethered
Symptoms
When the Windows Phone sample application is deployed to a Windows Phone device
and tethered, the take picture functionality (
open the phone camera to capture a photo.
Cause
The CameraCaptureTask works fine when tethered, but if you have the Zune client
application opened on your machine, it will keep a lock on your Windows Phone devices
MediaLibrary. Therefore, the captured picture cannot be stored.
Solution
Close the Zune client application. If you are trying to debug through the
CameraCaptureTask, you could use the WPConnect tool instead of the Zune client
for device connectivity.
For more details, see the following article
http://msdn.microsoft.com/library/gg180729(VS.92).aspx.
Cause
When the user has ReSharper installed in his/her environment, the project creation fails
due to an access denied error on the temporary folders created by the Visual Studio
Template Wizard during the process.
Workaround
Disable ReSharper. To do this, in Visual Studio click Options inside the Tools menu.
Now, go to ReSharper section, click Suspend and then OK. After that, close and
reopen your Visual Studio instance and you will now be able to create new Windows
Phone Cloud Application and Windows Phone Empty Cloud Application projects.
In order to enable ReSharper again, in Visual Studio click Options inside the Tools
menu. Now, go to ReSharper section, click Resume and then OK.
Cause
The reason why you are encountering these errors is that you are using the same
Windows Azure Storage account for running your Windows Phone Cloud Application
project using different authentication methods. That is, you have selected to run your
application first using Windows Azure Access Control Service (ACS) and then ASP.NET
Membership or vice versa.
Solution
To fix this issue you need to remove users created with the old authentication method in
the Windows Azure Storage tables used by the application. To do this, you can use a tool
like https://www.myazurestorage.com to remove the old users in the
PushUserEndpoints table (if you are using the Storage Emulator you can use other
tools like the Azure Storage Explorer).
Cause
The name of the relying party realm does not match between the Azure and Phone
projects.
Solution
Make sure that the Relying Party Realm set in the App.xaml file is the same as the one
set in the ServiceConfiguration.cscfg file in the Azure project:
Cause
The causes for this error could be several, most commonly:
The Windows Azure Web Role has not finished starting
The user has not installed the SSL certificate in the phone
Solution
If the Web Role has not started, wait until the Web Role has started correctly and retry
the operation in the phone application.
If the Web Role has started correctly, it is possible that you forgot to install the SSL
certificate.
If you are running one of the samples or application developed using the project
templates:
196
Press the back button until you reach the log in page.
197
In the log in page, click the Install certificate link. This will open Internet
Explorer in the Windows Phone Emulator at
http://127.0.0.1:10080/127.0.0.1.cer.
Note: In order to consume the REST services over HTTPS in a Windows Phone
device or in the Windows Phone Emulator, you need to use a trusted SSL
certificate. If you do not have one, you can use a self-signed certificate, but you
need to install it in the phone before consuming the services.
Since the Windows Azure Computer Emulator always uses the 127.0.0.1 selfsigned certificate, we need to install it in the Windows Phone Emulator before
continuing with the next steps.
198
Click the shield icon to install the Windows Azure Compute Emulators SSL
certificate in the Windows Phone Emulator. Finally, click install to confirm that
you want to install the certificate.
Important: If you leave the Windows Phone Emulator open, you do not need to
install the certificate every time that you run the application. However, if you
close the Windows Phone Emulator, you will have to install it again.
Cause
The reason why you are running into this problem is that SQL Server does not have the
correct permissions to access the App_Data folder in the Web Role project.
Solution
To fix this issue you need to remove the App_Data folder in the Web Project and recreate it:
199
Right-click on the App_Data folder, click Delete and confirm the operation.
200
Right-click on the Web project and select Add -> Add ASP.NET Folder ->
App_Data.
Cause
The reason why you are running into this problem is that you have created two different
solutions with the same name, and the database file from the first one is still attached to
the SQL Server user instance.
Solution
To fix this issue you need to rename the database file in one of the two solutions:
201
Right-click on the web role in the Windows Azure project and click
Properties.
202
Click Settings, select the SqlDataContextConnectionString and change
the value of the settings: AttachDBFileName and Initial Catalog to a new
unique value.
More Information
The following articles may be useful when troubleshooting a Windows Phone application:
How to: Use the Connect Tool for Windows Phone
Troubleshooting Windows Phone SDK
Tips for debugging WP7 media apps with WPConnect
Next Step
Change Log
Change Log
The following are the changes made to the toolkit since the release of v1.3.1.
Note: One important change starting with the v1.3.1 release is that the Visual
Basic content was removed since it will be shipped as a different package in
CodePlex.
Toolkit Services
Upgraded Windows Azure projects to Windows Azure SDK for .NET November
2011
Updated BabelCam, CRUDSqlAzure, WPCloud.ACS, and WPCloud.SQL.ACS samples to
include default ACS configuration to allow developers running the samples without
owning an ACS namespace.
The Windows Azure Toolkit for Windows Phone project template for Visual Studio can
implement two different access control strategies: it can generate and include in the
project a classic ASP.NET membership store, or it can outsource authentication to the
Windows Azure Access Control Service. Here there is a brief comparison of the two
options.
Create a new ASP.NET membership store in Windows Azure Tables
If you choose this option, the template will generate an ASP.NET membership store and
place it in Windows Azure storage. The Windows Phone application will include UI
elements for registering and logging in users via username and password, which will be
stored in the membership database.
This option implements a very well known approach, and has the least amount of
requirements: the project can be entirely self-contained. It can be very convenient when
you are using the toolkit as a learning tool, or if you foresee that your application will
have to include its own account store.
On the other hand, managing a user store may become a burden; and one application
relying on its own user store cannot be easily integrated with other solutions.
Use the Windows Azure Access Control Service
If you choose this option, the template will configure your application to outsource
authentication to the Windows Azure Access Control Service. This means that the
Windows Phone application will enable users to register and log in by reusing their
existing accounts from identity providers such as Windows Live ID, Google, Yahoo and
possibly from their Active Directory or Facebook.
In order to take advantage of this option you need to have a namespace with the
Windows Azure Access Control Service, and an active internet connection for
communicating with ACS itself and the configured identity providers. You can obtain ACS
namespaces for free thanks to a promotion that will run until at least the end of 2011.
The template gathers some info about your namespace and generates an application
that is fully integrated with ACS with some basic settings.
The ACS approach gives you the most reach, as it can authenticate users from well
known identity providers on the web; it also allows you to reuse in your mobile
application accounts from your local directory.
The Windows Azure Toolkit for Windows Phone project template for Visual Studio can
generate a project, which is fully configured for outsourcing authentication functions to
ACS, and configure ACS with some basic settings. You can hit F5 just after creation and
the application will be ready to authenticate users from Windows Live ID, Google and
Yahoo right out of the box.
In order to accomplish this, you need to have an active subscription with ACS;
furthermore, the project template needs to acquire some information about your ACS
namespace.
If you need to create an ACS namespace, please refer to the walkthrough here. Note,
you only need to go through the sections Accessing the AppFabric Portal and Service
Namespace Creation; the project template will take care of the rest for you.
The ACS Namespace field expects the unique string you chose as your namespace.
The Management Key can be obtained by navigating to https://
{MYNAMESPACE}.accesscontrol.windows.net/v2/mgmt/web/ServiceAccount/Managemen
tKey/Edit. Make sure to substitute {MYNAMESPACE} with your ACS namespace, then
click on Symmetric Key and copy the content of the Key field.
204
Change the directory to the location where you want to save the certificate
file.
205
Type the following command, making sure to replace <CertificateName>
with your hosted service URL:
Command
makecert -sky exchange -r -n "CN=<DnsName>.cloudapp.net" -pe -a sha1 -len
2048 -ss My "<DnsName>.cloudapp.net.cer"
Note: The makecert tool will both create the .cer file and register the certificate
in your Personal Certificates store. For more information, check the following
article: http://msdn.microsoft.com/en-us/library/gg432987.aspx.
207
The new certificate was automatically added to the personal certificate
store. Export the certificate by right-clicking it, pointing to All Tasks, and then
clicking Export.
208
On the Export Private Key page, make sure to select Yes, export the
private key.
209
210
Note: You now have a copy of the certificate (.pfx) with the private key. For more
information, check the following article: http://msdn.microsoft.com/enus/library/gg432987.aspx.
Expand your hosted service project, and select the Certificates folder.
214
215
Click Browse and select the PFX file you saved. Enter the password, and
click Create.
216
Once the certificate has been uploaded and created, copy the Thumbprint
for later use.
If you chose to support Apple Push Notifications, please follow these additional steps:
217
In order to use the toolkit to send Apple push notifications, you should have
obtained the appropriate SSL certificate for your iOS application. You can find
224
Now you can publish your Windows Azure project to your hosted service.
You can do this from the Windows Azure Platform Management Portal or
directly from Visual Studio 2010.
Update your Windows Phone Project to Consume your Windows Azure Hosted
Service
225
226
Key
Value
SSLCertificateUrl
http://<YourDNSPrefix>.cloudapp.net:10080/<CertificateName>.cer
SharedAccessSignatureServiceEndpoi
nt
https://<YourDNSPrefix>.cloudapp.net/SharedAccessSignatureServic
e
AzureStorageTableProxyEndpoint
https://<YourDNSPrefix>.cloudapp.net/AzureTablesProxy.axd
AzureStorageQueueProxyEndpoint
https://<YourDNSPrefix>.cloudapp.net/AzureQueuesProxy.axd
AuthenticationServiceEndpoint
https://<YourDNSPrefix>.cloudapp.net/AuthenticationService
RegistrationServiceEndpoint
https://<YourDNSPrefix>.cloudapp.net/RegistrationService
PushNotificationServiceEndpoint
https://<YourDNSPrefix>.cloudapp.net/PushNotificationService
SqlOdataEndpoint
https://<YourDNSPrefix>.cloudapp.net/SqlAzureSampleOdataService
227
To test against the deployed services, right-click the Windows Phone
project, navigate to the Debug context menu, and click on Start new
instance.
The Windows Azure Toolkit for Windows Phone project template for Visual Studio can
generate a project, which is fully configured to provide read only access to an OData
service on top of a SQL Azure Database.
In order to accomplish this, you need to have an active subscription with SQL Azure
Database; furthermore, the project template needs to acquire some information about
your SQL Azure Database Server.
In the project template wizard, you will use the Database Administrator user, since Entity
Framework 4.1 Code-First requires database administrator privileges to create the model
database. However, you may want to change this in applications deployed to production
environments.
229
230
At the Windows Azure Platform portal home page, click New Database
Server on the ribbon.
231
To create a server, select your subscription on the left pane. Click Create
on the Server ribbon.
232
Select a region from the Region drop down list, and then click Next. The
location determines which datacenter the database will reside in.
233
234
Click Finish to create the new server. You will configure firewall rules later
on.
235
Finally, the new server information, including Fully Qualified Server
Name, is shown.
Note: The fully qualified domain name of the server uses the following format:
<ServerName>.database.windows.net
where <ServerName> identifies the server. You must use the ServerName you
have just created later on the application.
236
Expand the subscription node located on the left pane, and then click the
server name you have created. The Server Information page allows you to
perform basic administration of the database server.
237
The Firewall Rules allows you to specify a list of IP addresses that can
access your SQL Azure Server. The firewall will deny all connections by default,
so be sure to configure your allow list so that existing clients can connect
to the server.
Note: Changes to your firewall settings can take some time to become effective.
You now have a database server created and ready for this application. This database
can be connected to from anywhere in the world.
You should use the user name and password from step 6 and the Server Name from
step 8 to configure the application generated by the project template.
239
240
241
Copy your Project Hawaiis Application ID and use it in the BabelCam setup
process.
243
244
245
Fill in the form with your information and click Agree to accept the API
terms of use.
246
Copy your Bing AppID and use it during the BabelCam setup process.
Navigate to http://bitly.com/a/your_api_key.
248
In case you already have a bitly account, click Sign In. Otherwise, click
Sing Up and complete the process.
249
Copy the bitly Username and bitly API Key values and use it during the
TweetYourBlobs setup process.