ASP.NET Core SignalR案例：导入英汉词典

Ecdict

1. 下载词典文件stardict.7z，解压，stardict.csv是一个CSV格式的文本文件，文件的第一行是表头，除第一行外，其他每行文本是一个单词的相关信息，用逗号分隔的就是各个列的值。
2. 英汉词典ECDICT中导入单词到数据库。
3. T_WordItems：Id（主键）、Word（单词）、Phonetic（音标）、Definition（英文解释），Translation（中文翻译）

https://github.com/skywind3000/ECDICThttps://github.com/skywind3000/ECDICT

实现

1. ImportExecutor中注入IHubContext<ImportDictHub>等服务。
2. 暂时用字符串Split解析CSV，或者用更专业的库。
3. 用SqlBulkCopy 进行分批快速导入：

Program.cs

builder.Services.AddSignalR();

string[] urls = new[] { "http://localhost:5173" };
builder.Services.AddCors(options =>
    options.AddDefaultPolicy(builder => builder.WithOrigins(urls)
    .AllowAnyMethod().AllowAnyHeader().AllowCredentials()));

builder.Services.AddScoped<ImportExecutor>();

app.MapHub<ImportHub>("/ImportHub");

ImportExecutor.cs

public class ImportExecutor
{
    private readonly IHubContext<ImportHub> hubContext;

    public ImportExecutor(IHubContext<ImportHub> hubContext)
    {
        this.hubContext = hubContext;
    }

    public async Task ExecuteAsync(string connectionId)
    {
        string[] lines = await File.ReadAllLinesAsync(@"F:\Demo\stardict\stardict.csv");
        int totalCount = lines.Length - 1;
        string connStr = "Data Source=.;Initial Catalog=demo;Integrated Security=SSPI;TrustServerCertificate=true";
        SqlBulkCopy bulkCopy = new SqlBulkCopy(connStr);
        bulkCopy.DestinationTableName = "T_WordItems";
        bulkCopy.ColumnMappings.Add("Word", "Word");
        bulkCopy.ColumnMappings.Add("Phonetic", "Phonetic");
        bulkCopy.ColumnMappings.Add("Definition", "Definition");
        bulkCopy.ColumnMappings.Add("Translation", "Translation");
        int counter = 0;

        using DataTable dataTable = new DataTable();
        dataTable.Columns.Add("Word");
        dataTable.Columns.Add("Phonetic");
        dataTable.Columns.Add("Definition");
        dataTable.Columns.Add("Translation");
        foreach (var item in lines)
        {
            string[] str = item.Split(',');
            string word = str[0];
            string? phonetic = str[1];
            string? definition = str[2];
            string? translation = str[3];
            DataRow row = dataTable.NewRow();
            row["Word"] = word;
            row["Phonetic"] = phonetic;
            row["Definition"] = definition;
            row["Translation"] = translation;
            dataTable.Rows.Add(row);
            counter++;
            Console.WriteLine($"已加载{counter}");
            if (dataTable.Rows.Count == 100)
            {
                await bulkCopy.WriteToServerAsync(dataTable);
                dataTable.Clear();
            }
            await hubContext.Clients.Client(connectionId).SendAsync("ImportProgress",totalCount,counter);
        }
        await bulkCopy.WriteToServerAsync(dataTable);
        await hubContext.Clients.Client(connectionId).SendAsync("ImportProgress", totalCount, counter);
    }
}

ImportEcdict.cs

public class ImportHub : Hub
{
    private readonly ImportExecutor importExecutor;

    public ImportHub(ImportExecutor importExecutor)
    {
        this.importExecutor = importExecutor;
    }

    public Task ImportEcdict()
    {
        _ = importExecutor.ExecuteAsync(this.Context.ConnectionId);
        return Task.CompletedTask;
    }
}

Vue

<template>
  <div>
    <input type="button" value="导入" v-on:click="importEcdict">
    <progress :value="state.importedCount" :max="state.totalCount"></progress>
    <span>{{ state.importedCount }},{{ state.totalCount }}
      {{ ((state.importedCount / state.totalCount)*100).toFixed(2)}}%</span>
  </div>
</template>

<script>
import { reactive, onMounted } from 'vue';
import * as signalR from '@microsoft/signalr';
import axios from 'axios';

let connection;
export default {
  name: 'Login',
  setup() {
    //创建响应式对象
    const state = reactive({ importedCount: 0, totalCount: 0 });

    onMounted(async function () {
      startConn()
    })

    //SignalR连接
    const startConn = async function () {
      const transport = signalR.HttpTransportType.WebSockets;
      const options = { skipNegotiation: true, transport: transport };
      connection = new signalR.HubConnectionBuilder()
        .withUrl('https://localhost:7222/ImportHub', options)
        .withAutomaticReconnect().build();
      try {
        await connection.start();
      } catch (err) {
        alert(err);
        return;
      }
      //接收消息
      connection.on('ImportProgress', (totalCount, counter) => {//监听服务器端发送过来的信息
        state.importedCount = counter;
        state.totalCount = totalCount
      });
    }
    //导入
    const importEcdict = async function (e) {
      await connection.invoke("ImportEcdict");
      // alert("启动导入")
    }


    //返回响应式对象和方法
    return { state, importEcdict };
  }
}
</script>