背景

我在业余时间开发了一款自己的独立产品:升讯威在线客服与营销系统。这个系统的核心后台主程序,在最早期是完全没有页面,经常有朋友部署之后,一访问是 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. 提升软件测试效率与灵活性:探索Mock测试的重要性

    Mock测试是测试过程中的一种方法,用于替代那些难以构造或获取的对象,通过创建虚拟对象来进行测试.所谓难以构造的对象如何理解呢? 举例来说,像HttpServletRequest这样的对象需要在具有s ...

  2. 基于DPAPI+RDP技术实现本地打开远程程序,并映射到本地机器桌面上

    本教程使用工具所使用的环境说明: 启动器开发工具:VS2022 启动器所用客户端技术:.NET 8 + WPF 启动器其他技术:DPAPI 启动器发布的可执行程序,系统要求:Windows 7以及以上 ...

  3. debian 12 编译 vlc/libvlc 支持 rtsp

    debian 官方从11开始,不再提供支持 rtsp 的 VLC deb 包,通过 libvlc 播放 rtsp 也无法实现,因此需要自己编译. # 安装编译环境,编译依赖库以及 contrib 第三 ...

  4. 4.1 数列的概念2 (递推公式、前n项和)

    \({\color{Red}{欢迎到学科网下载资料学习 }}\) [ [基础过关系列]高二数学同步精品讲义与分层练习(人教A版2019)] ( https://www.zxxk.com/docpack ...

  5. 图像形态学操作(cv2库实现)

    #coding:utf-8 import SimpleITK as sitk import numpy as np import cv2 # 膨胀 def dilateion(image): kern ...

  6. springboot2.X动态修改log4j2日志级别

    利用springboot提供的 spring-boot-starter-actuator 包可以实现动态修改log4j2日志级别的功能 添加依赖 添加依赖包 <dependency> &l ...

  7. CSP模拟10--总结

    今天是我第一次给模拟赛写正规总结--因为今天的题真的受不了了 四道数学题,一点都不拖泥带水的纯血数学题! T1.黑暗型高松灯 shit 本来是一道放在T4防AK的题,结果学长为了 恶心 锻炼一下我们, ...

  8. 探索 Kubernetes 持久化存储之 Rook Ceph 初窥门径

    在 Kubernetes 生态系统中,持久化存储是支撑业务应用稳定运行的基石,对于维护整个系统的健壮性至关重要.对于选择自主搭建 Kubernetes 集群的运维架构师来说,挑选合适的后端持久化存储解 ...

  9. Notification Manager 2.0.0 发布:新增飞书通知、通知路由、通知静默

    Notification Manager 是 KubeSphere 可观测团队开源的一款 Kubernetes 平台上的多租户通知管理系统,其从 Kubernetes 接收告警.事件.审计,根据用户设 ...

  10. 根据字符串,获取实体属性上的annotation,如:createTime” 找到对应实体属性中的 TableField(value = "create_time", fill = FieldFill.INSERT)

    根据字符串,获取实体属性上的annotation,如:createTime" 找到对应实体属性中的 TableField(value = "create_time", f ...