如何将Azure移动服务添加到Windows Phone应用

使用实时磁贴,通过单点登录对用户进行身份验证以及在设备和用户之间共享数据的Windows Phone应用程序通常会使用云服务。 大多数云平台提供通用功能来存储数据和执行代码,但是您必须添加大量基础结构代码才能将这些功能粘合在一起。 Azure移动服务使您可以在几分钟内将云服务添加到您的应用程序。

介绍

本教程介绍如何使用Azure移动服务将后端服务添加到Windows Phone应用程序。 您将创建一个新的移动服务和一个简单的待办应用程序,使用新的移动服务将其数据存储在云中。 在本教程中,您将学习如何:

  • 创建移动服务并向其中添加表
  • 更新应用程序以使用移动服务
  • 测试Azure移动服务上托管的移动服务

要跟着我,您需要一个Windows Azure帐户。 如果您还没有帐户,可以注册Windows Azure试用版

1.创建移动服务

我们首先需要设置Windows Phone应用程序可以使用的新移动服务。 您将在本教程中创建的移动服务是JavaScript后端移动服务。 它使您可以将JavaScript用于服务器端业务逻辑。 请按照以下步骤使用Azure管理门户创建新的移动服务。

步骤1:添加移动服务

登录到Azure管理门户 ,然后单击导航栏中的“ 新建”按钮。 展开计算> 移动服务 ,然后单击创建

添加移动服务

步骤2:选择数据库类型,区域和运行时

在“ 新建移动服务”向导中,选择一个20 MB的免费SQL数据库或使用您现有的数据库之一。 从“ 后端”菜单中选择“ JavaScript” ,然后在“ URL”文本框中输入新移动服务的子域。

选择数据库类型区域和运行时

请注意,移动服务的名称必须唯一。 如果您输入的名称/子域不可用, URL旁会显示一个错误。

步骤3:指定数据库设置

创建新的移动服务时,它将自动与SQL数据库关联。 然后,Azure移动服务后端提供内置支持,使远程应用程序能够安全地从中存储和检索数据,而无需编写或部署任何自定义服务器代码。

要配置数据库,请在“ 名称”字段中输入数据库的名称 。 接下来,输入服务器登录名服务器登录密码以访问SQL数据库服务器。

指定数据库设置

单击右下角的复选标记以完成该过程。 现在,您已经创建了可以由您的移动应用程序使用的新的移动服务。 在开始存储数据之前,首先需要创建一个表,该表可以存储应用程序的数据。

请注意,由于额外的带宽成本和更高的延迟,不建议在其他区域中使用数据库。

2.将表添加到移动服务

在此步骤中,我们将向移动服务添加一个名为ToDoItem的表,客户端应用程序将使用该表保存用户的待办事项。

步骤1:创建一个新表

Azure管理门户的“ 数据”选项卡中,单击“ 创建”以将新表添加到移动服务。 将表命名为ToDoItem并为每个操作设置权限级别。 对于ToDoItem表,我使用了默认权限设置。

创建一个新的ToDoItem表

单击右下角的复选标记以完成表设置过程。 在短短的几秒钟内,您就将ToDoItem表添加到了移动服务中。

步骤2:将列添加到表

ToDoItem表已经包含许多列,用于存储ID,创建日期,删除状态,更新日期和版本信息。 为了使该表对我们的应用程序有用,我们需要添加两列,一列用于存储待办事项的文本,另一列用于存储待办事项的状态。

要添加其他列,请从ToDoItem表的“ 列”选项卡中单击“ 添加列 ”。 文本列的类型为String ,而完整列的类型为Boolean

将列添加到表

这些是ToDoItem表的列。

查看表中的所有列
现在我们已经设置了移动服务并向其中添加了表格,您有两个选择:创建新应用或将现有应用连接到移动服务。 在本教程中,我们将修改现有的Windows Phone应用程序以使用移动服务。

3.配置应用程序以使用移动服务

需要正确配置应用程序才能使用移动服务。 您需要添加代码以将您的应用程序连接到移动服务,并将数据保存到云中。

解决方案资源管理器中右键单击项目名称,然后从菜单中选择“ 添加” >“ 连接的服务 ”。 在出现的“ 添加连接的服务”对话框中,选择“ Azure移动服务” ,然后单击“ 配置”

添加连接的服务

接下来,从帐户中现有服务的列表中选择您先前创建的移动服务。 您需要提供凭据才能在Windows Azure帐户中连接并列出移动服务。

连接到Azure移动服务

选择我们创建的移动服务,然后单击添加以完成该过程。 向导然后将所有必需的引用添加到您的项目。 也可以通过使用NuGet安装所需的软件包来手动添加引用。 右键单击您的客户端项目,选择“ 管理NuGet程序包” ,搜索WindowsAzure.MobileServices程序包,然后添加该程序包的引用。

添加Azure移动服务包参考

该向导将安装所需的NuGet程序包,将对移动服务的客户端库的引用添加到项目中,并更新项目源代码。 该向导还向App类添加了一个新的静态字段,如下所示:

public static Microsoft.WindowsAzure.MobileServices.MobileServiceClient
    todolistClient = new Microsoft.WindowsAzure.MobileServices.MobileServiceClient(
        "https://todolist.azure-mobile.net/",
        "XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX");

此代码通过使用MobileServiceClient类的实例提供对应用程序中新移动服务的访问。 通过提供新移动服务的URI和应用程序密钥来创建客户端。 此静态字段可用于您应用中的所有页面。 如果不使用向导,则需要将此代码手动添加到App.xaml.cs。

4.更新应用程序以使用移动服务

