本文写于 2021 年 7 月。

WebBrowser 不能改用 Chrome 内核。

在 .NET Frameworks 和 .NET Core 年代，常用的第三方组件有：WebKit.NET、CefSharp 等。

而并未找到适用于 .NET 5 的成熟的 Chromium 内核的浏览器组件。

不过还是推荐一款微软官方出品的 WebView2，需要安装 Microsoft Edge Canary 才能正常运行。

喜欢“数据库优先”的朋友会发现，一旦 nuget 中将 MySql.Data 与 MySql.Data.EntityFramework 升级到版本超过 8.0.19，将无法正常打开 .edmx 文件进行从数据库更新模型。这个问题从 8.0.20 开始出现，在经过等待试验后续多个更新版本后，笔者认为 Oracle 官方不会再针对 8.0.20 及以后的版本支持可视化更新实体模型。

于是面临两个选择：退回到 8.0.19 版本，或使用其它数据库连接组件（如 Pomelo）。

使用其它组件将会更改映射的属性名称，对 Include 延时加载等机制也会发生改变，对于代码量比较大的项目修改成本还是比较大的。那么用回 8.0.19 呢？

在服务器上卸载 8.0.20+ 版本的 mysql-connector-net，安装 8.0.19 版本，重启 IIS 或重启服务器。

项目中，MySql.Data 与 MySql.Data.EntityFramework 也降至 8.0.19，发布后发现，仍然提示：

未能加载文件或程序集“MySql.Data.EntityFramework, Version=8.0.19.0, Culture=neutral, PublicKeyToken=c5687fc88969c44d”或它的某一个依赖项。找到的程序集清单定义与程序集引用不匹配。 (异常来自 HRESULT:0x80131040)

几个月来，我一直认为是服务器上的高版本 mysql-connector-net 没有卸载干净，今天才发现原因是新发布的项目 bin 目录中的 MySql.Data.EntityFramework.dll 版本号仍然高于 8.0.19。手动替换成 8.0.19 后可正常访问。

既然 NuGet 已经将 MySql.Data.EntityFramework 的版本降至 8.0.19，而且 web.config 中所有的版本号也都一致，解决方案的 packages 目录下的也只有 MySql.Data.EntityFramework.8.0.19 这一个版本，甚至连项目源代码中的 bin 目录下的该文件版本也是 8.0.19，可发布后的 MySql.Data.EntityFramework.dll 版本却仍高于 8.0.19？

于是在解决方案中找到以下路径：

\obj\Release\Package\PackageTmp\bin\MySql.Data.EntityFramework.dll

重新发布时，这个文件并没有按照 NuGet 中的版本来覆盖，因此只需要在发布前删除整个 \obj\ 目录再次发布即可解决问题。

报错：

HTTP Error 500.30 - ASP.NET Core app failed to start

Common solutions to this issue:

• The app failed to start

• The app started but then stopped

• The app started but threw an exception during startup

Troubleshooting steps:

• Check the system event log for error messages

• Enable logging the application process' stdout messages

• Attach a debugger to the application process and inspect

For more information visit: https://go.microsoft.com/fwlink/?LinkID=2028265

解决：

直接运行网站根目录的 .exe 启动文件可以找到答案。

一个常见的原因是：因 nuget 包升级（特别是需要服务器端安装组件的包）导致的发布后仍然是低版本的包，删除项目中的 /obj/ 目录重新发布即可。

这个现象在国产浏览器上使用极速内核时出现，原因是百度编辑器上传图片功能通过 <form /> 提交到 <iframe /> 时，因跨域导致 cookie 丢失。

ASP.NET 的 ASP.NET_SessionId 默认的 SameSite 属性值为 Lax，将其设置为 None 即可：

protected void Session_Start(object sender, EventArgs e)
{
    // 解决在部分国产浏览器上使用百度编辑器上传图片时（iframe），未通过 cookie 传递 ASP.NET_SessionId 的问题
    string ua = Request.UserAgent ?? "";
    var browsers = new string[] { "QQBrowser/" /*, "Chrome/" 不要直接设置 Chrome，真正的 Chrome 会出现正常页面不传递 Cookie 的情况 */ };
    bool inWeixin = ua.Contains("MicroMessenger/"); // 是否在微信中打开（因微信PC端使用QQ浏览器内核，下面的设置会导致其网页授权失败）
    if (browsers.Any(c => ua.Contains(c)) && !inWeixin)
    {
        Response.Cookies["ASP.NET_SessionId"].SameSite = SameSiteMode.None;
    }
}

