经过接口调取博客园文章的实现

时间  2020-05-11
标签 经过 接口 博客 文章 实现 繁體版
原文   原文链接

经过接口调取博客园文章的实现

注册了个域名（Nineksy.cn），在阿里云申请了个云虚主机。今天域名备案经过了，准备给网站作几个个页面，由于博客园用的很顺手了就不许备本身内容管理了，准备直接调用博客园的内容。因为阿里云的云虚主机不支持.net core， 但支持.NET Framework，就用.NET MVC 来作。html

1、博客园的接口

博客园开发者中心支持对博客园的各类管理api，返回json格式，不过使用这种接口要申请ApiKey，这是只是简单调用一下博客列表和内容，因此使用另外一个简单的方式http://wcf.open.cnblogs.com/blog/help，这个api较少（以下图），只是调取一下博客内容页足够了。这里使用的是.net 4.5 MVC项目进行调用。web

2、建立网站

打开VS2019，【文件】->【新建】->【项目】。json

在建立新项目对话框中选择【ASP.NET Web 应用程序（.NET Framework）】，【下一步】。bootstrap

选择建立项目
c#

在配置新项目对话框中对项目进行配置。项目名称输入“NineskyWeb”；位置是项目源代码保存的位置，能够随便选；解决方案名称这里与项目名称一致。框架选择“.NET Framework4.5”，由于云虚主机只支持到4.5。点【建立】。api

在建立新的ASP.NET Web应用程序里面选择“MVC”。点击【建立】。而后等待项目建立完成。浏览器

项目建立完成后 点开【解决方案管理器】，能够看到建立了一个标准的.net mvc 项目（以下图），无需任何配置，按【F5】便可运行项目。架构

运行后能够在浏览器中能够看到一个bootstrap风格的页面。mvc

这个界面有点丑，找个风格稍微美化一下。比上面一个好看了些。框架

3、调用文章

一、添加控制器

在控制器文件夹【Controller】右键->【添加】->【控制器】

在添加已搭建基架的新项对话框中选择【MVC5 控制器-空】，点击【添加】

在添加控制器名称中输入博客控制器名称，“BlogController”，点击【添加】

自动建立的代码以下：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace NineskyWeb.Controllers
{
    public class BlogController : Controller
    {
        // GET: Blog
        public ActionResult Index()
        {
            return View();
        }
    }
}

二、接口的返回格式

看一下博客园分页获取我的博客文章列表的api：http://wcf.open.cnblogs.com/blog/u/{BLOGAPP}/posts/{PAGEINDEX}/{PAGESIZE}

这里须要三个参数

BLOGAPP 博客地址
PAGEINDEX 当前页
PAGESIZE 每页记录数

直接在浏览其中输入http://wcf.open.cnblogs.com/blog/u/mzwhj/posts/1/2，看一下返回的xml格式。

<feed xmlns="http://www.w3.org/2005/Atom">
<title type="text">博客园_洞庭夕照</title>
<id>uuid:1ca5ca2a-9303-4ff0-8404-47cf84630ebe;id=9103</id>
<updated>2020-04-26T09:19:20+08:00</updated>
<logo>
file://pic.cnblogs.com/face/132313/20140310231701.png
</logo>
<author>
<name>洞庭夕照</name>
<uri>http://www.cnblogs.com/mzwhj/</uri>
</author>
<postcount>103</postcount>
<entry>
<id>6256307</id>
<title type="text">.Net Core MVC 网站开发（Ninesky） 2.四、添加栏目与异步方法</title>
<summary type="text">
在2.3中完成依赖注入后，此次主要实现栏目的添加功能。按照前面思路栏目有三种类型，常规栏目便可以添加子栏目也能够选择是否添加内容，内容又能够分文章或其余类型，因此还要添加一个模块功能。此次主要实现栏目的添加，附带实现模块列表功能，并将业务逻辑层的功能都实现了异步方法。 先来个完成后的界面吧。 1、业...
</summary>
<published>2017-01-06T14:55:00+08:00</published>
<updated>2020-04-26T03:36:18Z</updated>
<author>
<name>洞庭夕照</name>
<uri>http://www.cnblogs.com/mzwhj/</uri>
</author>
<link rel="alternate" href="http://www.cnblogs.com/mzwhj/p/6256307.html"/>
<diggs>0</diggs>
<views>4529</views>
<comments>17</comments>
</entry>
<entry>
<id>6224237</id>
<title type="text">
.Net Core MVC 网站开发（Ninesky） 2.三、项目架构调整(续)-使用配置文件动态注入
</title>
<summary type="text">
上次实现了依赖注入，可是web项目必需要引用业务逻辑层和数据存储层的实现，项目解耦并不彻底；另外一方面，要同时注入业务逻辑层和数据访问层，注入的服务直接写在Startup中显得很是臃肿。理想的方式是，web项目近引用接口而不引用实现，在配置文件中进行配置实现程序集合类，注入业务逻辑层而没必要注入数据访问
</summary>
<published>2016-12-26T22:39:00+08:00</published>
<updated>2020-04-26T03:36:18Z</updated>
<author>
<name>洞庭夕照</name>
<uri>http://www.cnblogs.com/mzwhj/</uri>
</author>
<link rel="alternate" href="http://www.cnblogs.com/mzwhj/p/6224237.html"/>
<diggs>0</diggs>
<views>2038</views>
<comments>1</comments>
</entry>
</feed>