您需要更新Windows Phone应用程序才能将移动服务用作后端服务。 您只需要对MainPage.cs项目文件进行更改。

步骤1:添加ToDoItem类定义

向您的项目添加一个新的模型类ToDoItem 。 模型类包含与我们之前创建的ToDoItem表中的列相对应的属性。

public class ToDoItem
    {
        public string Id { get; set; }

        [Newtonsoft.Json.JsonProperty(PropertyName = "text")]
        public string Text { get; set; }

        [Newtonsoft.Json.JsonProperty(PropertyName = "complete")]
        public bool Complete { get; set; }

        public ToDoItem() {}

        public ToDoItem(string text, bool status = false)
        {
            Text = text;
            Complete = status;
        }
    }

JsonPropertyAttribute方法用于定义客户端应用程序中的属性名称和对应表中的列名称之间的映射。 必须将对Newtonsoft.Json包的引用添加到项目中,以使此工作有效。

步骤2:添加代码以插入和获取项目

将以下using语句添加到MainPage.xaml.cs

using Microsoft.WindowsAzure.MobileServices;

MainPage.xaml.cs的顶部添加以下行,以为数据库表创建可感知移动服务的绑定集合和代理类。

private MobileServiceCollection<ToDoItem, ToDoItem> items;
private IMobileServiceTable<ToDoItem> todoTable =
    App.tutsplusdemoClient.GetTable<ToDoItem>();

接下来,创建一个InsertToDoItem方法以将新项目插入表中。 将async修饰符添加到方法中,并添加以下代码以插入项目。

public async Task InsertToDoItem(ToDoItem toDoItem)
{
    await todoTable.InsertAsync(toDoItem);
    items.Add(toDoItem);
}

如果您的表的权限设置为“ 使用应用程序密钥的任何人”,则此代码有效。 如果更改权限以保护移动服务安全,则需要添加用户身份验证支持。 请参阅使用Azure移动服务添加身份验证

创建一个RefreshTodoItems方法,该方法将绑定设置为ToDoItem表中的项目集合,该表包含从移动服务返回的所有ToDoItem对象。 如果执行查询时发生问题,我们将显示一个消息框。

private async Task RefreshTodoItems()
{
    MobileServiceInvalidOperationException exception = null;
    try
    {
        // Query that returns all items.   
        items = await todoTable.ToCollectionAsync();
    }
    catch (MobileServiceInvalidOperationException e)
    {
        exception = e;
    }
    if (exception != null)
    {
        await new MessageDialog(exception.Message, "Error loading items").ShowAsync();
    }
    else
    {
        ListItems.ItemsSource = items;
        this.ButtonSave.IsEnabled = true;
    }
}

步骤3:将控件添加到MainPage.xaml

现在,我们必须更新MainPage.xaml以显示待办事项,并添加添加待办事项的功能。 下面是简单用户界面的XAML代码的外观,该用户界面包含用于插入项目的TextBox和用于查看待办事项的ListView

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="18,0,18,0">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="4*" />
        <ColumnDefinition Width="2*" />
    </Grid.ColumnDefinitions>
    <TextBox Grid.Row="0" Grid.Column="0" Name="TextInput" Text="" />
    <Button Grid.Row ="0" Grid.Column="1" Name="ButtonSave" Click="ButtonSave_Click" IsEnabled="False" Margin="10, 0, 0, 0">Save</Button>
    <Button Grid.Row="1" Grid.ColumnSpan="2" Name="ButtonRefresh" Click="ButtonRefresh_Click" HorizontalAlignment="Stretch">Refresh</Button>
    <ListView  Grid.Row="2" Grid.ColumnSpan="2" Name="ListItems">
        <ListView.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal">
                    <CheckBox Name="CheckBoxComplete" IsChecked="{Binding Complete, Mode=TwoWay}" Checked="CheckBoxComplete_Checked" Content="{Binding Text}" Margin="10,5" VerticalAlignment="Center"/>
                </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</Grid>

InsertToDoItem保存”按钮时, 调用InsertToDoItem方法,该方法InsertToDoItem插入表中。

private async void ButtonSave_Click(object sender, RoutedEventArgs e)
{
    var todoItem = new TodoItem { Text = TextInput.Text };
    await InsertTodoItem(todoItem);
}

轻按“ 刷新”按钮时,将调用RefreshToDoItems方法。 在这种方法中,我们获取表中的所有项目。

private async void ButtonRefresh_Click(object sender, RoutedEventArgs e)
{
    ButtonRefresh.IsEnabled = false;

    //await SyncAsync(); // offline sync
    await RefreshTodoItems();

    ButtonRefresh.IsEnabled = true;
}

5.测试移动服务

本教程的最后一步是查看存储在移动服务中的数据。 在Windows Azure经典门户中,单击移动服务的“ 数据”选项卡下的“ ToDoItem”表。 在浏览选项卡下,您可以查看表中的所有项目。

查看表中的所有项目

结论

本教程演示了将Azure移动服务用作Windows Phone应用程序的后端的基本知识。 创建移动服务并在应用程序中使用它来将数据存储在云中很容易实现。

更复杂的方案包括支持脱机数据同步。 您还可以按照本教程向应用程序添加离线数据同步支持。 您可以限制表权限,以仅允许经过身份验证的用户更新此Envato Tuts +文章之后的表。

随时下载本教程的源文件以供参考。 在部署应用之前,请记住将应用配置为使用Azure移动服务。

翻译自: https://code.tutsplus.com/tutorials/how-to-add-azure-mobile-services-to-a-windows-phone-app--cms-24178

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值