以上代码加入到 Global.asax 的 Session_Start 方法中，或百度编辑器所在页面。

注意一：SameSite=None 时会将父页面的 cookie 带入到 iframe 子页的请求中，从而导致 cookie 泄露，请确保项目中无任何站外引用，如网站浏量统计器、JS组件远程CDN等！

注意二：微信PC版的内嵌浏览器使用QQ浏览器内核，以上代码会导致其微信网页授权不能正常执行。

// 控制组件
map.addControl(new T.Control.MapType());
// 切换到“地图”视图
map.setMapType(TMAP_NORMAL_MAP);
// 切换到“卫星”视图
map.setMapType(TMAP_SATELLITE_MAP);
// 切换到“卫星混合”视图
map.setMapType(TMAP_HYBRID_MAP);

Unify Template 提供三种文件上传样式（如上图），“Plain File Input”和“File input”使用传统 <form /> 提交，“Advanced File input”调用组件实现。

ASP.NET Core 实现传统 <form /> 提交（以“Plain File Input”为例）：

<form class="g-brd-around g-brd-gray-light-v4 g-pa-30 g-mb-30" id="form_avatar_upload" asp-action="AvatarUpload" enctype="multipart/form-data" method="post">
    <!-- Plain File Input -->
    <div class="form-group mb-0">
        <p>Plain File Input</p>
        <label class="u-file-attach-v2 g-color-gray-dark-v5 mb-0">
            <input id="fileAttachment" name="Avatar" type="file" onchange="form_avatar_upload.submit()">
            <i class="icon-cloud-upload g-font-size-16 g-pos-rel g-top-2 g-mr-5"></i>
            <span class="js-value">Attach file</span>
        </label>
    </div>
    <!-- End Plain File Input -->
</form>

public class AvatarUploadModel
{
    public IFormFile Avatar { get; set; }
}

[HttpPost]
public IActionResult AvatarUpload(AvatarUploadModel Item)
{
    return RedirectToAction("");
}

ASP.NET Core 调用 HSFileAttachment 组件实现：

<div class="form-group mb-20">
    <label class="g-mb-10">上传作品文件（包）</label>
    <input class="js-file-attachment_project" type="file" name="" id="file_project">
    <div style="display: none;" id="file_project_tip">
        <div class="u-file-attach-v3 g-mb-15" id="file_project_tip_content">
            <h3 class="g-font-size-16 g-color-gray-dark-v2 mb-0">拖曳文件到此处或者 <span class="g-color-primary">浏览你的电脑</span></h3>
            <p class="g-font-size-14 g-color-gray-light-v2 mb-0">
                如果您的作品包含多个文件，请添加到压缩包再上传
            </p>
            <p class="g-font-size-14 g-color-gray-light-v2 mb-0">
                支持的文件格式：
                <code>zip</code>
                <code>rar</code>
                <code>7z</code>
                <code>psd</code>
                <code>ai</code>
                <code>cdr</code>
                <code>jpg</code>
                <code>png</code>
                <code>gif</code>
                <code>tif</code>
                <code>webp</code>
            </p>
            <p class="g-font-size-14 g-color-gray-light-v2 mb-0">文件（包）的大小不能超过 <span>@options.Value.MaxSizeOfSigleFile_MB</span> MB</p>
        </div>
    </div>
    <small class="form-control-feedback">请上传作品文件</small>
</div>