咱们关注的是“entry”节点内容，这个节点里返回博客列表的相关内容，根据这个内容来添加模型

三、添加模型

添加博客列表模型

在Models文件夹上右键->添加->类。类名输入BlogItem。

using System;

namespace NineskyWeb.Models
{
    public class BlogItem
    {
        /// <summary>
        /// 标识
        /// </summary>
        public int Id { get; set; }

        /// <summary>
        /// 标题
        /// </summary>

        public string Title { set; get; }

        /// <summary>
        /// 简介
        /// </summary>

        public string Summary { set; get; }

        /// <summary>
        /// 发布时间
        /// </summary>

        public DateTime Published { get; set; }

        /// <summary>
        /// 做者
        /// </summary>

        public string Author { get; set; }

        /// <summary>
        /// 阅读次数
        /// </summary>
        public int Views { get; set; }

        /// <summary>
        /// 评论数
        /// </summary>
        public int Comments { get; set; }
    }
}

另外一个要关注的就是“postcount”，分页须要用到总记录数，下面添加分页模型。

添加分页模型

在Models文件夹上右键->添加->类。类名输入Page

using System.Collections.Generic;

namespace NineskyWeb.Models
{
    public class Page<T> where T:class
    {
        /// <summary>
        /// 页码
        /// </summary>
        public int Index { get; set; }

        /// <summary>
        /// 每页记录数
        /// </summary>
        public int Size { get; set; }

        /// <summary>
        /// 总记录数
        /// </summary>

        public int TotalCount { get; set; }

        /// <summary>
        /// 总页数
        /// </summary>

        public int TotalPage { get; set; }

        /// <summary>
        /// 博客列表
        /// </summary>
        public List<T> Items { get; set; }
    }
}

如今返回到刚添加的博客控制器中，修改Index代码，实现从博客园get博客列表。

四、用HttpClient从博客园获取数据

思路：利用HttpClient从博客园获取博客列表的xml格式数据，而后转换成Page模型，并传递给试图。代码以下：

