背景

我在业余时间开发了一款自己的独立产品：升讯威在线客服与营销系统。这个系统的核心后台主程序，在最早期是完全没有页面，经常有朋友部署之后，一访问是 404，以为没有部署成功。我一看这肯定不行啊，可后台主程序是一个 Web Api 项目，没有页面，怎么办呢？

1.x 的实现方式

通过 Web Api 接口，直接返回字符串

于是我通过 Web Api 接口，输出一些基本的状态信息，如下：

namespace Sheng.Linkup.Server.Controllers

{

    [ApiController]

    public class StatusController : ControllerBase

    {

       [HttpGet]

       public string Get()

       {

            //在此输出基本状态信息

            string msg = "升讯威在线客服与营销系统 （私有化部署版）";

            msg += "https://kf.shengxunwei.com";

            return msg;

       }

    }

}

这种方式好歹解决了有和无的问题，一直坚持使用了很久。直到最近，因为一个客户的定制化需求，需要为主程序加入一特殊的状态页面和运维功能。

2.x 的实现方式

引入 Bootstrap 相关包，添加美观的，可交互的启动页面

先看看效果，是不是比 1.x 的效果好太多了呢。虽然是一个 Web Api 项目，但是也可以提供美观的页面。

实现方式

要在 Web Api 中添加页面，首先我们在 Bootstrip 的官网，下载它最新的开发包。然后将其添加到我们的项目文件中。

我们在项目根目录下，添加一个 html 文件夹，然后建立一个 Bootstrip 子文件夹，把官网下载到的文件全部放进去。

第二步我们在 Program.cs 中，引入新建的 wwwroot 目录，并开启它的静态文件访问功能。

 String wwwrootFiles = Path.Combine(Directory.GetCurrentDirectory(), "wwwroot");

 app.UseStaticFiles(new StaticFileOptions

 {

     FileProvider = new PhysicalFileProvider(wwwrootFiles),

     RequestPath = "/"

 });

最后，我们把开发好的状态显示页面，放在 html 文件夹中：

这里给出一个页面代码示例：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>客服系统状态</title>

    <style>

        body {

            font-family: Arial, sans-serif;

            background-color: #f4f4f4;

            text-align: center;

        }

        h1 {

            color: #333;

        }

       .status-box {

            border: 1px solid #ccc;

            border-radius: 5px;

            padding: 20px;

            width: 300px;

            margin: 0 auto;

            background-color: white;

            box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);

        }

    </style>

</head>

<body>

    <h1>程序运行状态</h1>

    <div class="status-box">

        <p>当前状态：<span id="status-text">正在运行</span></p>

    </div>

</body>

</html>

按下 Visual Studio 的启动项目按钮，就能看到我们的默认启动页面了。

整个过程可以说非常的简单和方便。这样，即使是 Web Api 项目，你也可以为用户提供非常清晰美观的状态显示页面了。

简介下这个 .net 开发的客服系统

100% 私有化部署在您的自有服务器，可全天候 7 × 24 小时挂机运行，不掉线不丢消息，欢迎实测。

https://kf.shengxunwei.com/

希望能够打造： 开放、开源、共享。努力打造 .net 社区的一款优秀开源产品。

钟意的话请给个赞支持一下吧，谢谢~