<!-- JS Implementing Plugins -->
<script src="//cdn.***.com/unify/unify-v2.6.2/html/assets/vendor/jquery.filer/js/jquery.filer.min.js"></script>
<!-- JS Unify -->
<script src="//cdn.***.com/unify/unify-v2.6.2/html/assets/js/helpers/hs.focus-state.js"></script>
<script src="//cdn.***.com/unify/unify-v2.6.2/html/assets/js/components/hs.file-attachement.js"></script>
<!-- JS Plugins Init. -->
<script>
    $(document).on('ready', function () {
        // initialization of forms
        $.HSCore.components.HSFileAttachment.init('.js-file-attachment_project', {
            changeInput: $('#file_project_tip').html(),
            uploadFile: {
                url: url_UploadFile,
                data: { type: 'project' },
                success: function (data, element) {
                    console.log(data);

                    if (!data.success) {
                        var parent = element.find(".u-progress-bar-v1").parent();
                        element.find(".u-progress-bar-v1").fadeOut("slow", function () {
                            $("<div class=\"text-error g-px-10\"><i class=\"fa fa-minus-circle\"></i> Error</div>").hide().appendTo(parent).fadeIn("slow");
                        });

                        alert(data.err_msg);
                    } else {
                        var parent = element.find(".u-progress-bar-v1").parent();
                        element.find(".u-progress-bar-v1").fadeOut("slow", function () {
                            $("<div class=\"text-success g-px-10\"><i class=\"fa fa-check-circle\"></i> Success</div>").hide().appendTo(parent).fadeIn("slow");
                        });

                        $('#file_project_tip_content').slideUp();

                        upload_project_id = data.id;
                    }
                }
            }
        });
        $.HSCore.helpers.HSFocusState.init();
    });
</script>

public IActionResult UploadFile([FromForm(Name = "[]")]IFormFile file, string type)
{
    return Ok(new { id = 1 });
}

nuget 安装组件：MetadataExtractor

从文件流读取文件信息：

public IActionResult UploadFile([FromForm(Name = "[]")]IFormFile file)
{
    var md = ImageMetadataReader.ReadMetadata(file.OpenReadStream());
    var dic = new Dictionary<string, string>();
    foreach (var m in md)
    {
        foreach (var t in m.Tags)
        {
            dic.Add(m.Name + " - " + t.Name, t.Description);
        }
    }
    return Ok(dic);
}

结果演示：

从结果中可以看到计算的尺寸、拍摄设备、拍摄时间等信息。

MetadataExtractor 是一个简单而轻便的库，用于从图像和视频文件中读取元数据。

MetadataExtractor 从 JPEG、TIFF、WebP、PSD、PNG、BMP、GIF、ICO、PCX 和相机 RAW 文件读取 Exif、IPTC、XMP、ICC、Photoshop、WebP、PNG、BMP、GIF、ICO、PCX 元数据。

此外，还支持 MOV 和相关的 QuickTime 视频格式，例如 MP4、M4V、3G2、3GP。

相机制造商特定的支持包括爱克发，佳能，卡西欧，DJI，爱普生，富士胶片，柯达，京瓷，徕卡，美能达，尼康，奥林巴斯，松下，宾得，Recononyx，三洋，Sigma / Foveon 和索尼型号。

本教程教你如何升级 ASP.NET 项目中的 MySql.Data 和服务器安装的 Connector/NET 版本至 8.0.18。

使用 MySQL Application Configuration 升级 MySql.Data

双击打开 .edmx 文件后，解决方案资源管理器上会有 MySQL Application Configuration 的图标。（如果没有，点开“从数据库更新模型”一下即可）

勾选“Use MySQL with Entity Framework”，安装完成。

完成后发现，Nuget 中会自动安装或升级下面两个组件：

MySql.Data  8.0.18

MySql.Data.EntityFramework  8.0.18

并且在 Web.config 中会自动添加以下节点：

<system.data>
  <DbProviderFactories>
    <remove invariant="MySql.Data.MySqlClient" />
    <add name="MySQL Data Provider" invariant="MySql.Data.MySqlClient" description=".Net Framework Data Provider for MySQL" type="MySql.Data.MySqlClient.MySqlClientFactory, MySql.Data, Version=8.0.18, Culture=neutral, PublicKeyToken=c5687fc88969c44d" />
  </DbProviderFactories>
</system.data>

这段代码使 MySql.Data 8.0.18 的项目能够兼容运行在 Connector/NET 6.10.x 环境中。方便我们挨个升级服务器上的项目。

8.0.18 已经不再需要 MySql.Data.Entity 组件了，可以从 Nuget 中手动卸载。

Nuget 安装：X.PagedList.Mvc.Core

控制器：

using X.PagedList;

public IActionResult Index(int page = 1)
{
    ……
    return View(q.ToPagedList(page, size));
}