/// <summary>
        /// 博客列表
        /// </summary>
        /// <param name="id">页码</param>
        /// <param name="size">每页记录数</param>
        /// <returns></returns>
       [ActionName("Index")]
        public async Task<ActionResult> IndexAsync(int id=1,int size=8)
        {
            HttpClient client = new HttpClient() { BaseAddress = new Uri("http://wcf.open.cnblogs.com/blog/u/mzwhj/posts/" + id + "/" + size) };
            HttpResponseMessage responseMessage = await client.SendAsync(new HttpRequestMessage());
            if(responseMessage.IsSuccessStatusCode)
            {
                var content = await responseMessage.Content.ReadAsStringAsync();
                XmlDocument document = new XmlDocument();
                document.LoadXml(content);
                XmlNamespaceManager xmlNamespace = new XmlNamespaceManager(document.NameTable);
                xmlNamespace.AddNamespace("ns", "http://www.w3.org/2005/Atom");
                Page<BlogItem> page = new Page<BlogItem> (){ Index = id, Size = size, Items = new List<BlogItem>() };
                var countNode = document.SelectSingleNode("/ns:feed/ns:postcount", xmlNamespace);
                page.TotalCount = Convert.ToInt32(countNode.InnerText);
                page.TotalPage = (page.TotalCount + page.Size - 1) / page.Size;
                var blogsNode = document.SelectNodes("/ns:feed/ns:entry", xmlNamespace);
                foreach(XmlNode blog in blogsNode)
                {
                    var aa = blog["id"].InnerText;
                    page.Items.Add(new BlogItem
                    {
                        Id = Convert.ToInt32(blog["id"].InnerText),
                        Title = blog["title"].InnerText,
                        Summary = blog["summary"].InnerText,
                        Author = blog["author"].FirstChild.InnerText,
                        Published = Convert.ToDateTime(blog["published"].InnerText),
                        Views = Convert.ToInt32(blog["views"].InnerText),
                        Comments = Convert.ToInt32(blog["comments"].InnerText)
                    });
                }
                return View(page);
            }
            return RedirectToAction("Index", "Home");
        }

注意：因为使用的异步方法action变成了“IndexAsync”，因此给acion加上[ActionName("Index")]特性，让浏览器继续使用Index访问。

五、添加视图

在IndexAsync上右键添加视图。

注意因为action名称为“IndexAsync”，添加视图对话框中默认视图名为“IndexAsync”，由于咱们把action重命名为“Index”，因此这里视图名称要改为“Index”。添加视图后修改代码，把控制器传过来的分页数据用列表显示出来，代码也很简单，以下：

@model NineskyWeb.Models.Page<NineskyWeb.Models.BlogItem>

@{
    ViewBag.Title = "博客";
}

<nav aria-label="breadcrumb">
    <ol class="breadcrumb">
        <li class="breadcrumb-item"><a href="~/">首页</a></li>
        <li class="breadcrumb-item active" aria-current="page">博客</li>
    </ol>
</nav>

@foreach (var item in Model.Items)
{<div class="list-group mt-4">
        <a href="@Url.Action("Post","Blog",new {id= item.Id })" class="list-group-item list-group-item-action">
            <div class="d-flex w-100 justify-content-between">
                <h5 class="mb-1">@item.Title</h5>
                @*<small class="text-muted">3 days ago</small>*@
            </div>
            <hr />
            <p class="mb-1">@item.Summary</p>
            <small class="text-muted">
                posted:@item.Published  @item.Author 阅读 (@item.Views) 评论 (@item.Comments)
            </small>
        </a>
    </div>
}

<nav aria-label="">
    <ul class="pagination justify-content-end">
        <li class="page-item disabled">
            <a class="page-link" href="#" tabindex="-1" aria-disabled="true"> @Model.Index / @Model.TotalPage 页</a>
        </li>
        <li class="page-item">
            <a class="page-link" href="~/Blog" tabindex="-1" aria-disabled="true">首页</a>
        </li>

        @if (Model.Index > 1)
        {
            <li class="page-item"><a class="page-link" href="~/Blog/Index/@(Model.Index -1)">上一页</a></li>
        }

        @if (Model.Index < Model.TotalPage)
        {
            <li class="page-item"><a class="page-link" href="~/Blog/Index/@(Model.Index +1)">下一页</a></li>
        }
        <li class="page-item">
            <a class="page-link" href="~/Blog/Index/@Model.TotalPage">尾页</a>
        </li>
    </ul>
</nav>

按“F5”查看效果，以下图，自我感受还不错。

六、显示博客内容。

http://wcf.open.cnblogs.com/blog/post/body/{POSTID}

这个接口真简单，直接返回内容以下图。

这个调用干脆不作了。直接从列表哪儿跳到博客园吧，只须要改一下博客列表视图里面的连接地址就好了。

把红框里的地址改为：href="https://www.cnblogs.com/mzwhj/p/@(item.Id).html"，大功告成。

相关文章
相关标签/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公众号
   欢迎关注本站公众号,获取更多信息
联系我们 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程