博客 (203)

驾驶自动化等级与划分要素的关系

摘自：《汽车驾驶自动化分级》（GB/T 40429-2021）

部分车企驾驶安全与辅助、智能领航和泊车辅助系统简介

问界

        新M5 全系搭载华为高阶智能驾驶系统，包含智驾领航辅助（NCA）、车道巡航辅助（LCC）、车道巡航辅助增强（LCC Plus）、全向防碰撞系统（CAS）、智能泊车辅助（APA）、遥控泊车辅助（RPA）、代客泊车辅助（AVP）、哨兵模式等功能。部分高阶智驾功能需付费开通，如城区智驾领航辅助（City NCA）、城区车道巡航辅助增强（City LCC Plus）、代客泊车辅助（AVP）等。

参考：问界 M5 华为高阶智能驾驶系统

阿维塔

驾驶安全与辅助：

        前向碰撞预警（FCW）、自动紧急制动（AEB）、异形障碍物自动紧急制动（GAEB）、低速自动紧急制动（LAEB）、前向横穿碰撞预警（FCTA）、前向横穿碰撞制动（FCTB）、后向碰撞预警（RCW）、后向横穿碰撞预警（RCTA）、后向横穿碰撞制动（RCTB）、后向自动紧急制动（RAEB）、交通标志识别（TSR）、交通信号灯识别（TLR）、超速告警（TSA）、开门预警（DOW）、车道偏离预警（LDW）、盲区监测预警（BSD）、车道保持辅助（LKA）、紧急车道保持辅助（ELKA）、侧向障碍物防碰撞（LOCP）、自适应巡航辅助（ACC）、高速车道巡航辅助 (Highway LCC）

智能领航系统：

        高速智驾领航辅助 (Highway NCA）、城区车道巡航辅助 (City LCC）、城区智驾领航辅助 (City NCA）

智能泊车辅助系统：

        智能泊车辅助（APA）、遥控泊车辅助（RPA）、代客泊车辅助（AVP）

其中，ADS高阶功能包需付费购买，包含城区智驾领航辅助 (City NCA）与代客泊车辅助（AVP）。

参考：阿维塔 12 参数配置表

蔚来

智能驾驶-安全辅助：

        前向碰撞预警 (FCW)、自动紧急制动 (AEB)、车辆盲区监测 (BSD)、变道盲区预警 (LCA)、侧方开门预警 (DOW)、后方穿行预警带制动 (RCTA-B)、前方穿行预警带制动 (FCTA-B)、车道偏离预警 (LDW)、车道保持辅助 (LKA)、紧急主动停车(EAS)、紧急车道保持 (ELK)、全场景误加速抑制辅助 (MAI+)、增强型驾驶员感知系统 (ADMS)、通用障碍物预警及辅助 (GOA)、增强型自动紧急转向 (AES)

智能驾驶-泊车辅助：

        视觉融合泊车辅助 (S-APA with Fusion)、换电站泊车辅助 (PSAP)、车辆近距召唤 (NBS)、遥控泊车辅助 (RPA)

智能驾驶-辅助驾驶：

        车道居中辅助 (LCC)、转向灯控制变道 (ALC)、智能自适应巡航 (i-ACC)、道路标识识别 (TSR)、动态环境模拟显示 (ESD)、视觉融合起步提醒 (AGN)

蔚来智能驾驶NAD服务：

        智能驾驶NAD服务（覆盖部分城区道路、封闭高速道路的智能驾驶体验）、低速及泊车智能驾驶NAD服务（支持领航泊车、智能召唤等功能体验）、全域领航辅助 (NOP+)（支持高速、城市快速路、城区道路、高速服务区领航换电等体验）

参考：NIO ES6 详细配置表

特斯拉

基本版 Autopilot 自动辅助驾驶：

        主动巡航控制、自动辅助转向

增强版 Autopilot 自动辅助驾驶：

        自动变道、自动辅助导航驾驶、自动泊车、召唤功能、智能召唤功能

完全自动驾驶功能：

        交通信号灯和停车标志控制、在城市街道自动辅助转向

参考：Model 3 车主手册 Autopilot 自动辅助驾驶

小米

Xiaomi Pilot Pro：高速领航辅助（NOA）、智能泊车辅助（APA）、车道居中辅助（LCC）、代客泊车辅助（AVP）

Xiaomi Pilot Max：城市领航辅助（NOA）

参考：小米智能驾驶 Xiaomi Pilot

前往活动页面>>>

一、活动时间
2023年10月31日0点0分0秒至2026年3月31日23点59分59秒

二、活动对象
同时满足以下全部条件的阿里云用户：
1、阿里云注册会员用户；
2、完成阿里云实名认证；
3、符合活动规则的新老用户，均可参与。

三、活动权益参与规则
1、云服务器ECS经济型e实例（简称“99实例”或“99元e实例”）活动范围：
个人认证或者企业认证的用户购买指定配置“e实例2核2G，3M固定带宽，40G ESSD Entry 系统盘”可享受包1年99元，活动地域包含北京，杭州，上海，张家口，呼和浩特，深圳，成都，河源，乌兰察布，广州。
2、云服务器通用算力型u1实例（简称“199实例”或“199元u1实例”）活动范围：
企业认证的用户购买指定配置“u1实例2核4G，5M固定带宽，80G ESSD Entry 系统盘”可享受包1年199元，活动地域包含青岛，北京，杭州，上海，深圳，成都，河源，乌兰察布，广州，中国香港，日本（东京），新加坡，美国（硅谷），英国（伦敦），德国（法兰克福）。
3、活动说明：
在活动期间内，同一个人认证主体只可保有1个“99元e实例”；同一企业认证主体最多可同时保有1个“99元e实例”和1个“199元u1实例”，实例到期后在活动时间范围内可持续以低价续费保有，另购使用官网价。本次优惠不可与优惠券叠加使用。同一用户同一时间只能保有一个“99实例”或者“199实例”。

四、购买场景
1、新购场景：
在符合参与规则的情况下，直接低价购买指定配置产品，有效期1年。若无法购买，请确认是否存在同人或其他实例已占用等情况。
2、续费场景：
在活动时间内，指定配置每年最多可以以优惠价格续费1次，1次1年，直到活动时间结束持续享受续费优惠。
备注：若续费其他实例时使用了低价权益，原低价产品实例将无法再享受低价权益。
根据以上规则，常见场景有以下几种：

场景1：若您在2023年10月31日新购“99元e实例”，您可在2023年10月31日至2024年10月30日（即新购后的一年内）完成第一次续费（此时服务器到期时间为2025年10月30日）；可在2024年10月31日至2025年10月30日完成第二次续费（此时服务器到期时间为2026年10月30日）；可在2025年10月31日至2026年3月31日完成第三次续费（此时服务器到期时间为2027年10月30日）；
即连续以99元1年的价格续费3年，可以使用“99元e实例”至2027年10月30日，该服务器总保有时长4年。

场景2：若您在2026年3月31日（活动截止前最后一天）新购“99元e实例”/“199元u1实例”，您可在2026年3月31日当天完成一次续费（此时服务器到期时间为2028年3月31日）；
即以99元/199元1年的价格续费1年，可以使用“99元e实例”/“199元u1实例”至2028年3月31日，该服务器总保有时长2年。

场景3：若您在2024年4月1日新购“99元e实例”/“199元u1实例”，您可在2024年4月1日至2025年3月31日完成第一次续费（此时服务器到期时间为2026年3月31日）；您可在2025年4月1日至2026年3月31日完成第二次续费（此时服务器到期时间为2027年3月31日）；
即连续以99元/199元1年的价格续费2年，可以使用“99元e实例”/“199元u1实例”至2027年3月31日，服务器总保有时长3年。

3、退订场景：
支持五天无理由退款，退款后保留“低价长效”优惠资格，在活动时间范围内可再次使用低价购买活动配置；
4、变配场景：
变配至“低价长效优惠”指定配置时当前付费周期不享受低价权益，续费时可享受包1年99元/199元优惠；“低价长效优惠”指定配置发生变配/升级/降配操作后，变配需按照官网价补差价，请仔细阅读变配页面引导及相关资费说明，但仍占用权益资格直到该实例释放，购买相同规格产品不能再享受低价，同时续费时也不再享受包1年99元/199元优惠；
5、如用户账号有欠费，需先补足欠费再进行购买。
6、低价权益产品仅供账号本人使用，不允许过户转让。
7、如在参与“低价长效”优惠过程中，使用其他收费产品/功能，则需按照产品/功能标准资费支付超额产生的费用。
8、其他规则：
阿里云有权根据业务需求，随时调整提供给用户低价购买的产品范围、产品数量、产品配置、购买规则等，用户应以购买时相关页面的展示内容为准，但不影响用户在活动规则调整前已经获得的权益。
9、禁止使用产品来挖掘货币，如您使用产品来挖掘货币，可能会被收取费用及取消权益资格。
10、为保证活动的公平公正，如用户在活动中存在隐瞒、虚构、作弊、欺诈或通过其他非正常手段规避活动规则、获取不当利益的行为，例如：作弊领取、恶意套现、网络攻击、虚假交易等，阿里云有权收回相关权益、取消用户的活动参与资格，撤销违规交易，必要时追究违规用户的法律责任。
您应确保您对云服务器的使用不侵犯他人著作权，不会用于私服架设服务、私服程序、私服网站、私服源码、私服服务器和空间等。

五、常见FAQ：
1.用户在购买完99实例/199实例后，如果因某些原因导致需要退款或者释放实例，还可以再以99元/199元的优惠价格重新购买吗？
答：可以，99实例/199实例支持五天无理由退款，退款后仍然保留优惠资格，用户在活动时间范围内可再次使用低价购买活动配置；
2.活动规则里写的1年续费1次中，“1年”指的是自然年吗？
答：“1年”指的是云服务器购买1年的付费周期，即两次续费时间必须间隔1年以上；
3.99实例/199实例优惠套餐最多可以享受几年的优惠？
答：若您在24年3月31日前首次新购99实例/199实例优惠套餐，最多可以享受4年优惠（包含新购1次，续费3次，1次1年）；

六、相关名词及解释
1、“阿里云官网”，是指包含域名为 www.aliyun.com/ 的网站以及阿里云客户端，如APP，但阿里云国际站，包括alibabacloud.com以及所有下属页面和jp.aliyun.com以及所有下属页面除外。
2、“同一用户”，是指根据不同阿里云账号在注册、登录、使用中的关联信息，阿里云判断其实际为同一用户。关联信息举例：同一手机号、同一邮箱、同一证件等。
3、“同人账号”，是指同一用户拥有多个阿里云账号的，各个账号之间互为同人账号。
4、“新用户”，是指在阿里云官网没有收费云产品购买记录的阿里云会员用户。新用户在进行首次云产品购买行为时，也被称为“首购用户”。
5、“老用户”，是指在阿里云官网已有收费云产品购买记录的阿里云会员用户。
6、“云产品”，是指阿里云官网售卖的中国大陆节点的产品和服务，但不包括域名、虚拟主机、云市场产品、专有云产品，云通信产品。
7、“指定云产品”，是指某场具体活动页面列举的活动云产品。
8、活动中涉及“打折”、“折扣”、“×折”或“省××元”，是指将本活动期间的某款产品的活动价格，与无任何活动期间的相同产品的日常最小单位售价（例如：月价），按相同购买时长进行比较后，所获得的比较结果。
9、活动涉及的“划线价”、“日常价”，通常是指该产品曾经展示过的销售价，并非原价，仅供参考。具体活动页面单独对“划线价”、“日常价”进行说明的，以其表述为准。
10、除非有相反证据证明外，用户参与活动所获得的全部权益和相应责任，均归属于参与活动的该阿里云账号所对应的实名认证主体。
11、活动中的“天”、“日”、“工作日”等均指该日的0点至24点（北京时间）。
12、阿里云可以根据活动的实际情况对活动规则进行变动或调整，相关变动或调整将公布在活动页面上，并于公布时即时生效；但不影响用户在活动规则调整前已经获得的权益。您购买阿里云单项产品时，亦应遵守该产品法律服务协议。
13、活动页面提到的“核” ，均指vcpu。

将以下命令保存为 .vbs 文件，打开该文件即可打开 IE：

CreateObject("InternetExplorer.Application").Visible=true

* 本文信息仅供参考，以设备最新产品说明为准！

-> 查看目前可以做从网关的产品（2023-12-07）

本文基于 manifest v3

插件使用 Web 技术开发

浏览器提供额外的插件 API

插件与网页分离，运行在一个独立的环境中

插件 API 功能

• 管理 Tabs、窗口、历史记录、书签、Cookies、下载、浏览数据、通知、网站权限

• 管理浏览器的外观和感觉 - 背景、主题、右键菜单、新标签页、启动页面

• 定制 DevTools

• 向网页注入脚本，与网页通信，与系统中的 Native 应用程序通信

• 修改/监听发送的 HTTP 请求/接收的回复

插件构成

* 即便 content script 是注入到网页中的，而且是运行在 Renderer 进程（与主网页相同的进程），但是它们仍运行在不同的世界（world）。主网页运行在 main world，插件的 content script 运行在 isolated world。比如说 main world 中有一个变量，它在 isolated world 中是访问不到的，但是如果修改了 dom，对其它世界是有影响的。

将 Chrome 插件迁移到 Edge

• 移除 Chrome 独有的 API（如调用 Google 账户）

• 移动 update_URL 字段（如果是从 Chrome 商店直接下载的包会有这个字段）

• 改名 Chrome 相关的文字（插件名称、描述文字）
  

参考文献

1. Microsoft Edge 扩展入门（官方）

2. 一小时精通Edge扩展开发Microsoft Edge 文档（视频）
   

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

推荐使用 SignalR 来平替 WebSocket，参考教程。

【服务端（.NET）】

一、创建 WebSocketHandler 类，用于处理客户端发送过来的消息，并分发到其它客户端

public class WebSocketHandler
{
    private static List<WebSocket> connectedClients = [];

    public static async Task Handle(WebSocket webSocket)
    {
        connectedClients.Add(webSocket);

        byte[] buffer = new byte[1024];
        WebSocketReceiveResult result = await webSocket.ReceiveAsync(new ArraySegment<byte>(buffer), CancellationToken.None);
        while (!result.CloseStatus.HasValue)
        {
            string message = Encoding.UTF8.GetString(buffer, 0, result.Count);
            Console.WriteLine($"Received message: {message}");

            // 处理接收到的消息，例如广播给其他客户端
            await BroadcastMessage(message, webSocket);

            result = await webSocket.ReceiveAsync(new ArraySegment<byte>(buffer), CancellationToken.None);
        }

        connectedClients.Remove(webSocket);
        await webSocket.CloseAsync(result.CloseStatus.Value, result.CloseStatusDescription, CancellationToken.None);
    }

    private static async Task BroadcastMessage(string message, WebSocket sender)
    {
        foreach (var client in connectedClients)
        {
            if (client != sender && client.State == WebSocketState.Open)
            {
                await client.SendAsync(Encoding.UTF8.GetBytes(message), WebSocketMessageType.Text, true, CancellationToken.None);
            }
        }
    }
}

二、在 Program.cs 或 Startup.cs 中插入：

// 添加 WebSocket 路由
app.UseWebSockets();
app.Use(async (context, next) =>
{
    if (context.Request.Path == "/chat")
    {
        if (context.WebSockets.IsWebSocketRequest)
        {
            WebSocket webSocket = await context.WebSockets.AcceptWebSocketAsync();
            await WebSocketHandler.Handle(webSocket);
        }
        else
        {
            context.Response.StatusCode = 400;
        }
    }
    else
    {
        await next();
    }
});

这里的路由路径可以更改，此处将会创建一个 WebSocket 连接，并将其传递给 WebSocketHandler.Handle 方法进行处理。

也可以用控制器来接收 WebSocket 消息。

【客户端（JS）】

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" />
    <title>WebSocket 示例（JS + ASP.NET）</title>
    <style>
        #list { width: 100%; max-width: 500px; }
        .tip { color: red; }
    </style>
</head>
<body>
    <h2>WebSocket 示例（JS + ASP.NET）</h2>
    <textarea id="list" readonly rows="20"></textarea>
    <div>
        <input type="text" id="msg" />
        <button onclick="fn_send()">发送</button>
        <button onclick="fn_disconnect()">断开</button>
    </div>
    <p id="tip_required">请输入要发送的内容</p>
    <p id="tip_closed">WebSocket 连接未建立</p>

    <script>
        var wsUrl = "wss://" + window.location.hostname + ":" + window.location.port + "/chat";
        var webSocket;
        var domList = document.getElementById('list');

        // 初始化 WebSocket 并连接
        function fn_ConnectWebSocket() {
            webSocket = new WebSocket(wsUrl);

            // 向服务端发送连接请求
            webSocket.onopen = function (event) {
                var content = domList.value;
                content += "[ WebSocket 连接已建立 ]" + '\r\n';
                domList.innerHTML = content;

                document.getElementById('tip_closed').style.display = 'none';

                webSocket.send(JSON.stringify({
                    msg: 'Hello'
                }));
            };

            // 接收服务端发送的消息
            webSocket.onmessage = function (event) {
                if (event.data) {
                    var content = domList.value;
                    content += event.data + '\r\n';
                    domList.innerHTML = content;
                    domList.scrollTop = domList.scrollHeight;
                }
            };

            // 各种情况导致的连接关闭或失败
            webSocket.onclose = function (event) {
                var content = domList.value;
                content += "[ WebSocket 连接已关闭，3 秒后自动重连 ]" + '\r\n';
                domList.innerHTML = content;

                document.getElementById('tip_closed').style.display = 'block';

                setTimeout(function () {
                    var content = domList.value;
                    content += "[ 正在重连... ]" + '\r\n';
                    domList.innerHTML = content;
                    fn_ConnectWebSocket();
                }, 3000); // 3 秒后重连
            };
        }

        // 检查连接状态
        function fn_IsWebSocketConnected() {
            if (webSocket.readyState === WebSocket.OPEN) {
                document.getElementById('tip_closed').style.display = 'none';
                return true;
            } else {
                document.getElementById('tip_closed').style.display = 'block';
                return false;
            }
        }

        // 发送内容
        function fn_send() {
            if (fn_IsWebSocketConnected()) {
                var message = document.getElementById('msg').value;
                document.getElementById('tip_required').style.display = message ? 'none' : 'block';
                if (message) {
                    webSocket.send(JSON.stringify({
                        msg: message
                    }));
                }
            }
        }

        // 断开连接
        function fn_disconnect() {
            if (fn_IsWebSocketConnected()) {
                // 部分浏览器调用 close() 方法关闭 WebSocket 时不支持传参
                // webSocket.close(001, "Reason");
                webSocket.close();
            }
        }

        // 执行连接
        fn_ConnectWebSocket();
    </script>
</body>
</html>

【在线示例】

https://xoyozo.net/Demo/JsNetWebSocket

【其它】

• 服务端以 IIS 作为 Web 服务器，那么需要安装 WebSocket 协议

• 一个连接对应一个客户端（即 JS 中的 WebSocket 对象），注意与会话 Session 的区别

• 在实际项目中使用应考虑兼容性问题

• 程序设计应避免 XSS、CSRF 等安全隐患

• 参考文档：https://learn.microsoft.com/zh-cn/aspnet/core/fundamentals/websockets

如果手机开启了自动横屏，那么网页就会跟着旋转，导致网页宽度变大，高度变小，页面布局不友好，我们可以通过判断屏幕方向 api，用 css 设置旋转。

HTML：

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" />
    <title>保持竖屏示例</title>
</head>
<body>
    <div id="app">
        <div class="page">
            <div>把手机横过来试试</div>
            <div>页面永远保持竖屏方向</div>
        </div>
    </div>
</body>
</html>

CSS：

body { margin: 0; }
.page { text-align: center; padding-top: 100px; }

@media screen and (orientation: landscape) {
    body { width: 100vh; height: 100vw; overflow: hidden; }
    .page.landscape-primary { transform: rotate(-90deg); transform-origin: top left; width: 100vh; height: 100vw; position: absolute; top: 100%; left: 0; }
    .page.landscape-secondary { transform: rotate(90deg); transform-origin: top left; width: 100vh; height: 100vw; position: absolute; top: 0; left: 100%; }
}

JS:

function fn_set_orientation() {
    var orientation = window.screen.orientation || window.screen.mozOrientation || window.screen.msOrientation;
    const div = document.querySelector('.page');
    console.log(orientation.type)
    switch (orientation.type) {
        case 'landscape-primary': {
            div.classList.remove('landscape-secondary');
            div.classList.add('landscape-primary');
            break;
        }
        case 'landscape-secondary': {
            div.classList.remove('landscape-primary');
            div.classList.add('landscape-secondary');
            break;
        }
        default: {
            div.classList.remove('landscape-primary');
            div.classList.remove('landscape-secondary');
            break;
        }
    }
}
window.addEventListener("orientationchange", function () {
    fn_set_orientation();
});
fn_set_orientation();

示例：

https://xoyozo.net/Demo/Orientation

可能的原因是 IIS 安装了“WebDAV 发布”，在 IIS - 模块 中可见 WebDAVModule

解决方法：在网站的 web.config 中设置：

<system.webServer>
    <modules>
        <remove name="WebDAVModule" />
    </modules>
</system.webServer>

或在 IIS 中，在该网站的模块中删除 WebDAVModule。

如果网站需要用到 WebDAV 模块，那么考虑使用 Fetch API 或 XMLHttpRequest 来发送请求。