SignalR 是一个开源的实时通信库，用于构建实时 Web 应用程序。它提供了一个简单的 API，可以在客户端和服务器之间建立持久连接，以便实时地推送数据。
与传统的 WebSocket 相比，SignalR 提供了更高级的功能和更简单的开发体验。下面是一些主要区别：
支持多种传输方式：SignalR 可以使用多种传输方式，包括 WebSocket、Server-Sent Events（SSE）、长轮询和 Forever Frame。这使得 SignalR 在不同的环境中都能提供实时通信的能力，即使某些浏览器不支持 WebSocket，也可以使用其他传输方式。
自动处理连接管理：SignalR 管理连接的生命周期，包括连接的建立、断开和重新连接。它会自动处理连接的失败和重新连接的逻辑，简化了开发人员的工作。
服务器端推送：SignalR 允许服务器端主动推送消息给客户端，而不需要客户端发起请求。这使得实时通信变得更加高效和实时，适用于聊天应用、实时监控等场景。
跨平台支持：SignalR 可以在多个平台上使用，包括 .NET、Java、JavaScript 等。这使得开发人员可以使用自己熟悉的语言和框架来构建实时应用程序。
微软官方提供了针对 ASP.NET Core Web 应用（Razor 页面）的详细教程，这里给出 MVC 版本入门教程。
最终将创建一个正常运行的聊天应用：
创建 Web 应用项目
添加 SignalR 客户端库
在“解决方案资源管理器”>中，右键单击项目，然后选择“添加”“客户端库”。
在“添加客户端库”对话框中：
“提供程序”选择“unpkg”
“库”，请输入 @microsoft/signalr@latest。
选择“选择特定文件”，展开“dist/browser”文件夹，然后选择 signalr.js 和 signalr.min.js。
点击“安装” 。
创建 SignalR Hubs 类
using Microsoft.AspNetCore.SignalR;
/// <summary>
/// Hub 类管理连接、组和消息
/// </summary>
public class ChatHub : Hub
{
/// <summary>
/// 可通过已连接客户端调用 SendMessage，以向所有客户端发送消息
/// </summary>
public async Task SendMessage(string user, string message)
{
// Clients.All 向所有的客户端发送消息
// ReceiveMessage 是客户端监听的方法
await Clients.All.SendAsync("ReceiveMessage", user, message);
}
}其父类 Hub 可管理连接、组和消息。这里演示的是向所有客户端发送消息。
配置 SignalR
打开 Program.cs，添加注入：
builder.Services.AddSignalR();添加路由：
app.MapHub<ChatHub>("/chatHub");添加 SignalR 客户端代码
视图页面：
<div class="container">
<div class="row p-1">
<div class="col-1">用户</div>
<div class="col-5"><input type="text" id="userInput" /></div>
</div>
<div class="row p-1">
<div class="col-1">消息</div>
<div class="col-5"><input type="text" class="w-100" id="messageInput" /></div>
</div>
<div class="row p-1">
<div class="col-6 text-end">
<input type="button" id="sendButton" value="发送消息" />
</div>
</div>
<div class="row p-1">
<div class="col-6">
<hr />
</div>
</div>
<div class="row p-1">
<div class="col-6">
<ul id="messagesList"></ul>
</div>
</div>
</div>
<script src="~/lib/microsoft/signalr/dist/browser/signalr.min.js"></script>
<script src="~/js/chat.js"></script>chat.js 文件：
"use strict";
var connection = new signalR.HubConnectionBuilder().withUrl("/chatHub").build();
// 在连接建立之前禁用发送按钮
document.getElementById("sendButton").disabled = true;
connection.on("ReceiveMessage", function (user, message) {
var li = document.createElement("li");
document.getElementById("messagesList").appendChild(li);
// 修改此处时应注意脚本注入问题
li.textContent = `${user} says ${message}`;
});
connection.start().then(function () {
document.getElementById("sendButton").disabled = false;
}).catch(function (err) {
return console.error(err.toString());
});
document.getElementById("sendButton").addEventListener("click", function (event) {
var user = document.getElementById("userInput").value;
var message = document.getElementById("messageInput").value;
connection.invoke("SendMessage", user, message).catch(function (err) {
return console.error(err.toString());
});
event.preventDefault();
});完成。在线示例：https://xoyozo.net/Demo/SignalRDemo
客户端：Failed to connect to host.
服务端：无任何日志
原因：可能是域名、IP 或端口有误，或端口未开放。
客户端/服务端：530 Login incorrect.
原因：用户名或密码错误。
客户端/服务端：503 Use AUTH first.
原因：服务端开启了 FTPS 协议（FTP over TLS），且禁止了 FTP 协议（plain FTP）。
解决方法：不建议服务端恢复不安全的 FTP 协议，客户端应配置 client.Config 的 EncryptionMode、DataConnectionEncryption、SslProtocols、ValidateCertificate 等参数。
客户端/服务端：530 This server does not allow plain FTP. You have to use FTP over TLS.
原因：服务端启用了 FTPS。
解决方法：给 client.Config.EncryptionMode 正确的赋值（FtpEncryptionMode.Explicit 或 FtpEncryptionMode.Auto）。
服务端：[Error] TLS session of data connection not resumed.
原因：证书版本有误。
解决方法：给 client.Config.SslProtocols 赋值正确的 TLS 版本。
服务端：521 PROT P required
原因：服务端开启了“Require TLS session resumption on data connection when using PROT P”
解决方法：client.Config.DataConnectionEncryption = true;
客户端/服务端：450 TLS session of data connection has not resumed or the session does not match the control connection
原因：TLS 与控制连接不匹配，即服务端开启了“Require TLS session resumption on data connection when using PROT P”
解决方法：我暂时还不知道原因，临时关闭了“Require TLS session resumption on data connection when using PROT P”（不建议）。该问题出现在 FileZilla Server 0.x 版本，在 1.x 版本中没有该配置选项。
解析域名（非网站域名）、挂载磁盘（若有另购）、修改实例名称、主机名
设置阿里云（重要）
远程连接进入 ECS（若解析未生效可以先用 IP）（若新服默认使用 3389 端口，可先在安全组临时放行 3389 端口）
开启 Windows 防火墙（使用推荐设置）
Windows 更新、并在高级选项中开启（更新 Windows 时接收其它 Microsoft 产品的更新）
安装 IIS：服务器管理器-添加角色和功能-勾选“Web 服务器(IIS)”包括管理工具
建议勾选：
默认已勾选项
按需安装 IP 和域限制
跟踪（即“失败请求跟踪”）
请求监视器、日志记录工具、
按需安装 ASP
按需安装 ASP.NET 4.8（会同时勾选 .NET Extensibility 4.8、ISAPI 扩展、ISAPI 筛选器）
按需安装 WebSocket 协议
应用程序初始化（建议安装）
管理服务（用于 Web 部署）
细节：设置任务栏；设置桌面图标；个性化-颜色-勾选“标题栏和窗口边框”；设置输入法；
下载 URL 重写（文件名：rewrite_amd64_zh-CN.msi）
下载 MySQL Connector/NET（文件名：mysql-connector-net-8.0.19.msi）
下载 ASP.NET Core 运行时 Hosting Bundle（文件名：dotnet-hosting-*.*.*-win.exe）
下载 .NET 桌面运行时 Windows x64（文件名：windowsdesktop-runtime-*.*.*-win-x64.exe）
下载 Web Deploy（文件名：WebDeploy_amd64_zh-CN.msi）
服务：设置“ASP.NET State Service”自动启动
IIS 日志：路径（如 D:\wwwlogs），每小时（统一设置一个全局的就行了，不需要设置每个网站），按需勾选“使用本地时间进行文件命名和滚动更新”
IIS 导入证书：个人、允许导出证书。参
设置默认网站的 https、设置默认网站跳转到指定网站。
设置权限：设置网站所在分区（如 D 盘），安全，添加 IIS_IUSRS，全部拒绝（防止跨站）
添加用户：为每个网站创建用户（既能防止跨站，又能跟踪进程），密码不能改、不过期，仅隶属于 IIS_IUSRS，并添加到每个网站的根目录，若用户创建失败看这里。
创建网站：设置访问物理路径的用户；设置应用程序池的“标识”用户；编辑绑定：勾选需要服务器名称指示；检查域名是否绑全；设置写入目录的用户权限；设置写入目录的“处理程序映射”取消“脚本”。
重复上面两步
检查所有网站用户是否仅隶属于 IIS_IUSRS（在“组”页面双击 Users 和 IIS_IUSRS 查看成员）
在应用程序池列表页面检查 CLR 版本、管托管道模式和标识；在网站列表页面检查绑定和路径
设置“IP 地址和域限制”
废弃旧服时再次检查：IIS 中各功能设置、hosts、安装的应用程序、启动项、任务计划程序、服务、防火墙等
接入 WAF
解析各网站域名
其它：资源管理器-选项-查看-去掉“始终显示图标，从不显示缩略图”前的勾
再次检查阿里云设置
在备份工具中添加该服务器的所有备份项
其它：到期日期提醒、
>> 关于域名解析
因各地域名解析生效时间不可控，一般国内域名 1 天内，国际域名 2 天内。
若网站数据库在 RDS、上传文件在 OSS，则解析 48 小时后直接停止原网站即可；（比较理想的）
文件上传到 ECS 的可使用 FTP 等工具定时同步文件，或直接停止原网站。（网友会遇到新文章中图片无法显示等问题）
还有一种方法是新网站提前解析一个备用域名，确保完全生效后再修改正式域名的解析，原网站无条件跳转到备用域名，如果数据库中有保存完整网址路径的，关闭原网站并解绑备用域名之后，进行批量替换。（缺点是可能会影响在搜索引擎的网站权重）
部分有定时器的网站要注意，如果两个网站的定时器都正常开启会导致意外的，需要停止其中一个网站的定时器。
当然每种方法都有优缺点，选择可以接受且方便的一种即可。
更多文章：
在 Vue 中，当你将一个布尔对象双向绑定到 radio 输入上时，确保 radio 的 value 属性仍然保持布尔类型是很重要的。如果 value 属性是字符串，那么 Vue 会将其解释为字符串而不是布尔值。以下是一个示例，演示如何正确地将布尔对象双向绑定到 radio 按钮，并确保 value 属性保持布尔类型：
<template>
<div>
<input type="radio" v-model="myBoolean" :value="true" /> True
<input type="radio" v-model="myBoolean" :value="false" /> False
<p>myBoolean: {{ myBoolean }}</p>
</div>
</template>
<script>
export default {
data() {
return {
myBoolean: false, // 布尔对象
};
},
};
</script>在这个示例中，我们使用了 v-model 指令将 myBoolean 属性与两个 radio 按钮进行了双向绑定。通过将 value 属性设置为 true 和 false，我们确保了 myBoolean 属性保持布尔类型。
这样，当用户选择其中一个 radio 按钮时，myBoolean 属性将保持布尔值而不是字符串。确保 value 属性的类型与要绑定的数据类型匹配，以确保绑定的数据类型保持一致。
同样的问题出现在 select 上也是一样：
<select v-model="cat.colorId" required>
<option :value="null">不选择</option>
<option v-for="color in colors" :value="color.id">{{color.name}}</option>
</select>Windows 11 家庭版在安装时不能直接选择离线帐户，只能使用微软帐户登录，无论有没有连网。
没有微软帐户的朋友也不用担心，可以注册一个。
实在不想注册的，也可以选择创建新帐号，名称生日随便填，在验证这步选择跳过即可。后面会让你设置一个 PIN 码，相当于登录密码。安装完成后，在设置中创建本地帐户。
不知道从哪个版本的 Chrome 或 Edge 开始，我们无法通过 ctrl+v 快捷键将时间格式的字符串粘贴到 type 为 date 的 input 框中，我们想办法用 JS 来实现。
方式一、监听 paste 事件：
const input = document.querySelector('input[type="date"]');
input.addEventListener('paste', (event) => {
input.value = event.clipboardData.getData('text');
});这段代码实现了从页面获取这个 input 元素，监听它的 paste 事件，然后将粘贴板的文本内容赋值给 input。
经测试，当焦点在“年”的位置时可以粘贴成功，但焦点在“月”或“日”上不会触发 paste 事件。
方式二、监听 keydown 事件：
const input = document.querySelector('input[type="date"]');
input.addEventListener('keydown', (event) => {
if ((navigator.platform.match("Mac") ? event.metaKey : event.ctrlKey) && event.key === 'v') {
event.preventDefault();
var clipboardData = (event.clipboardData || event.originalEvent.clipboardData);
input.value = clipboardData.getData('text');
}
});测试发现报错误：
Uncaught TypeError: Cannot read properties of undefined (reading 'getData')
Uncaught TypeError: Cannot read properties of undefined (reading 'clipboardData')
看来 event 中没有 clipboardData 对象，改为从 window.navigator 获取：
const input = document.querySelector('input[type="date"]');
input.addEventListener('keydown', (event) => {
if ((navigator.platform.match("Mac") ? event.metaKey : event.ctrlKey) && event.key === 'v') {
event.preventDefault();
window.navigator.clipboard.readText().then(text => {
input.value = text;
});
}
});缺点是需要用户授权：
仅第一次需要授权，如果用户拒绝，那么以后就默认拒绝了。
以上两种方式各有优缺点，选择一种适合你的方案就行。接下来继续完善。
兼容更多时间格式，并调整时区
<input type="date" /> 默认的日期格式是 yyyy-MM-dd，如果要兼容 yyyy-M-d 等格式，那么：
const parsedDate = new Date(text);
if (!isNaN(parsedDate.getTime())) {
input.value = parsedDate.toLocaleDateString('en-GB', { year: 'numeric', month: '2-digit', day: '2-digit' }).split('/').reverse().join('-');
}以 text 为“2023-4-20”举例，先转为 Date，如果成功，再转为英国时间格式“20-04-2023”，以“/”分隔，逆序，再以“-”连接，就变成了“2023-04-20”。
当然如果希望支持中文的年月日，可以先用正则表达式替换一下：
text = text.replace(/\s*(\d{4})\s*年\s*(\d{1,2})\s*月\s*(\d{1,2})\s*日\s*/, "$1-$2-$3");处理页面上的所有 <input type="date" />
const inputs = document.querySelectorAll('input[type="date"]');
inputs.forEach((input) => {
input.addEventListener(...);
});封装为独立域
避免全局变量污染，使用 IIFE 函数表达式：
(function() {
// 将代码放在这里
})();或者封装为函数，在 jQuery 的 ready 中，或 Vue 的 mounted 中调用。
在 Vue 中使用
如果将粘贴板的值直接赋值到 input.value，在 Vue 中是不能同步更新 v-model 绑定的变量的，所以需要直接赋值给变量：
<div id="app">
<input type="date" v-model="a" data-model="a" v-on:paste="fn_pasteToDateInput" />
{{a}}
</div>
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
<script>
const app = Vue.createApp({
data: function () {
return {
a: null,
}
},
methods: {
fn_pasteToDateInput: function (event) {
const text = event.clipboardData.getData('text');
const parsedDate = new Date(text);
if (!isNaN(parsedDate.getTime())) {
const att = event.target.getAttribute('data-model');
this[att] = parsedDate.toLocaleDateString('en-GB', { year: 'numeric', month: '2-digit', day: '2-digit' }).split('/').reverse().join('-');
}
},
}
});
const vm = app.mount('#app');
</script>示例中 <input /> 添加了 data- 属性，值同 v-model，并使用 getAttribute() 获取，利用 this 对象的属性名赋值。
如果你的 a 中还有嵌套对象 b，那么 data- 属性填写 a.b，方法中以“.”分割逐级查找对象并赋值
let atts = att.split('.');
let target = this;
for (let i = 0; i < atts.length - 1; i++) {
target = target[atts[i]];
}
this.$set(target, atts[atts.length - 1], text);经常有人碰到这样一种情况，我的 918+ 有 4 个硬盘呢，怎么空间很快就没了，最重要的是，自己查看统计了所有文件占用情况，和实际的占用空间不符。这个首先可以肯定的就是空间必然是文件占用了。但是呢，有些文件是不能从 File Station 里面直接看到的，所以很多用户就搞不懂了，有时候文件删除了，空间也不见增加。今天，就来教大家一个大招，让这些不能直接看到的文件无处遁形。
一、SSH 登陆群晖
这里我们要用到一个叫 putty 的软件
putty下载链接：点此下载
在开始之前，我们要开启群晖的 SSH 或是 telnet 服务功能（控制台 - 终端机和 SNMP - 勾选启动 SSH 功能）。
打开 putty，在主机名称输入群晖的局域网 IP 地址，然后点击下面的【打开】。
会弹出一个黑色的窗口。登入账号输入管理员：admin，按回车，然后输入 admin 的密码，要注意的是，输入密码的时候，光标是不会动的，你尽管输就行。有些用户看到代码就头疼，其实我们用到的都是些非常简单基础的命令代码，你只要照着这个步骤一步一步去做，肯定能成功，成功把空间腾出来后，你会很有成就感，哈哈！
切换到 root 权限，输入 sudo -i，按回车，然后也是输入 admin 的密码。
MAC 电脑用终端也可以登录 ：
打开终端
输入命令：ssh -p 999 admin@192.168.1.9
上面 999 为自定义端口号，admin 为自己的用户名
二、查询文件
到这里我们就登陆到群晖里面了，在这里可以执行命令。
输入 cd /volume1 命令后按回车，意思是进入存储空间 1（若您的储存空间为 2，则改成 volume2，依此类推）。
输入 du -ah --max-depth=1，可以查看当前目录文件大小，这个过程可能会需要数分钟到数小时不等，依您的文件数及空间大小而定。实测 8TB 机械硬盘耗时两个多小时。
三、删除文件
像上面图片中的 @download 就是 Download Station 的缓存文件，有时候操作不当，会造成缓存不能自动删除，这个时候就需要使用代码的方法来删除缓存，才能释放存储空间了。
比如要删除 Download Station 的缓存文件夹，就是上图的 @download 文件夹，可以使用下面这个命令：rm -rf /volume1/@download
这个命令要慎用，一旦删除就不能恢复了！
四、还有哪些文件占用存储空间而不能直接查询
除了 Download Station的缓存文件之外，还有 File Station 里面删除了文件，但启用了回收站，文件实际上还没彻底删除，也会造成删除文件，空间没有增加的情况。这个时候清空一下回收站即可。
清除某个文件夹回收站：
也可以直接一次性清空所有文件夹的回收站：
还有 Drive 的版本控制和 Drive本身自带的回收站；
@synologydrive/@sync/repo 是 Synology Drive Client 的缓存目录，我删除这个目录就释放了 5TB 的空间。
除此之外，还有 Cloud Station 保留的版本，Snapshot Replication 套件生成的快照文件等。
如果发现 /volume1/@synologydrive/@sync/repo/ 这个目录占用空间过大，请参考这篇文章。
群晖系统暂时没有类似 TreeSize 的磁盘文件管理工具，但是我们可以用磁盘映射的方式将群晖系统上的目录挂载到电脑上。这样，在电脑上就可以用 TreeSize 扫描群晖上的磁盘文件了。具体步骤如下：
一、群晖上安装 WebDAV Server
二、启用 WebDAV Server
三、新建群晖用户
千万要设置好权限。
切换到“应用程序”选项卡，关闭除 WebDAV Server 以外的所有应用程序
切换到“权限”选项卡，勾选需要访问的目录
四、在电脑上安装 RaiDrive
从官网下载，免费版即可。
五、配置 RaiDrive
打开 RaiDrive，点击顶部的“添加”，选择“NAS”，选择“Synology”，并填相应的地址和账户
技巧：将群晖提供的外部访问地址（在 控制面板-外部访问 中查看）直接在浏览器上打开，如果与群晖在同一局域网，那么会跳转到 https://[IP].[QuickConnect ID].direct.quickconnect.cn:5001/，那么参照这个地址填入到 RaiDrive 中即可在局域网中连接；如果不在同一局域网，那么会跳转到公网地址，同样可以将公网地址填入，但必须在路由器上映射端口才能在外网映射磁盘到 NAS。
六、访问文件
一切顺利，你就可以在“此电脑”中看到新建的盘符，像访问本地磁盘一样访问群晖文件。