视图：

@using X.PagedList
@using X.PagedList.Mvc.Core
@model IPagedList<xxx>

@Html.PagedListPager(Model, page => Url.Action("Index", new { page }))

自定义（options 默认值）：

@Html.PagedListPager(
    Model, 
    page => Url.Action("Index", new { page }), 
    new X.PagedList.Mvc.Common.PagedListRenderOptionsBase
    {
        HtmlEncoder = HtmlEncoder.get_Default(),
        DisplayLinkToFirstPage = PagedListDisplayMode.IfNeeded,
        DisplayLinkToLastPage = PagedListDisplayMode.IfNeeded,
        DisplayLinkToPreviousPage = PagedListDisplayMode.IfNeeded,
        DisplayLinkToNextPage = PagedListDisplayMode.IfNeeded,
        DisplayLinkToIndividualPages = true,
        DisplayPageCountAndCurrentLocation = false, // 显示总页数和当前页码
        MaximumPageNumbersToDisplay = 10, // 最多显示页码数
        DisplayEllipsesWhenNotShowingAllPageNumbers = true,
        EllipsesFormat = "…",
        LinkToFirstPageFormat = "<<",
        LinkToPreviousPageFormat = "<",
        LinkToIndividualPageFormat = "{0}",
        LinkToNextPageFormat = ">",
        LinkToLastPageFormat = ">>",
        PageCountAndCurrentLocationFormat = "Page {0} of {1}.",
        ItemSliceAndTotalFormat = "Showing items {0} through {1} of {2}.",
        FunctionToDisplayEachPageNumber = null,
        ClassToApplyToFirstListItemInPager = null,
        ClassToApplyToLastListItemInPager = null,
        ContainerDivClasses = new string[1]
        {
            "pagination-container"
        },
        UlElementClasses = new string[1]
        {
            "pagination"
        },
        LiElementClasses = Enumerable.Empty<string>(),
        PageClasses = Enumerable.Empty<string>(),
        UlElementattributes = null,
        ActiveLiElementClass = "active",
        EllipsesElementClass = "PagedList-ellipses",
        PreviousElementClass = "PagedList-skipToPrevious",
        NextElementClass = "PagedList-skipToNext",
    })

保留地址栏参数：

@{ 
    string query = Context.Request.QueryString.Value;
}
@Html.PagedListPager(Model, page => Regex.IsMatch(query, @"[?&]page=\d+")
    ? Regex.Replace(query, @"([?&])page=\d+", $"$1page={page}")
    : (query.StartsWith("?") ? $"{query}&page={page}" : $"{query}?page={page}"),
    new X.PagedList.Web.Common.PagedListRenderOptionsBase
    {
        DisplayPageCountAndCurrentLocation = true,
        MaximumPageNumbersToDisplay = 5,
    })

这里从查询字符串中判断并替换 page 值，如果有更简单的方法敬请告知。比如 Webdiyer 的分页组件会自动携带所有参数。

更多使用方式参官方文档：https://github.com/dncuug/X.PagedList

附应用于 Unify Template（一款基于 Bootstrap 的 HTML 模板）中的配置：

<style>
    .u-pagination-v1-1--active .u-pagination-v1-1 { color: #fff; border-color: #72c02c; }
    .PagedList-pageCountAndLocation { float: right !important; }
</style>
@{
    string query = Context.Request.QueryString.Value;
}
@Html.PagedListPager(Model, page => Regex.IsMatch(query, @"[?&]page=\d+")
    ? Regex.Replace(query, @"([?&])page=\d+", $"$1page={page}")
    : (query.StartsWith("?") ? $"{query}&page={page}" : $"{query}?page={page}"),
    new X.PagedList.Web.Common.PagedListRenderOptionsBase
    {
        DisplayPageCountAndCurrentLocation = true,
        MaximumPageNumbersToDisplay = 5,
        UlElementClasses = new string[] { "list-inline" },
        LiElementClasses = new string[] { "list-inline-item" },
        PageClasses = new string[] { "u-pagination-v1__item", "u-pagination-v1-1", "g-pa-7-14" },
        ActiveLiElementClass = "u-pagination-v1-1--active",
        EllipsesElementClass = "g-pa-7-14",
    })