• 博客园UAP版开发心得之推荐应用的实现


       最近做了一个博客园UAP升级项目,增加了一些新的功能,下面简单说一下都有什么新功能在等着我们,并且着重介绍一下推荐应用的实现过程,希望能给一些感兴趣的博友们一些帮助:)

     

    1.在首页增加了"热门"和"精选"的快速访问入口,省了好多事儿

     

     

    2.可以离线收藏文章啦(离线所有的文字内容)

     

    3.实现透明磁贴,去开始屏幕看看吧

     

    4.在博主页面二级菜单里面增加了"查找博主"的功能菜单,找人再也不费劲儿了 

     

    5.在栏目中增加几个推荐应用,马上去看看有哪些有意思的应用吧

     

     

      下面我们重点说一下增加的推荐应用的实现过程,我们利用Web API + Cloud实现荐应用的服务器端的控制,Web API大家可能并不陌生,国内外介绍Web API的文章有很多,在这里我就不详细的介绍了,简单地介绍一下服务器端如何实现推荐频道,从sql server到Web API再到cnblogs客户端的整体实现过程

     

    一、SQL Server数据库的创建

     

      在SQL Server数据库中创建一个名为CnblogsDB的数据库实例,创建一个名为Cnblogs_Recommend_Columns的数据库表字段包括Id,Quick,Icon,Name,Desc,Page,Color,Language等,我们不必关心具体字段的含义。

     

     

    创建数据库表Cnblogs_Recommend_Columns的脚本如下

     

    CREATE TABLE [dbo].[Cnblogs_Recommend_Columns]

    (

    [Id] INT NOT NULL PRIMARY KEY IDENTITY (1, 1),

    [Quick] VARCHAR(50) NULL,

    [Icon] VARCHAR(200) NULL,

    [Name] NVARCHAR(50) NULL,

    [Desc] VARCHAR(500) NULL,

    [Page] VARCHAR(100) NULL,

    [Color] VARCHAR(10) NULL,

    [Language] VARCHAR(10) NULL

    )

     

    insert into [dbo].[Cnblogs_Recommend_Columns]([Quick],[Icon],[Name],[Desc],[Page],[Color],[Language])

    values ('false','Images/bingdicticon.png',N'必应词典',N'推荐应用','ms-windows-store:navigate?appid=71bbd0fd-23e8-4157-ab29-a1cbd82e425b','#AA7EAE','zh-CN')

    insert into [dbo].[Cnblogs_Recommend_Columns]([Quick],[Icon],[Name],[Desc],[Page],[Color],[Language])

    values ('false','Images/bingdicticon.png','BingDict','Recommendations','ms-windows-store:navigate?appid=71bbd0fd-23e8-4157-ab29-a1cbd82e425b','#AA7EAE','en-US')

    insert into [dbo].[Cnblogs_Recommend_Columns]([Quick],[Icon],[Name],[Desc],[Page],[Color],[Language])

    values ('false','Images/coupleticon.png',N'微软对联',N'推荐应用','ms-windows-store:navigate?appid=25035c46-0362-40b9-9c84-fd4a3cafe4df','#AA7EAE','zh-CN')

    insert into [dbo].[Cnblogs_Recommend_Columns]([Quick],[Icon],[Name],[Desc],[Page],[Color],[Language])

    values ('false','Images/coupleticon.png','Couplet','Recommendations','ms-windows-store:navigate?appid=25035c46-0362-40b9-9c84-fd4a3cafe4df','#AA7EAE','en-US')

    insert into [dbo].[Cnblogs_Recommend_Columns]([Quick],[Icon],[Name],[Desc],[Page],[Color],[Language])

    values ('false','Images/doubanicon.png',N'豆瓣一刻',N'推荐应用','ms-windows-store:navigate?appid=ed23f20b-3b0d-4efb-97f8-e70ef709b31b','#AA7EAE','zh-CN')

    insert into [dbo].[Cnblogs_Recommend_Columns]([Quick],[Icon],[Name],[Desc],[Page],[Color],[Language])

    values ('false','Images/doubanicon.png','BouBan','Recommendations','ms-windows-store:navigate?appid=ed23f20b-3b0d-4efb-97f8-e70ef709b31b','#AA7EAE','en-US')

    insert into [dbo].[Cnblogs_Recommend_Columns]([Quick],[Icon],[Name],[Desc],[Page],[Color],[Language])

    values ('false','Images/riddleicon.png',N'微软字谜',N'推荐应用','ms-windows-store:navigate?appid=4a54f6f0-d387-4517-8026-dd8b93bcdf19','#AA7EAE','zh-CN')

    insert into [dbo].[Cnblogs_Recommend_Columns]([Quick],[Icon],[Name],[Desc],[Page],[Color],[Language])

    values ('false','Images/riddleicon.png','Riddle','Recommendations','ms-windows-store:navigate?appid=4a54f6f0-d387-4517-8026-dd8b93bcdf19','#AA7EAE','en-US')

     

    二、Web API的实现与部署

     

    1.创建一个Web API 项目,命名为CNBlogsWebAPI

     

     

    2.在Models文件夹中创建一个LINQ to SQL Classes,名为CnblogsDB.dbml,双击打开主文件

    3.利用VS的Server Explorer与数据库连接,并且打开,拖拽表Cnblogs_Recommend_Columns进入CnblogsDB.dbml

    4.在Controllers文件夹增加一个RecommendController类

    类的代码如下

    using CNBlogsWebAPI.Models;

    using System;

    using System.Collections.Generic;

    using System.Linq;

    using System.Net;

    using System.Net.Http;

    using System.Text;

    using System.Web.Http;

    using System.Xml.Serialization;

    namespace CNBlogsWebAPI.Controllers

    {

    [RoutePrefix("api/cnblogs")]

    public class RecommendController : ApiController

    {

    CnblogsDBDataContext _db = new CnblogsDBDataContext();

    [Route("recommendcolumns/{language}")]

    [HttpGet]

    public IHttpActionResult GetRecommendColumns(string language)

    {

    if (string.IsNullOrEmpty(language)) language = "zh-CN";

    var result = _db.Cnblogs_Recommend_Columns.Where(c => c.Language.ToLower() == language.ToLower());

    return Ok(

    new

    {

    Columns = result.ToList()

    });

    }

     

    protected override void Dispose(bool disposing)

    {

    base.Dispose(disposing);  

    if (_db != null)

    {

    this._db.Dispose();

    }

    }

    }

    }

     

    测试一下,运行CNBlogsWebAPI会出现如下见面

     

     

    不过,没关系,我们可以根据RoutePrefix和Route拼接出如下的链接http://localhost:34023/api/cnblogs/recommendcolumns/zh-CN,然后在地址栏中输入这个链接,回车,值得一提的是用IE浏览器打开会返回一个Json串,据说用火狐返回是XML格式(本人不用火狐的,所以并没有验证过,感兴趣的朋友可以自己试试)

     

    5.至于部署,采用IIS托管即可,博客园UAP是在云服务器上部署的

     

    三、Cnblogs WP客户端调用

     

    接下来到了最关键的一步了,那就是在APP中如何调用,说起来介绍这方面的文章在网上一搜一大把,在这里也不赘述了,直接上Code(这段代码仅为示例)

    using Windows.Web.Http;

    public async static Task GetColumns()

    {

    var rootUrl = "http://localhost:34023/";

    var url = rootUrl + "api/cnblogs/recommendcolumns/" + System.Globalization.CultureInfo.CurrentCulture.Name;

    var client = new HttpClient();

    var request = new HttpRequestMessage(HttpMethod.Get, new Uri(url));

    var response = await client.SendRequestAsync(request);

    if (response.StatusCode == HttpStatusCode.Ok)

    {

    var result = response.Content;//此处为返回结果,Json格式

    }

    }

    通过如上的方法调用,我们得到了result,结果是Json格式的数据,得到了数据,就是我们为所欲为,大显身手的时候啦,最好是Json to object,这样我们就可以更好地与XAML界面Binding啦,最后的结果大家已经看到了,就是红色方框里的喽

  • 相关阅读:
    JavaScript中的setMonth()方法的小问题 解决:setMonth(month, 1)
    Bootstrap的Model源码详细注释 (转)
    中检测到有潜在危险的 Request.Form 值。
    JQuery EasyUI DataGrid获取当前行
    VS 开发必用插件
    C# MVC模式 404 500页面设置方法
    (转)高性能网页开发的14条军规
    (转)mysql百万级以上查询优化
    Win7/Win8安装"我们无法创建新的分区,也找不到现有的分区"的解决方法
    SQL Server2008 删除登录记录
  • 原文地址:https://www.cnblogs.com/ms-uap/p/4481457.html
Copyright © 2020-2023  润新知