如何为在线客服系统的 Web Api 后台主程序添加 Bootstrap 启动页面的更多相关文章

  1. 使用 WPF+ ASP.NET MVC 开发 在线客服系统 （一）

    近段时间利用业余时间开发了一套在线客服系统,期间遇到过大大小小不少问题,好在都一一解决,最终效果也还可以,打算写一个系列的文章把开发过程详细的记录下来. 希望能够和更多的开发人员互相交流学习,也希望有 ...

  2. Vue在线客服系统【开源项目】

    1. 项目介绍 一个基于Vue2.0的在线客服系统. 技术栈包含:Vue.VueX.Vue Router.Element UI. 2. 功能介绍 项目包含了2个模块:客服端和访客端. 2.1 客服端功 ...

  3. .net core 和 WPF 开发升讯威在线客服系统【私有化部署免费版】发布

    希望 .net 和 WPF 技术时至今日,还能有一些存在感. 这个项目源于2015年前后,当时开发的初版,我使用了 ASP.NET MVC 做为后端,数据库使用原生 ADO.NET 进行操作.WPF ...

  4. CentOS 30分钟部署 .net core 在线客服系统

    前段时间我发表了一系列文章,开始介绍基于 .net core 的在线客服系统开发过程.期间有一些朋友希望能够给出 Linux 环境的安装部署指导,本文基于 CentOS 8.3 来安装部署.在本文中我 ...

  5. Linux + .net core 开发升讯威在线客服系统：首个经过实际验证的高性能版本

    业余时间用 .net core 写了一个在线客服系统.并在博客园写了一个系列的文章,写介绍这个开发过程: .net core 和 WPF 开发升讯威在线客服系统:目录 https://blog.she ...

  6. 使用 WPF + Chrome 内核实现 在线客服系统 的复合客服端程序

    本系列文章详细介绍使用 .net core 和 WPF 开发 升讯威在线客服与营销系统 的过程.本产品已经成熟稳定并投入商用. 免费使用 & 私有化部署免费下载:https://docs.sh ...

  7. .net core 和 WPF 开发升讯威在线客服系统：调用百度翻译接口实现实时自动翻译

    业余时间用 .net core 写了一个在线客服系统.并在博客园写了一个系列的文章,写介绍这个开发过程. 我把这款业余时间写的小系统丢在网上,陆续有人找我要私有化版本,我都给了,毕竟软件业的初衷就是免 ...

  8. .net core 和 WPF 开发升讯威在线客服系统：调用有道翻译接口实现实时自动翻译的方法

    业余时间用 .net core 写了一个在线客服系统.并在博客园写了一个系列的文章,写介绍这个开发过程. 我把这款业余时间写的小系统丢在网上,陆续有人找我要私有化版本,我都给了,毕竟软件业的初衷就是免 ...

  9. Linux 运行升讯威在线客服系统：同时支持 SQL Server 和 MySQL 的实现方法

    前段时间我发表了一系列文章,开始介绍基于 .net core 的在线客服系统开发过程. 有很多朋友一直提出希望能够支持 MySQL 数据库,考虑到已经有朋友在用 SQL Server,我在升级的过程中 ...

  10. 详解升讯威在线客服系统前端 JavaScript 脚本加密技术（1）

    我在业余时间开发维护了一款免费开源的升讯威在线客服系统,也收获了许多用户.对我来说,只要能获得用户的认可,就是我最大的动力. 这段时间有几个技术小伙伴问了我一个有意思的问题:"你的前端脚本是 ...

随机推荐

  1. Serilog文档翻译系列（五） - 编写日志事件

    日志事件通过 Log 静态类或 ILogger 接口上的方法写入接收器.下面的示例将使用 Log 以便语法简洁,但下面显示的方法同样可用于接口. Log.Warning("Disk quot ...

  2. [TK] 理想的正方形

    题目描述 有一个整数组成的矩阵,现请你从中找出一个指定边长的正方形区域,使得该区域所有数中的最大值和最小值的差最小. 题目分析 其实这道题和滑动窗口很像,而滑动窗口使用优先队列解决. 我们都知道优先队 ...

  3. 2023年3月中国数据库行业分析报告正式发布，带你了解NL2SQL技术原理

    为了帮助大家及时了解中国数据库行业发展现状.梳理当前数据库市场环境和产品生态等情况,从2022年4月起,墨天轮社区行业分析研究团队出品将持续每月为大家推出最新<中国数据库行业分析报告>,持 ...

  4. 银河麒麟、中标麒麟学习实操资料汇总（含V4、V7、V10）

    数据库和操作系统关系十分密切,因为数据库是运行于操作系统上的一个管理数据的应用.在数据库国产化替代的浪潮之下,一批批国产操作系统也崭露头角.墨天轮社区便选取了中国操作系统排行榜上排名靠前的麒麟软件,依 ...

  5. vue前端开发仿钉图系列（4）右侧行政区绘制的开发详解

    行政区绘制是基于高德地图的api,需要在高德提供的代码基础上做好html代码在vue页面上的适配.核心功能就是选择省市区,可以根据需要绘制对应选中的地图图层.整理总结不易,如需全部代码,请联系我150 ...

  6. iOS工厂模式使用小结

    一.什么是工厂方法? 正式的解释是:在基类中定义创建对象的一个接口,让子类决定实例化哪个类.工厂方法让一个类的实例化延迟到子类中进行.工厂方法要解决的问题是对象的创建时机,它提供了一种扩展的策略,很好 ...

  7. dotnet 使用自定义特性

    namespace TETTD.Common { /// <summary> /// 导入excel特性 标记字段映射的列 /// </summary> [AttributeU ...

  8. 牛逼！5K star! 推荐一款集监控和埋点于一体的前端性能监控工具！开源、简单易用、功能强大！

    在互联网的快速发展下,网站已成为企业和个人展示信息.提供服务的重要平台.然而,随之而来的网站性能问题也日益凸显,如加载速度慢.频繁出错.服务器故障.数据异常.网络攻击等.如何确保用户能够快速稳定地访问 ...

  9. Linux环境下的mysql安装

    MySQL8.0.26-Linux版安装 1.准备一台Linux服务器 云服务器或者虚拟机都可以; Linux的版本为 Centos7; 2.下载Linux版MySQL安装包 https://down ...

  10. .NET 8.0 开源在线考试系统（支持移动端）

    前言 推荐一款基于.NET 8.0 免费开源跨平台在线考试系统,系统不仅支持桌面端,还特别优化了移动端的用户体验. 通过本系统可以轻松搭建自己的在线考试平台,实现随时随地的测试与评估. 本文将详细介绍 ...