YLong软件

安卓手机更新WebView内核全攻略

Tue, 01 Sep 2026 19:29:15 +0800

安卓APP内嵌的网页，并非由APP自身渲染，而是依赖系统组件——WebView。它相当于手机内置的通用“浏览器引擎”，所有需要显示网页的APP（包括通过HTML一键打包APK工具生成的APP）都共享使用该组件。

HTML一键打包APK工具为了控制APK体积，默认调用系统WebView来渲染页面，而非将完整浏览器内核打包到应用中。这导致了一个常见现象：相同的页面，在不同手机上表现迥异——一台显示正常，另一台可能布局错乱或功能失效，其根源往往在于系统WebView版本不一致。

当你的APP在特定手机上出现样式异常、新特性无法使用、视频或页面无法加载，而切换另一台设备却一切正常时，优先检查的是该手机的WebView版本，而非打包配置。

如果你对HTML打包APK工具还不熟悉，可访问官网了解详情：

HTML一键打包APK工具官网

WebView版本为何至关重要

WebView版本直接决定了APP能够支持哪些网页标准。版本越新，支持的HTML、CSS和JavaScript特性越丰富。

若版本过旧，常见问题包括：

较新的CSS特性（如 :has()、容器查询、级联层）无效，导致页面布局错位
较新的JavaScript语法（可选链、空值合并、顶层 await 等）抛出错误，脚本整体失效
部分视频和音频编码无法解码，出现仅有声音而无画面
新版API（如全屏、剪贴板、文件系统访问）缺失，点击功能无响应
安全策略差异导致HTTPS资源被意外拦截

反之，将系统WebView更新至最新版，上述问题通常无需修改代码即可解决。

查询当前WebView版本的方法

问题排查前，先确认手机当前的WebView版本。

方法一：通过系统设置

打开手机设置。
在顶部搜索栏输入 WebView 或 Android System WebView。
点击 Android System WebView（部分机型显示为“系统WebView”），在详情页可查看到版本号。

方法二：检查WebView实现（安卓7.0及以上）

进入设置 → 关于手机，连续点击版本号直至提示进入开发者模式。
返回设置，进入系统 → 开发者选项（不同品牌位置略有差异，可搜索“WebView”）。
找到 WebView实现（或“WebView Implementation”），可查看当前使用的是 Android System WebView 还是 Chrome，并支持切换。

方法三：通过网页检测内核版本

使用出问题的APP或手机浏览器打开在线内核检测页面，页面会显示当前内核版本和兼容性评分。对比正常手机与异常手机的检测结果，差异一目了然。

通用更新方法（适用于多数机型）

在查找特定品牌方法前，可尝试以下三种通用方式，它们能覆盖绝大多数场景。

1. 更新Android System WebView组件

打开手机自带的应用商店（或Google Play），搜索 Android System WebView，若有“更新”按钮，直接更新即可。这是最直接的升级途径。

2. 更新Chrome浏览器

在安卓7.0及以上系统中，Chrome可作为WebView的实现者。将Chrome更新至最新版，然后在开发者选项中将WebView实现切换为Chrome，相当于更换了一套更新的内核。

3. 升级系统版本

部分厂商将WebView作为系统组件随系统更新一起推送。若应用商店中搜索不到WebView，可进入设置 → 系统升级/软件更新，将系统更新至最新版，WebView通常会自动升级。

各品牌手机专属更新方案

不同厂商对WebView的打包和更新策略各有差异，以下按品牌详细说明。

华为（HarmonyOS / EMUI）

打开华为应用市场，搜索 华为浏览器（或“浏览器”），若有更新则更新。华为机型主要由华为浏览器提供系统WebView内核。
部分支持GMS的机型，可在应用市场或Google Play中搜索 Android System WebView 单独更新。
亦可进入设置 → 系统和更新 → 软件更新升级系统，内核会随系统更新。
注意：HarmonyOS NEXT（纯鸿蒙）使用自研内核，仅能通过系统更新和华为浏览器更新获取新特性。

荣耀（MagicOS）

打开荣耀应用市场（或“我的荣耀”），搜索 荣耀浏览器 / Android System WebView 进行更新。
进入设置 → 系统和更新 → 软件更新，检查系统更新。
安卓7.0以上机型可在开发者选项中切换WebView实现。

小米 / Redmi（HyperOS / MIUI）

打开小米应用商店，搜索 Android System WebView 或 WebView，更新即可。
也可进入设置 → 我的设备 → 系统版本（或“关于本机”）检查系统更新。
在设置 → 更多设置 → 开发者选项 → WebView实现中，可切换至新版Chrome作为内核。

OPPO / 一加 / realme（ColorOS / OxygenOS / realme UI）

打开软件商店，搜索 Android System WebView，更新至最新版。
进入设置 → 软件更新（ColorOS为“设置 → 关于本机 → 版本信息”）检查系统更新。
一加海外版机型可直接通过Google Play更新WebView和Chrome。

vivo / iQOO（OriginOS / Funtouch OS）

打开vivo应用商店，搜索 Android System WebView 更新。
进入设置 → 系统管理 → 系统升级（部分版本为“设置 → 系统升级”）更新系统。
开发者选项中同样可切换WebView实现。

三星（One UI）

打开 Galaxy Store 或 Google Play，搜索 Android System WebView 和 Google Chrome，分别更新。
国行机型可进入设置 → 软件更新 → 下载并安装更新系统。
三星机型通常同时安装有WebView和Chrome，更新后在开发者选项中切换即可。

魅族 / 联想 / 中兴 / 传音等其他品牌

这些品牌基本采用原生方案：

在自带应用商店搜索 Android System WebView 更新。
若商店无结果，检查系统更新。
若仍无法更新，可安装最新版 Google Chrome，然后在开发者选项中把WebView实现切换为Chrome。

更新后的操作步骤

更新WebView属于系统层面变更，APP本身无需重新打包，也无需重新安装。

更新完成后，重启一次手机，确保系统加载新内核。
重新打开APP，验证之前异常的页面是否恢复正常。
若APP有缓存，可在设置 → 应用管理中找到该APP，清除缓存后再试。

常见问题解答

所有页面都正常，仅有我的APP有问题，也是WebView的原因吗？

可能性很高。因为手机浏览器（Chrome、华为浏览器等）使用自身完整内核，而APP使用系统WebView组件，两者版本可能不一致。浏览器能打开不代表APP内WebView版本足够新。

应用商店搜不到Android System WebView怎么办？

部分厂商的应用商店不上架该组件。可先尝试系统更新；若系统已是最新，安装最新版Chrome，然后在开发者选项中把WebView实现切换为Chrome，同样能达到升级内核的效果。

更新WebView会影响手机上的其他APP吗？

会，但均为正面影响。WebView是系统共享组件，更新后所有使用网页的APP都会受益。通过官方渠道更新是安全的，但切勿安装来路不明的“WebView升级包”APK。

安卓4.4及以下的旧设备能更新吗？

不能。独立的WebView更新机制从安卓5.0开始才提供。这类设备只能通过升级整个系统ROM来提高内核版本，建议在页面代码上做好兼容性降级处理。

更新后APP里仍是老样子，怎么办？

首先确认开发者选项中的WebView实现指向的是已更新的组件；然后重启手机；最后清除APP缓存再试。若问题依旧，说明可能是页面代码使用了过于激进的特性，建议为目标机型做降级兼容。

有没有办法不依赖用户手机的WebView版本？

使用HTML一键打包APK工具时，页面始终由系统WebView渲染，无法随包携带独立内核。因此实际可行的做法是：一是引导用户更新系统WebView，二是在页面中使用成熟、兼容性好的写法，对高级特性做好特性检测与降级方案。

实用建议

当出现“某台手机上样式错乱或功能失效”时，先对比WebView版本，再排查代码。
更新WebView优先走官方应用商店和系统更新，不要安装第三方内核包。
分发APP前，尽量在一台WebView版本较旧的设备上做一次兼容性测试。
页面开发阶段避免依赖过于新颖的浏览器特性，必要时进行特性检测与降级处理。

C#强签名作用与恒盾混淆大师使用教程

Mon, 31 Aug 2026 20:56:42 +0800

在使用恒盾C#混淆加密大师处理 C# DLL 或 EXE 时，如果原始程序集本身已有强名称（Strong Name），混淆后会面临一个问题：原有的强签名失效了。这是因为混淆涉及重命名、流程混淆、字符串加密等操作，这些都会改变文件的二进制内容，而强签名恰恰与二进制内容绑定，任何改动都会导致校验失败。

软件内置的强签名功能，可以在混淆完成后，用你指定的 .snk 密钥文件对输出程序重新签名。这样，处理后的文件既能享受混淆保护，又能拥有有效的强名称签名，方便其他程序集引用，或安装到全局程序集缓存（GAC）中。

强签名到底有什么价值

强签名是 .NET 框架为程序集提供的一套标识与校验机制，利用一对公私钥（存储在 .snk 文件里）生成数字签名。它的核心价值体现在：

唯一性标识：强名称由程序集名称、版本号、区域性和公钥标记（Public Key Token）构成。不同密钥签名的同名程序集可以共存，避免命名冲突。
防篡改检测：签名与程序集内容绑定，文件被修改后校验失败，可用于识别篡改。
引用绑定：当强签名程序集引用另一个时，运行时会根据“简单名称 + 公钥标记”进行绑定，只有密钥一致才能正常加载。

需要注意的是，强签名只负责“是谁”和“是否被改”，它不等于加密或混淆，不能替代代码保护功能。两者结合，才能实现“防篡改”与“难反编译”的双重目标。

为什么混淆后必须重新签名

如果输入的 DLL 或 EXE 本身就是强签名程序集，混淆完成后，内容变了，原签名自然失效。这会引发两个问题：

引用无法加载：其他程序集在编译时记录了强名称引用，签名失效或公钥标记改变后，运行时可能抛出找不到程序集或加载异常。
签名校验失败：在需要签名校验的场景（如 GAC 部署）中，失效的文件会被直接拒绝。

恒盾的强签名功能，可以用与原始程序集相同的 .snk 密钥重新签名，确保公钥标记不变，延续引用关系。这是启用该功能最常见的原因。

如果原始程序本来没有强签名，也可以利用这个功能为输出文件补上签名，例如后续需要将 DLL 安装到 GAC，或公司规定要求所有程序集必须签名时。

如何生成 .snk 密钥文件

强签名需要 .snk 格式的密钥文件。如果项目中已有密钥文件（比如编译时用的 xxx.snk），直接使用即可。常见生成方式有两种：

方法一：使用命令行工具

在 Visual Studio 的“开发者命令提示符”中执行：

sn -k MyKey.snk

这会在当前目录生成一个包含公私钥对的密钥文件。

方法二：使用 Visual Studio 界面

在传统 .NET Framework 项目中，打开“项目属性” → “签名”页，勾选“为程序集签名”，点击“新建”即可。SDK 风格项目（.NET Core / .NET 5+）也可以在属性中勾选“为程序集生成强名称”来创建。

具体配置步骤

打开恒盾C#混淆加密大师，切换到“强签名配置”选项卡。
勾选“启用强签名”，密钥文件输入框变为可用。
点击“选择文件”，指定用于签名的 .snk 文件。
回到“快速混淆加密”选项卡，选择要处理的 DLL 或 EXE，按需勾选保护、混淆和重命名等选项。
设置输出文件路径，点击“开始处理”。
处理完成后，输出的文件即带有有效强名称签名。
如需保留配置，点击“保存配置”，密钥文件路径一并保存。

如果不需要签名，保持“启用强签名”未勾选即可。

适用场景推荐

原始程序集已有强签名：使用同一密钥重新签名，保证引用兼容。
需要部署到 GAC 的类库：GAC 中的 DLL 必须具有强名称，混淆后需重签。
对发布文件有完整性要求：利用强制签名校验检测文件是否被篡改。
团队或客户规范要求：某些企业要求所有发布程序集必须签名。

如何验证签名结果

在开发者命令提示符中执行以下命令：

sn -T 输出文件.dll

将显示的公钥标记与原始程序集对比：使用同一密钥时，两者应一致，说明引用标识已保留。

注意事项

保护好密钥文件：.snk 文件包含私钥，泄露后他人可仿冒你的标识。不要提交到公开仓库或随安装包分发。
使用同一密钥：若要延续引用，必须用与原始程序集相同的密钥，否则公钥标记改变导致加载失败。
强签名不是数字证书：它不同于 Authenticode 签名，后者用于验证发布者身份，两者可并存。
.NET Core 行为不同：.NET Framework 中 GAC 会校验签名，而 .NET Core 及更高版本默认不校验，强名称主要用于标识。
不能替代混淆：强签名不提升反编译防护强度，仍需要结合混淆和加密功能。
与防篡改选项的区别：软件中的“防篡改（仅限EXE）”是运行时保护，强签名是静态校验，可配合使用。

总结

恒盾C#混淆加密大师的强签名功能，专门解决“混淆后原签名失效”的痛点。对于已有强签名的程序集，用原密钥重签可保持引用兼容；需要 GAC 部署或签名规范时，也可为输出文件补签。

记住两点：延续引用必须用同一密钥；密钥需严格保密。将强签名与混淆、加密结合，能让发布的 C# 程序集既有完整标识，又具备反编译防护能力。

HTML打包APK User Agent设置详解

Thu, 27 Aug 2026 21:17:46 +0800

每个APP在访问网站时，都会向网站发送User Agent信息，表明自己的设备和浏览器类型。网站根据此信息决定返回手机版还是电脑版内容，或提示"请使用指定浏览器打开"。

HTML一键打包APK工具提供的User Agent设置功能，允许你为打包的APP自定义此信息，使网站将APP识别为指定的浏览器或设备，从而正确展示内容。

如果对工具不熟悉，可访问官网了解：

HTML一键打包APK工具官网

User Agent设置的应用场景

大多数情况下，保持默认（留空）即可正常访问。以下场景需要自定义：

页面显示为电脑版

某些网站根据访问设备自动切换版本。若网站将APP误认为电脑浏览器，用户将看到排版混乱的电脑版。将User Agent设为手机浏览器后，网站返回手机版。

提示"请使用指定浏览器打开"

部分网站或活动页对特定环境开放，如仅允许微信内或某品牌浏览器访问，默认身份会被拦截。将User Agent改为所需身份即可访问。

统计识别APP来源

若同时运营网站，可为APP设置专属User Agent，便于在后台区分来自APP的访问。

设置位置

打开工具，在快速打包页面中找到User Agent设置输入框，位于时间限制和App包名之间。

设置步骤

打开工具，进入快速打包页面。
输入网址或选择本地HTML文件。
在User Agent设置中输入所需的User Agent字符串（网上可查各类浏览器的UA）。
填写应用名称、包名等常规配置。
点击打包APK，等待生成。

安装后，APP将以自定义User Agent访问网站，对内部所有网页统一生效。

留空与填写的区别

留空（推荐）：使用系统默认User Agent，兼容性最佳。
填写：以指定身份访问，适用于特殊限制场景。

使用建议

不确定时优先留空。
仅当遇到页面异常或访问限制时再修改。
修改后务必在手机上充分测试。
若页面异常，清空输入框重新打包即可恢复。

常见问题

会影响其他功能吗？ 不会，只改变访问时的身份标识。

修改后需要重新打包吗？ 需要，User Agent在打包时写入，修改后需重新安装APK。

能否为不同页面设置不同User Agent？ 不可以，该设置为全局统一。若需差异化，建议在网站端处理。

HTML打包APK：页面打印功能实现方法

Mon, 24 Aug 2026 20:34:58 +0800

在网页中，一行 window.print() 就能调起浏览器的打印功能。在HTML一键打包APK工具生成的APP中，这行代码同样有效：工具会拦截 window.print() 调用，并转交给安卓系统打印服务。用户可以直接选择打印机打印，也可以"另存为PDF"把页面保存成PDF文件。

如果你不了解HTML打包APK工具, 想要进一步了解, 可以查看官网:

HTML一键打包APK工具官网

创建打印页面

在HTML项目入口目录中创建 index.html，写入以下代码。页面展示一张简单的单据，点击"打印"按钮后调用 window.print() 触发打印。通过 @media print 样式，打印时会自动隐藏按钮等屏幕元素，只保留单据内容。

<!doctype html>
<html lang="zh-CN">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
        <title>单据打印</title>
        <style>
            * {
                box-sizing: border-box;
            }

            body {
                min-height: 100vh;
                margin: 0;
                padding: 20px;
                display: grid;
                place-items: center;
                font-family: 'Microsoft YaHei', sans-serif;
                background: #f4f7f5;
                color: #17221c;
            }

            main {
                width: min(100%, 440px);
            }

            .sheet {
                padding: 24px;
                border: 1px solid #cad4ce;
                border-radius: 8px;
                background: #fff;
            }

            h1 {
                margin: 0 0 4px;
                font-size: 24px;
                text-align: center;
            }

            .sheet-meta {
                margin: 0 0 16px;
                font-size: 13px;
                color: #526159;
                text-align: center;
            }

            table {
                width: 100%;
                border-collapse: collapse;
                font-size: 14px;
            }

            th,
            td {
                padding: 8px 6px;
                border-bottom: 1px solid #e2e8e4;
                text-align: left;
            }

            th {
                background: #eef2f0;
            }

            .total {
                margin-top: 12px;
                text-align: right;
                font-size: 16px;
                font-weight: 700;
            }

            button {
                width: 100%;
                min-height: 48px;
                margin-top: 14px;
                border: 0;
                border-radius: 6px;
                background: #197447;
                color: white;
                font: inherit;
                font-weight: 700;
            }

            /* 打印相关样式 */
            @media print {
                body {
                    padding: 0;
                    background: #fff;
                }

                /* 打印时隐藏按钮，只保留单据 */
                .no-print {
                    display: none;
                }

                .sheet {
                    width: 100%;
                    border: 0;
                    border-radius: 0;
                }
            }
        </style>
    </head>
    <body>
        <main>
            <div class="sheet">
                <h1>购物清单</h1>
                <p class="sheet-meta">单号：20260824001　日期：2026-08-24</p>
                <table>
                    <thead>
                        <tr>
                            <th>品名</th>
                            <th>数量</th>
                            <th>金额</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>无线鼠标</td>
                            <td>1</td>
                            <td>79.00</td>
                        </tr>
                        <tr>
                            <td>机械键盘</td>
                            <td>1</td>
                            <td>299.00</td>
                        </tr>
                        <tr>
                            <td>USB数据线</td>
                            <td>2</td>
                            <td>30.00</td>
                        </tr>
                    </tbody>
                </table>
                <p class="total">合计：408.00 元</p>
            </div>
            <button class="no-print" type="button" onclick="window.print()">打印</button>
        </main>
    </body>
</html>

代码说明：

点击"打印"按钮执行 window.print()，这是整个打印功能的核心，不需要引入任何第三方库。
@media print 中定义了打印时的样式，display: none 的 .no-print 元素（按钮等）不会出现在打印内容中。
单据表格、金额等内容在屏幕和打印中都会完整保留。

打包APK

打开HTML一键打包APK工具，选择包含 index.html 的项目目录，填写应用名称、包名等打包信息。打印功能依赖安卓系统打印服务，无需额外勾选权限，按默认配置打包即可。

确认配置后开始打包，等待工具生成APK文件。

安装并测试打印

将生成的APK安装到安卓手机，打开APP点击"打印"按钮，系统会弹出打印预览界面。在这里可以：

选择已连接的打印机（云打印机、局域网打印机等）直接打印；
在打印机列表中选择"另存为PDF"，把页面保存成PDF文件。

保存的PDF文件可以在手机的"文件"应用或相册中找到，方便发送给客户或存档。

常见问题

点击打印没有反应？ 请确认手机系统为Android 5.0及以上，旧系统没有内置打印服务。

列表中找不到打印机？ 安卓打印服务需要打印机与手机处于同一网络，或打印机已接入云打印服务。也可以直接使用"另存为PDF"，不依赖任何打印机。

打印内容不完整或分页异常？ 在 @media print 中适当调整宽度、字号和间距，避免内容超出纸张范围；需要强制分页时，可以在指定元素上添加 page-break-after: always 样式。

HTML打包EXE退出密码设置指南

Wed, 19 Aug 2026 21:10:33 +0800

HTML打包EXE工具提供了退出密码功能。启用后，打包生成的 EXE 在用户点击关闭按钮时，不会直接退出，而是先弹出密码输入窗口，只有输入正确的退出密码才能真正关闭程序。

对于放置在公共场所的展示机、教学机房的课件程序、无人值守的查询设备等场景，这个功能可以有效防止程序被误操作或他人随意关闭，保证内容持续稳定地展示和运行。

下载最新版本

适用场景

退出密码功能适合需要让程序保持长时间运行、不希望被随意关闭的使用方式：

展厅展示机：触摸屏一体机循环播放展示内容，防止参观者误触关闭按钮退出程序。
教学机房：学生机上的课件程序保持打开状态，避免学生上课途中关闭课件。
无人值守设备：自助查询机、叫号机等设备需要程序持续运行，只有管理人员输入密码才能退出维护。
儿童使用场景：孩子使用电脑学习时，防止其随手关闭学习软件去做其他操作。
会议和活动现场：现场大屏播放的程序避免被工作人员误关，影响活动流程。

简单来说，只要你的程序需要"一直开着"，退出密码就能帮上忙。

配置步骤

退出密码位于打包工具的静态密码标签页中，配置步骤如下：

打开 HTML打包EXE 工具，切换到静态密码标签页。
勾选启用退出密码功能。
勾选后，下方的退出密码输入框会变为可编辑状态，输入 1-16 位字母或数字作为退出密码。
正常执行打包操作，生成 EXE。

需要注意的是，未勾选"启用退出密码功能"时，退出密码输入框为灰色不可编辑状态。只有先勾选启用，才能填写和修改密码，避免误填了密码却没有实际启用功能的情况。

用户看到的效果

打包生成的 EXE 运行后，用户点击窗口关闭按钮时，会弹出"需要退出密码"的提示窗口，要求输入退出密码。

用户可以选择：

输入正确的退出密码并确认，程序正常退出。
输入错误密码，程序不会退出，需要重新输入。
点击取消，放弃退出操作，程序继续运行。

也就是说，不知道密码的用户无法通过常规方式关闭程序，只有掌握密码的管理人员才能退出。

和静态密码的区别

静态密码和退出密码位于同一个标签页，但作用阶段不同：

对比项	静态密码	退出密码
作用时机	打开程序时	关闭程序时
作用	输入正确密码才能进入软件	输入正确密码才能退出软件
适合场景	限制谁可以使用软件	防止软件被随意关闭
自定义信息	支持配置激活弹窗显示的信息	使用固定的提示信息

两者可以单独使用，也可以同时启用。例如一个付费展示项目，可以设置静态密码限制只有付费用户才能打开，再设置退出密码防止展示过程中被关闭，实现"进得来就出不去"的双重保护。

使用建议

妥善保管密码：退出密码设置后只有自己知道，请务必记录保存。如果忘记密码，程序将无法正常退出。
使用容易输入的密码：密码支持 1-16 位字母和数字，建议使用便于记忆和快速输入的组合，方便现场维护人员操作。
配合全屏使用效果更好：对于展示机场景，建议同时勾选全屏选项，隐藏窗口的放大、缩小、关闭按钮，配合退出密码形成更完整的防关闭方案。
注意内核支持：退出密码功能仅 Chrome 内核支持，打包时请确认内核选择为 Chrome 内核。
定期更换密码：如果程序长期放置在公共场所，建议定期更换退出密码并重新打包，避免密码泄露。

总结

HTML打包EXE工具的退出密码功能，配置简单但非常实用：勾选启用、填写密码、重新打包，三步即可让生成的 EXE 具备防关闭能力。

对于展厅展示、教学机房、无人值守设备等需要程序持续运行的场景，退出密码可以有效避免误操作和恶意关闭。如果再配合静态密码、全屏等选项一起使用，就能让打包出来的程序既安全又稳定。

用HTML打包APK制作视频播放器

Mon, 10 Aug 2026 19:32:34 +0800

HTML页面可以通过 video 标签播放网络和本地视频，结合浏览器全屏接口实现最大化播放，并在全屏时锁定横屏获得更好的观看体验。完成页面代码后，再通过HTML一键打包APK工具配置网络权限，即可生成支持视频播放和全屏播放的安卓APP。

工具官网：HTML一键打包APK工具官网

创建视频播放页面

在项目入口目录创建 index.html，包含视频播放区、最大化按钮和地址输入。

视频播放：使用 video 标签加载视频，添加 playsinline 属性保证内联播放。
最大化按钮：调用全屏接口，兼容WebView。
横屏锁定：全屏时自动横屏，退出竖屏。
地址加载：输入视频直链，切换测试视频。

视频标签需要添加 playsinline、webkit-playsinline 和 x5-playsinline 属性，避免跳转系统播放器：

<video playsinline webkit-playsinline x5-playsinline src="video.mp4"></video>

最大化按钮通过全屏接口处理标准接口和 webkit 前缀接口：

if (shell.requestFullscreen) shell.requestFullscreen();
else if (shell.webkitRequestFullscreen) shell.webkitRequestFullscreen();

打包成APK

保存代码到video-test.html，用工具载入并点击打包：

测试功能

安装APK后测试：

默认视频加载，播放暂停正常。
点最大化按钮进入全屏。
全屏时横屏锁定，退出恢复竖屏。
输入其他mp4链接，切换加载。
拖动进度条，从指定位置播放。

推荐H.264+AAC编码的mp4，避免HEVC等兼容问题。

如果全屏失效，检查系统横屏限制；视频加载失败，确认网络权限和地址可用。自动播放需要用户交互。

完整示例：

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>视频播放测试</title>
<style>
  * { margin: 0; padding: 0; box-sizing: border-box; }
  html, body {
    width: 100%; height: 100%;
    background: #000;
    font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
    overflow: hidden;
  }

  #player-wrap {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
  }

  /* 视频区域 */
  #video-box {
    position: relative;
    flex: 1;
    background: #000;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
  }
  video {
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: #000;
  }

  /* 最大化按钮（悬浮在视频右上角） */
  #btn-fullscreen {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 20;
    width: 44px;
    height: 44px;
    border: none;
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.55);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  #btn-fullscreen:active { background: rgba(255, 255, 255, 0.25); }
  #btn-fullscreen svg { width: 24px; height: 24px; }

  /* 底部控制栏 */
  #controls {
    position: relative;
    z-index: 10;
    background: #111;
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
    display: flex;
    flex-direction: column;
    gap: 10px;
  }

  #btn-play {
    width: 100%;
    padding: 14px;
    font-size: 17px;
    color: #fff;
    background: #1f80ff;
    border: none;
    border-radius: 10px;
    -webkit-tap-highlight-color: transparent;
  }
  #btn-play:active { opacity: 0.8; }

  .url-row { display: flex; gap: 8px; }
  #url-input {
    flex: 1;
    min-width: 0;
    padding: 12px;
    font-size: 14px;
    color: #fff;
    background: #222;
    border: 1px solid #333;
    border-radius: 8px;
    outline: none;
  }
  #btn-load {
    padding: 0 16px;
    font-size: 14px;
    color: #fff;
    background: #333;
    border: none;
    border-radius: 8px;
    white-space: nowrap;
  }

  #status {
    font-size: 12px;
    color: #888;
    word-break: break-all;
  }

  /* 全屏时隐藏控制栏 */
  :fullscreen #controls { display: none; }
  :-webkit-full-screen #controls { display: none; }
</style>
</head>
<body>

<div id="player-wrap">
  <div id="video-box">
    <video id="video" playsinline webkit-playsinline x5-playsinline preload="metadata"
      src="./BigBuckBunny.mp4"></video>

    <!-- 最大化按钮 -->
    <button id="btn-fullscreen" aria-label="最大化">
      <svg id="icon-max" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
        <path d="M8 3H5a2 2 0 0 0-2 2v3"/><path d="M16 3h3a2 2 0 0 1 2 2v3"/>
        <path d="M8 21H5a2 2 0 0 1-2-2v-3"/><path d="M16 21h3a2 2 0 0 0 2-2v-3"/>
      </svg>
      <svg id="icon-min" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="display:none">
        <path d="M8 3v3a2 2 0 0 1-2 2H3"/><path d="M21 8h-3a2 2 0 0 1-2-2V3"/>
        <path d="M3 16h3a2 2 0 0 1 2 2v3"/><path d="M16 21v-3a2 2 0 0 1 2-2h3"/>
      </svg>
    </button>
  </div>

  <div id="controls">
    <button id="btn-play">播放 / 暂停</button>
    <div class="url-row">
      <input id="url-input" type="url" placeholder="输入视频地址 (mp4/m3u8直链)">
      <button id="btn-load">加载</button>
    </div>
    <div id="status">就绪</div>
  </div>
</div>

<script>
(function () {
  var wrap = document.getElementById('player-wrap');
  var video = document.getElementById('video');
  var btnFs = document.getElementById('btn-fullscreen');
  var btnPlay = document.getElementById('btn-play');
  var btnLoad = document.getElementById('btn-load');
  var urlInput = document.getElementById('url-input');
  var status = document.getElementById('status');
  var iconMax = document.getElementById('icon-max');
  var iconMin = document.getElementById('icon-min');

  function setStatus(msg) { status.textContent = msg; }

  function isFullscreen() {
    return !!(document.fullscreenElement || document.webkitFullscreenElement ||
              document.webkitCurrentFullScreenElement);
  }

  function updateIcon() {
    var fs = isFullscreen();
    iconMax.style.display = fs ? 'none' : '';
    iconMin.style.display = fs ? '' : 'none';
  }

  // 最大化 / 退出全屏（兼容 iOS Safari 的 video 原生全屏）
  btnFs.addEventListener('click', function () {
    if (isFullscreen()) {
      if (document.exitFullscreen) document.exitFullscreen();
      else if (document.webkitExitFullscreen) document.webkitExitFullscreen();
      else if (video.webkitExitFullscreen) video.webkitExitFullscreen();
      return;
    }
    if (wrap.requestFullscreen) {
      wrap.requestFullscreen();
    } else if (wrap.webkitRequestFullscreen) {
      wrap.webkitRequestFullscreen();
    } else if (video.webkitEnterFullscreen) {
      // iOS Safari: 只对 video 元素有效
      video.webkitEnterFullscreen();
    } else {
      setStatus('当前环境不支持全屏 API');
    }
  });

  ['fullscreenchange', 'webkitfullscreenchange'].forEach(function (ev) {
    document.addEventListener(ev, updateIcon);
  });
  video.addEventListener('webkitendfullscreen', updateIcon);

  // 播放 / 暂停
  btnPlay.addEventListener('click', function () {
    if (video.paused) video.play().catch(function (e) { setStatus('播放失败: ' + e.message); });
    else video.pause();
  });

  // 加载自定义地址
  btnLoad.addEventListener('click', function () {
    var url = urlInput.value.trim();
    if (!url) { setStatus('请输入视频地址'); return; }
    video.src = url;
    video.load();
    video.play().catch(function () {});
    setStatus('已加载: ' + url);
  });

  // 状态反馈
  video.addEventListener('playing', function () { setStatus('播放中 ' + video.videoWidth + 'x' + video.videoHeight); });
  video.addEventListener('pause', function () { setStatus('已暂停'); });
  video.addEventListener('error', function () {
    var err = video.error;
    setStatus('加载出错: ' + (err ? 'code ' + err.code : '未知错误'));
  });
  video.addEventListener('ended', function () { setStatus('播放结束'); });
})();
</script>
</body>
</html>

HTML打包APK实现拍照、录像、录音和文件选择

Sat, 08 Aug 2026 20:44:05 +0800

HTML页面可以通过文件选择控件和浏览器媒体接口调用安卓设备的相机、摄像头、麦克风及文件选择器。完成页面代码后，再通过HTML一键打包APK工具配置相机和麦克风权限，即可生成支持拍照、录像、录音和文件选择的安卓APP。

如果你不了解HTML打包APK工具，想要进一步了解，可以查看官网：

HTML一键打包APK工具官网

创建文件采集页面

在HTML项目入口目录中创建 index.html，加入拍摄照片、录制视频、录制音频和选择文件四个入口。

拍摄照片：调用设备相机并优先进入后置摄像头拍照页面。
录制视频：调用设备摄像头并进入视频录制页面。
录制音频：申请麦克风权限，在网页内录制音频并生成可下载的音频文件。
选择文件：打开系统文件选择界面，并支持一次选择多个文件。也可以选择相机进行拍照或者录频

一个完整的html示例代码如下：

<!doctype html>
<html lang="zh-CN">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
  <meta name="theme-color" content="#f4f1ea">
  <title>移动端文件采集</title>
  <style>
    :root {
      color-scheme: light;
      --ink: #18201d;
      --muted: #65706b;
      --paper: #f4f1ea;
      --surface: #fffdf8;
      --line: #d8d5cd;
      --green: #18634b;
      --green-dark: #104b39;
      --coral: #e56f51;
      --shadow: 0 12px 32px rgba(24, 32, 29, 0.09);
    }

    * {
      box-sizing: border-box;
      letter-spacing: 0;
    }

    body {
      min-width: 320px;
      min-height: 100vh;
      margin: 0;
      color: var(--ink);
      background:
        linear-gradient(rgba(24, 99, 75, 0.055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(24, 99, 75, 0.055) 1px, transparent 1px),
        var(--paper);
      background-size: 24px 24px;
      font-family: "Noto Sans SC", "Microsoft YaHei UI", sans-serif;
    }

    button,
    input {
      font: inherit;
    }

    [hidden] {
      display: none !important;
    }

    .shell {
      width: min(100%, 560px);
      min-height: 100vh;
      margin: 0 auto;
      padding: max(24px, env(safe-area-inset-top)) 18px max(32px, env(safe-area-inset-bottom));
    }

    header {
      position: relative;
      padding: 12px 4px 25px;
    }

    header::after {
      position: absolute;
      right: 4px;
      bottom: 18px;
      width: 52px;
      height: 5px;
      background: var(--coral);
      content: "";
      transform: rotate(-3deg);
    }

    .eyebrow {
      margin: 0 0 8px;
      color: var(--green);
      font-size: 12px;
      font-weight: 800;
      text-transform: uppercase;
    }

    h1 {
      margin: 0;
      font-family: "STSong", "SimSun", serif;
      font-size: clamp(32px, 10vw, 48px);
      font-weight: 700;
      line-height: 1.08;
    }

    .subtitle {
      max-width: 360px;
      margin: 12px 0 0;
      color: var(--muted);
      font-size: 14px;
      line-height: 1.7;
    }

    .actions {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
    }

    .picker {
      position: relative;
      min-width: 0;
      min-height: 132px;
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--surface);
      box-shadow: 0 4px 12px rgba(24, 32, 29, 0.035);
    }

    .picker:focus-within {
      outline: 3px solid rgba(24, 99, 75, 0.2);
      outline-offset: 2px;
    }

    .picker input {
      position: absolute;
      width: 1px;
      height: 1px;
      opacity: 0;
      pointer-events: none;
    }

    .picker label {
      display: flex;
      width: 100%;
      min-height: 132px;
      padding: 17px;
      cursor: pointer;
      flex-direction: column;
      justify-content: space-between;
      -webkit-tap-highlight-color: transparent;
    }

    .picker-button {
      display: flex;
      width: 100%;
      min-height: 132px;
      padding: 17px;
      border: 0;
      color: inherit;
      background: transparent;
      cursor: pointer;
      flex-direction: column;
      justify-content: space-between;
      text-align: left;
      -webkit-tap-highlight-color: transparent;
    }

    .picker label:active,
    .picker-button:active {
      background: #f2f7f3;
    }

    .icon {
      display: grid;
      width: 42px;
      height: 42px;
      border-radius: 50%;
      color: #fff;
      background: var(--green);
      font-size: 20px;
      place-items: center;
    }

    .picker:nth-child(2) .icon,
    .picker:nth-child(4) .icon {
      background: var(--coral);
    }

    .label-title {
      display: block;
      margin-bottom: 4px;
      font-size: 16px;
      font-weight: 800;
    }

    .label-meta {
      display: block;
      overflow: hidden;
      color: var(--muted);
      font-size: 11px;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .result {
      margin-top: 18px;
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--surface);
      box-shadow: var(--shadow);
      animation: rise 240ms ease-out;
    }

    .result-header {
      display: flex;
      min-height: 52px;
      padding: 12px 14px;
      border-bottom: 1px solid var(--line);
      align-items: center;
      justify-content: space-between;
      gap: 12px;
    }

    .result-header h2 {
      margin: 0;
      font-size: 15px;
    }

    .clear {
      width: 34px;
      height: 34px;
      padding: 0;
      border: 1px solid var(--line);
      border-radius: 50%;
      color: var(--ink);
      background: transparent;
      cursor: pointer;
      font-size: 20px;
      line-height: 1;
    }

    .file-list {
      margin: 0;
      padding: 0;
      list-style: none;
    }

    .file-list li {
      display: flex;
      gap: 8px;
      min-height: 68px;
      padding: 10px 14px;
      border-top: 1px solid var(--line);
      align-items: center;
      font-size: 12px;
    }

    .file-list li:first-child {
      border-top: 0;
    }

    .file-info {
      min-width: 0;
      flex: 1;
    }

    .file-name {
      display: block;
      overflow: hidden;
      font-weight: 700;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .file-size {
      display: block;
      margin-top: 4px;
      color: var(--muted);
    }

    .download-button {
      min-width: 76px;
      min-height: 40px;
      padding: 0 12px;
      border: 1px solid var(--green);
      border-radius: 6px;
      color: #fff;
      background: var(--green);
      cursor: pointer;
      font-weight: 800;
      flex-shrink: 0;
    }

    .recorder {
      margin-top: 18px;
      padding: 18px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--surface);
      box-shadow: var(--shadow);
    }

    .recorder h2 {
      margin: 0 0 6px;
      font-size: 18px;
    }

    .recorder-status {
      min-height: 42px;
      margin: 0 0 14px;
      color: var(--muted);
      font-size: 13px;
      line-height: 1.6;
    }

    .recorder-controls {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 10px;
    }

    .recorder-controls button,
    .audio-fallback {
      min-height: 46px;
      border: 1px solid var(--green);
      border-radius: 6px;
      color: #fff;
      background: var(--green);
      cursor: pointer;
      font-weight: 800;
    }

    .recorder-controls button:disabled {
      cursor: not-allowed;
      opacity: 0.45;
    }

    .audio-fallback {
      display: grid;
      margin-top: 10px;
      border-color: var(--line);
      color: var(--ink);
      background: transparent;
      font-size: 13px;
      place-items: center;
    }

    @keyframes rise {
      from { opacity: 0; transform: translateY(8px); }
      to { opacity: 1; transform: translateY(0); }
    }

    @media (min-width: 480px) {
      .shell { padding-inline: 26px; }
      .picker label { min-height: 144px; }
    }

    @media (prefers-reduced-motion: reduce) {
      .result { animation: none; }
    }
  </style>
</head>
<body>
  <main class="shell">
    <header>
      <p class="eyebrow">Mobile capture lab</p>
      <h1>从设备中采集文件</h1>
      <p class="subtitle">点击一种方式，系统会打开对应的拍摄、录制或文件选择界面。</p>
    </header>

    <section class="actions" aria-label="文件采集方式">
      <div class="picker">
        <input id="camera" type="file" accept="image/*" capture="environment">
        <label for="camera">
          <span class="icon" aria-hidden="true">●</span>
          <span><span class="label-title">拍摄照片</span><span class="label-meta">设备后置相机</span></span>
        </label>
      </div>

      <div class="picker">
        <input id="video" type="file" accept="video/*" capture="environment">
        <label for="video">
          <span class="icon" aria-hidden="true">▶</span>
          <span><span class="label-title">录制视频</span><span class="label-meta">设备摄像头</span></span>
        </label>
      </div>

      <div class="picker">
        <button id="openRecorder" class="picker-button" type="button">
          <span class="icon" aria-hidden="true">♪</span>
          <span><span class="label-title">录制音频</span><span class="label-meta">设备麦克风</span></span>
        </button>
      </div>

      <div class="picker">
        <input id="files" type="file" multiple>
        <label for="files">
          <span class="icon" aria-hidden="true">＋</span>
          <span><span class="label-title">选择文件</span><span class="label-meta">支持多选</span></span>
        </label>
      </div>
    </section>

    <section id="recorder" class="recorder" aria-live="polite" hidden>
      <h2>麦克风录音</h2>
      <p id="recorderStatus" class="recorder-status">点击“开始录音”，并允许浏览器使用麦克风。</p>
      <div class="recorder-controls">
        <button id="startRecording" type="button">开始录音</button>
        <button id="stopRecording" type="button" disabled>停止并使用</button>
      </div>
      <input id="audioFallback" type="file" accept="audio/*" hidden>
      <label class="audio-fallback" for="audioFallback">无法录音？选择已有音频</label>
    </section>

    <section id="result" class="result" aria-live="polite" hidden>
      <div class="result-header">
        <h2 id="resultTitle">处理完成</h2>
        <button id="clearButton" class="clear" type="button" aria-label="清除选择" title="清除选择">×</button>
      </div>
      <ul id="fileList" class="file-list"></ul>
    </section>
  </main>

  <script>
    const inputs = document.querySelectorAll('input[type="file"]');
    const result = document.getElementById('result');
    const resultTitle = document.getElementById('resultTitle');
    const fileList = document.getElementById('fileList');
    const clearButton = document.getElementById('clearButton');
    const openRecorder = document.getElementById('openRecorder');
    const recorderPanel = document.getElementById('recorder');
    const recorderStatus = document.getElementById('recorderStatus');
    const startRecording = document.getElementById('startRecording');
    const stopRecording = document.getElementById('stopRecording');
    let activeInput = null;
    let microphoneStream = null;
    let recordingAudioContext = null;
    let recordingSource = null;
    let recordingProcessor = null;
    let recordingGain = null;
    let pcmChunks = [];
    let pcmSampleCount = 0;
    let isRecording = false;
    let recordingTimer = null;
    let recordingStartedAt = 0;

    function formatSize(bytes) {
      if (bytes === 0) return '0 B';
      const units = ['B', 'KB', 'MB', 'GB'];
      const unitIndex = Math.min(Math.floor(Math.log(bytes) / Math.log(1024)), units.length - 1);
      return `${(bytes / (1024 ** unitIndex)).toFixed(unitIndex ? 1 : 0)} ${units[unitIndex]}`;
    }

    function clearSelection() {
      if (activeInput) activeInput.value = '';
      activeInput = null;
      fileList.replaceChildren();
      result.hidden = true;
    }

    function downloadFile(file) {
      const reader = new FileReader();
      reader.addEventListener('load', () => {
        const link = document.createElement('a');
        link.href = reader.result;
        link.download = file.name || `文件_${Date.now()}`;
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
      });
      reader.addEventListener('error', () => {
        resultTitle.textContent = '下载失败，请重试';
      });
      reader.readAsDataURL(file);
    }

    function displayFiles(files, input = null) {
      if (!files.length) return;
      if (activeInput && activeInput !== input) activeInput.value = '';
      activeInput = input;
      resultTitle.textContent = files.length > 1 ? `${files.length} 个文件处理完成` : '处理完成';
      fileList.replaceChildren(...files.map((file) => {
        const item = document.createElement('li');
        const info = document.createElement('span');
        const name = document.createElement('span');
        const size = document.createElement('span');
        const downloadButton = document.createElement('button');
        info.className = 'file-info';
        name.className = 'file-name';
        name.textContent = file.name;
        size.className = 'file-size';
        size.textContent = formatSize(file.size);
        downloadButton.className = 'download-button';
        downloadButton.type = 'button';
        downloadButton.textContent = '↓ 下载';
        downloadButton.addEventListener('click', () => downloadFile(file));
        info.append(name, size);
        item.append(info, downloadButton);
        return item;
      }));
      result.hidden = false;
      result.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
    }

    function stopMicrophone() {
      if (recordingTimer) clearInterval(recordingTimer);
      recordingTimer = null;
      isRecording = false;
      if (recordingProcessor) recordingProcessor.disconnect();
      if (recordingSource) recordingSource.disconnect();
      if (recordingGain) recordingGain.disconnect();
      recordingProcessor = null;
      recordingSource = null;
      recordingGain = null;
      if (microphoneStream) microphoneStream.getTracks().forEach((track) => track.stop());
      microphoneStream = null;
      if (recordingAudioContext && recordingAudioContext.state !== 'closed') {
        recordingAudioContext.close().catch(() => {});
      }
      recordingAudioContext = null;
    }

    function createWavFile(chunks, sampleCount, sampleRate) {
      const buffer = new ArrayBuffer(44 + sampleCount * 2);
      const view = new DataView(buffer);

      function writeText(offset, text) {
        for (let index = 0; index < text.length; index += 1) {
          view.setUint8(offset + index, text.charCodeAt(index));
        }
      }

      writeText(0, 'RIFF');
      view.setUint32(4, 36 + sampleCount * 2, true);
      writeText(8, 'WAVE');
      writeText(12, 'fmt ');
      view.setUint32(16, 16, true);
      view.setUint16(20, 1, true);
      view.setUint16(22, 1, true);
      view.setUint32(24, sampleRate, true);
      view.setUint32(28, sampleRate * 2, true);
      view.setUint16(32, 2, true);
      view.setUint16(34, 16, true);
      writeText(36, 'data');
      view.setUint32(40, sampleCount * 2, true);

      let offset = 44;
      chunks.forEach((chunk) => {
        for (let index = 0; index < chunk.length; index += 1) {
          const sample = Math.max(-1, Math.min(1, chunk[index]));
          view.setInt16(offset, sample < 0 ? sample * 0x8000 : sample * 0x7fff, true);
          offset += 2;
        }
      });

      return new File([buffer], `recording-${Date.now()}.wav`, { type: 'audio/wav' });
    }

    inputs.forEach((input) => {
      input.addEventListener('change', () => {
        const files = Array.from(input.files || []);
        displayFiles(files, input);
      });
    });

    openRecorder.addEventListener('click', () => {
      recorderPanel.hidden = false;
      recorderPanel.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
    });

    startRecording.addEventListener('click', async () => {
      const AudioContextClass = window.AudioContext || window.webkitAudioContext;
      if (!navigator.mediaDevices?.getUserMedia || !AudioContextClass) {
          recorderStatus.textContent = '当前浏览器不支持网页录音，请使用下方按钮选择已有音频。';
        return;
      }

      try {
        microphoneStream = await navigator.mediaDevices.getUserMedia({
          audio: { channelCount: 1, echoCancellation: true, noiseSuppression: true }
        });
        recordingAudioContext = new AudioContextClass();
        await recordingAudioContext.resume();
        recordingSource = recordingAudioContext.createMediaStreamSource(microphoneStream);
        recordingProcessor = recordingAudioContext.createScriptProcessor(4096, 1, 1);
        recordingGain = recordingAudioContext.createGain();
        recordingGain.gain.value = 0;
        pcmChunks = [];
        pcmSampleCount = 0;
        isRecording = true;
        recordingProcessor.onaudioprocess = (event) => {
          if (!isRecording) return;
          const samples = new Float32Array(event.inputBuffer.length);
          event.inputBuffer.copyFromChannel(samples, 0);
          pcmChunks.push(samples);
          pcmSampleCount += samples.length;
        };
        recordingSource.connect(recordingProcessor);
        recordingProcessor.connect(recordingGain);
        recordingGain.connect(recordingAudioContext.destination);
        recordingStartedAt = Date.now();
        recorderStatus.textContent = '正在录音 00:00';
        recordingTimer = setInterval(() => {
          const elapsed = Math.floor((Date.now() - recordingStartedAt) / 1000);
          const minutes = String(Math.floor(elapsed / 60)).padStart(2, '0');
          const seconds = String(elapsed % 60).padStart(2, '0');
          recorderStatus.textContent = `正在录音 ${minutes}:${seconds}`;
        }, 1000);
        startRecording.disabled = true;
        stopRecording.disabled = false;
      } catch (error) {
        stopMicrophone();
        const insecure = !window.isSecureContext;
        recorderStatus.textContent = insecure
          ? '浏览器只允许 HTTPS 页面使用麦克风，请通过 HTTPS 打开本页。'
          : '未能使用麦克风，请检查浏览器的网站麦克风权限。';
      }
    });

    stopRecording.addEventListener('click', () => {
      if (!isRecording || !recordingAudioContext || !pcmSampleCount) return;
      isRecording = false;
      const sampleRate = recordingAudioContext.sampleRate;
      const duration = pcmSampleCount / sampleRate;
      const recording = createWavFile(pcmChunks, pcmSampleCount, sampleRate);
      stopMicrophone();
      displayFiles([recording]);
      recorderStatus.textContent = `录音处理完成（${duration.toFixed(1)} 秒），可在下方下载。`;
      startRecording.disabled = false;
      stopRecording.disabled = true;
    });

    clearButton.addEventListener('click', clearSelection);
    window.addEventListener('pagehide', () => {
      stopMicrophone();
    });
  </script>
</body>
</html>

页面中的拍照和录像入口可以分别使用带有 capture 属性的文件控件。拍照入口设置 accept="image/*"，录像入口设置 accept="video/*"，安卓APP会根据文件类型打开对应的系统采集页面。

拍摄照片：

<input type="file" accept="image/*" capture="environment" />

录制视频：

<input type="file" accept="video/*" capture="environment" />

音频录制可以通过 navigator.mediaDevices.getUserMedia() 获取麦克风音频流，再使用浏览器音频接口处理并生成音频文件。普通文件入口不设置 capture，因此会保留系统提供的文件、照片和视频选择方式。

打包APK并配置权限

打开HTML一键打包APK工具，选择包含 index.html 的项目目录，填写应用名称、包名等打包信息。

在权限设置中勾选“相机权限”和“麦克风权限”：

相机权限用于拍摄照片、录制视频以及网页调用摄像头。
麦克风权限用于网页录音；录制带声音的视频时也需要该权限。
普通文件选择通过安卓系统文件选择器完成，用户只会授权当前选择的文件。

确认配置后开始打包，等待工具生成APK文件。

安装并测试功能

将生成的APK安装到安卓手机，依次测试页面中的四个入口：

点击“拍摄照片”，确认APP直接打开相机拍照页面。
点击“录制视频”，确认APP直接打开视频录制页面，并且能够正常保存视频。
点击“录制音频”，首次使用时允许APP访问麦克风，停止录音后确认页面能够显示并下载录音文件。
点击“选择文件”，确认系统文件选择界面正常打开，并且可以选择一个或多个文件。

不同品牌手机使用的相机和文件管理应用可能不同，因此系统界面的样式会有差异。capture 属性用于告诉安卓当前需要拍照还是录像，但最终的采集界面由手机系统和默认相机应用提供。

如果拍照或录像入口没有打开对应页面，请先检查APP的相机权限；如果网页无法开始录音，请检查麦克风权限。对于在线页面，网页录音通常还要求通过HTTPS加载；打包到APP内的本地页面则由WebView和APP权限共同控制。

HTML项目打包APK：二维码扫码功能实现

Fri, 07 Aug 2026 21:26:06 +0800

在HTML项目中，可以使用 html5-qrcode 调用手机摄像头并识别二维码。完成页面代码后，再通过HTML一键打包APK工具勾选相机权限，即可生成支持扫码的安卓APP。

如果你不了解HTML打包APK工具, 想要进一步了解, 可以查看官网:

HTML一键打包APK工具官网

创建扫码页面

在HTML项目入口目录中创建 index.html，写入以下代码。页面点击“开始扫码”后会申请摄像头权限，识别成功时停止摄像头并显示二维码内容。

<!doctype html>
<html lang="zh-CN">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
        <title>二维码扫码</title>
        <script src="https://unpkg.com/html5-qrcode@2.3.8/html5-qrcode.min.js"></script>
        <style>
            * {
                box-sizing: border-box;
            }

            body {
                min-height: 100vh;
                margin: 0;
                padding: 20px;
                display: grid;
                place-items: center;
                font-family: 'Microsoft YaHei', sans-serif;
                background: #f4f7f5;
                color: #17221c;
            }

            main {
                width: min(100%, 440px);
            }

            h1 {
                margin: 0 0 8px;
                font-size: 30px;
            }

            p {
                margin: 0 0 18px;
                color: #526159;
            }

            #reader {
                width: 100%;
                min-height: 280px;
                overflow: hidden;
                border: 1px solid #cad4ce;
                border-radius: 8px;
                background: #101511;
            }

            #reader video {
                object-fit: cover;
            }

            .actions {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 10px;
                margin-top: 14px;
            }

            button {
                min-height: 48px;
                border: 0;
                border-radius: 6px;
                padding: 0 16px;
                font: inherit;
                font-weight: 700;
            }

            #startButton {
                background: #197447;
                color: white;
            }

            #stopButton {
                background: #dfe6e2;
                color: #26352d;
            }

            button:disabled {
                opacity: 0.5;
            }

            #status {
                min-height: 24px;
                margin-top: 12px;
                font-size: 14px;
                color: #526159;
            }
        </style>
    </head>
    <body>
        <main>
            <h1>二维码扫码</h1>
            <p>点击开始后，将摄像头对准二维码。</p>
            <div id="reader" aria-label="摄像头扫码区域"></div>
            <div class="actions">
                <button id="startButton" type="button">开始扫码</button>
                <button id="stopButton" type="button" disabled>停止扫码</button>
            </div>
            <div id="status" role="status">等待开始</div>
        </main>

        <script>
            const reader = new Html5Qrcode('reader');
            const startButton = document.getElementById('startButton');
            const stopButton = document.getElementById('stopButton');
            const status = document.getElementById('status');
            let isScanning = false;
            let resultHandled = false;

            async function stopScanning() {
                if (!isScanning) return;

                await reader.stop();
                isScanning = false;
                startButton.disabled = false;
                stopButton.disabled = true;
                status.textContent = '扫码已停止';
            }

            async function startScanning() {
                startButton.disabled = true;
                status.textContent = '正在请求摄像头权限...';
                resultHandled = false;

                try {
                    await reader.start(
                        { facingMode: 'environment' },
                        { fps: 10, qrbox: { width: 240, height: 240 } },
                        async decodedText => {
                            if (resultHandled) return;
                            resultHandled = true;
                            await stopScanning();
                            alert(decodedText);
                        },
                        () => {}
                    );

                    isScanning = true;
                    stopButton.disabled = false;
                    status.textContent = '正在扫描...';
                } catch (error) {
                    startButton.disabled = false;
                    status.textContent = '无法打开摄像头，请检查相机权限。';
                    console.error(error);
                }
            }

            startButton.addEventListener('click', startScanning);
            stopButton.addEventListener('click', () => {
                stopScanning().catch(console.error);
            });

            window.addEventListener('pagehide', () => {
                if (isScanning) reader.stop().catch(() => {});
            });
        </script>
    </body>
</html>

示例通过 CDN 加载 html5-qrcode。如果APP需要完全离线运行，请提前下载 html5-qrcode.min.js 放入项目目录，并将页面中的脚本地址改为本地相对路径。

打包APK并勾选相机权限

打开HTML一键打包APK工具，选择包含 index.html 的项目目录，填写应用名称、包名等打包信息。在权限设置中勾选“相机权限”，否则APP无法调用手机摄像头。

确认配置后开始打包，等待工具生成APK文件。

安装并测试扫码

将生成的APK安装到安卓手机。首次点击“开始扫码”时，系统会弹出相机授权提示，选择允许后，将摄像头对准二维码。识别成功后，页面会停止扫描并弹出二维码中的文字或链接。

如果页面提示无法打开摄像头，请先在手机的应用权限设置中确认相机权限已经允许。扫码页面使用 CDN 脚本时，还需要确保手机能够正常访问网络；改用本地脚本后则不受此限制。

C#混淆选项选择指南：恒盾加密大师详解

Tue, 04 Aug 2026 19:56:39 +0800

恒盾C#混淆加密大师提供了基本保护、垃圾代码注入、代码混淆和重命名等多类选项。这些功能面向不同的攻击场景：部分用于阻止调试和反编译工具；另一些增加反编译代码理解难度；还有直接改变类型、函数和字段的命名。

实际选用时，无需不加区分地启用全部选项。更合理的做法是先理解每类功能的作用域，再根据项目类型（DLL、控制台程序、WinForms、WPF等）逐步启用，并在每次调整后完成启动和核心功能测试。

官方网址

四类混淆选项分别解决什么问题

软件中的选项可划分为四类：

基本保护选项：针对调试器、反编译工具、程序篡改和虚拟机运行环境进行防护。
注入功能选项：向程序集注入无用字段、指令、函数、类型或字符串，增加静态分析干扰。
混淆功能选项：改变代码、数据或程序集结构，使反编译结果更难还原。
重命名选项：修改Module、字段、函数、命名空间、参数、类型和Assembly等标识符。

这四类功能可以灵活组合：重命名负责降低代码可读性；字符串和流程类选项保护关键逻辑；基本保护针对常见分析工具和运行环境形成额外防线。

基本保护选项

基本保护主要面向调试、反编译、篡改和运行环境检测。部分功能在检测到特定行为时会终止程序，因此启用后需在目标用户真实环境中测试。

防调试、防DnSpy与防断点

防调试：检测Visual Studio或其他调试工具附加行为，发现后自动退出。
防DnSpy：针对DnSpy动态调试检测，发现后退出。
防断点：检测程序运行中异常超长停顿，防止通过断点跟踪代码。

这三个选项与运行时分析相关，适合保护授权校验、关键算法和商业逻辑。由于性能较弱的设备或特殊环境可能影响检测效果，建议先在测试版启用，再覆盖不同配置设备验证。

防ILDasm、防ILSpy与防de4dot

防ILDasm：阻止系统ILDasm正常反编译处理后的DLL或EXE。
防ILSpy：让处理后程序集无法被ILSpy正常解析。
防de4dot：干扰de4dot自动反混淆。

这组功能用于阻止常见静态分析和自动还原工具。可与重命名、流程混淆、字符串加密搭配，让分析者难以打开程序集，也难以理解已反编译代码。

防篡改与加壳

防篡改（仅限EXE）：校验EXE是否被修改，改动后无法运行。
加壳（仅限EXE）：加密原生程序到外层EXE，避免静态反编译。

仅适用于EXE。防篡改适合需保证文件完整性的桌面程序；加壳适合整体隐藏原始程序集。处理后需检查数字签名、杀毒兼容性及更新流程。

防虚拟机

防虚拟机检测程序是否运行在虚拟机中，检测到后停止运行。适合禁止虚拟机运行的应用，但不适合云桌面、虚拟化服务器、自动化测试或沙箱环境。启用前需确认用户部署环境，若正常客户可能使用VMware、Hyper-V等，建议谨慎。

注入功能选项

注入功能通过增加干扰内容，让反编译后程序集结构更复杂，而非替代关键代码加密。

垃圾域、垃圾函数与垃圾类型

垃圾域：向类型中注入大量无用字段。
垃圾函数：注入不参与业务的函数。
垃圾类型：注入额外类型。

这些选项让反编译工具显示更多成员和类型，增加定位真实业务代码的难度。对体积敏感项目需比较处理前后文件大小和加载表现。

垃圾空指令与垃圾字符串

垃圾空指令：在IL指令中注入无用指令，增加阅读难度。
垃圾字符串：注入无用字符串，干扰基于字符串搜索的定位。

垃圾空指令适合配合流程混淆；垃圾字符串干扰接口地址、提示文本或关键字检索。主要增加分析成本。

混淆功能选项

混淆功能处理程序集信息、代码流程、常量、调用关系等。一些选项影响较大，建议从常用选项开始逐步增加强度。

程序集与文件结构混淆

文件信息混淆：修改程序内部名称、Assembly信息。
文件时间混淆：修改加密文件时间戳。
DOS头混淆：修改EXE的DOS头，去除常见可识别字符串。
混淆引用列表：处理程序集引用列表，使依赖关系更模糊。
加密资源文件：加密程序集中的资源，防止直接查看。

若程序依赖程序集名称、文件版本、反射、插件扫描或资源加载路径，需重点验证。加密资源文件还需测试图片、语言资源等能否正常读取。

流程与函数调用混淆

流程混淆：打乱函数内部指令并增加跳转，使控制流程难以理解。
函数调用混淆：通过函数token调用目标函数，降低可读性。
链式函数混淆：将一次调用转为多层嵌套调用，增加分析难度。
异步混淆：将部分代码转换为异步调用形式，使静态跟踪更困难。
错误函数体混淆：加入错误指令，干扰静态分析工具解析函数体。

流程混淆是核心算法保护的首选。函数调用、链式和异步混淆进一步改变结构，适合不依赖特殊调用顺序的业务代码。对UI线程、启动入口、COM调用、反射调用等需逐项测试。

字符串保护

字符串加密：加密字符串，避免静态分析直接找到关键文本。
字符串拆分：将完整字符串拆成多个组合，降低搜索效率。
字符串隐藏：加密后存放到原生函数，使反编译工具无法获取值。

字符串加密适合保护接口地址、协议字段、算法参数；拆分可干扰简单检索；隐藏强度更高，适合少量重要字符串。配置文件中的密码、令牌需用专门密钥管理方案。

数字、布尔值与小数保护

布尔混淆：将布尔值转为更难识别的基础类型表达。
数字混淆：将整型数字转化为复杂运算，隐藏常量。
数字隐藏：将整型数字加密存放到原生函数。
小数混淆：加密代码中的小数，避免直接看到原始值。

适合保护算法常量、状态标识、限制数值和业务参数。与流程混淆配合，静态分析难度更高。涉及浮点精度或高频计算的代码需重点验证。

函数体隐藏与原生化EXE

函数体隐藏：加密函数体，使反编译工具无法查看内部代码。
原生化EXE：将EXE转为原生程序，C#反编译工具无法分析IL。

适合保护核心实现。函数体隐藏可加强保护重要算法；原生化EXE从整体改变程序形态，仅适用于EXE。启用后需完整测试启动、异常处理、依赖加载等。

重命名选项

重命名是C#混淆中最直观的保护，将具有业务含义的标识符替换为难以理解的新名称，移除语义。

重命名模式怎么选

软件提供五种模式：

字母数字模式：字母数字组合，适合常规项目。
UUID模式：长名称，增加阅读和检索难度。
特殊字符模式：使用特殊字符，适合更高阅读干扰。
Base64模式：Base64风格字符串。
英文单词模式：英文单词替换，表面可读但失去真实含义。

不同模式影响外观，不改变勾选对象。日常可从字母数字模式开始；若外部工具或日志系统对字符有限制，避免使用特殊字符模式。

可以重命名哪些对象

Module重命名：修改全局Module名称。
域重命名：修改类中字段名称。
函数重命名：修改方法名称。
命名空间重命名：修改类型所在命名空间。
参数重命名：修改函数参数名称。
类型重命名：修改类、结构体等类型名称。
Assembly重命名：修改程序集名称。

普通内部代码可优先启用字段、函数、参数和类型重命名。涉及反射、依赖注入、序列化、XAML等时，名称可能是运行时契约，需先确认。Assembly重命名影响依赖程序集、插件加载等，处理多个DLL时需验证引用解析。

不同项目可以怎样组合

普通桌面程序

先启用函数、字段、参数和类型重命名，加入字符串加密、数字混淆和流程混淆。确认功能正常后，再根据需要增加防调试、防ILSpy、防DnSpy或加壳。

供第三方调用的类库

优先保护内部类型和实现。公开API、反射入口、序列化模型需谨慎重命名，否则可能导致调用方无法找到成员。字符串加密、流程混淆和函数体隐藏可保护不对外暴露的核心逻辑。

包含重要算法的EXE

组合流程混淆、字符串隐藏、数字隐藏、函数调用混淆和函数体隐藏。完成兼容性测试后，考虑加壳、防篡改或原生化EXE。高强度选项应逐项增加并保留测试结果。

使用时需要注意什么

保护强度越高并不代表越适合所有项目，稳定运行是前提。
依赖反射、序列化、XAML、插件机制等项目，需重点测试重命名兼容性。
防篡改、加壳和原生化EXE仅限EXE，不能用于DLL。
防虚拟机可能影响云桌面、虚拟化服务器中的正常用户。
处理后文件应在目标操作系统、架构和性能配置上验证。
混淆用于提高逆向成本，不能替代权限控制、签名校验、密钥管理和服务端安全。

总结

恒盾C#混淆加密大师各类选项承担不同作用：基本保护应对调试和反编译工具；注入功能增加干扰；混淆功能隐藏代码流程和关键数据；重命名移除业务语义。

对多数项目，可从重命名、字符串加密、数字混淆和流程混淆开始，再根据程序类型增加防调试、工具防护、函数体隐藏、加壳或原生化EXE。逐步启用、逐步测试，在保护强度和兼容性之间取得平衡。

C#混淆随机种子的作用与使用教程

Mon, 03 Aug 2026 21:31:19 +0800

在混淆 C# 应用时，很多开发者会发现，即使输入文件和配置一模一样，每次生成的结果也可能不同。这是因为恒盾C#混淆加密大师默认引入了随机性，避免每次构建都产生完全相同的结果。但在某些场景下——比如排查问题、做回归测试、或者对接 CI/CD 流程——我们反而希望结果是可复现的，以便对比和定位。

这时，随机种子就派上用场了。它本质上是一个控制混淆过程随机行为的开关。填上一个固定的值后，对于同一个 EXE 或 DLL，在配置完全一致的情况下，每次处理都会得到相同的结果；如果不填，软件就会自动随机处理，保持构建之间的差异。

随机种子有什么作用

随机种子让开发者可以在“可复现的结果”和“每次结果随机”之间灵活选择。

填写固定种子：适用于重复构建、对比结果、排查问题，或者需要保持发布流程一致。
留空不填：软件自动随机，适用于希望不同构建产生不同混淆结果的日常发布。

需要特别注意：随机种子不会改变你启用了哪些保护功能，也不会替代字符串加密、流程混淆或重命名。它只影响结果是否容易复现。

哪些场景适合设置固定种子

1. 排查混淆后的运行问题

如果程序在混淆后出现异常，保留输入文件、配置和随机种子，重新处理一次。固定种子能减少重复测试时的结果差异，让问题更容易定位。

2. 进行版本回归测试

在同一个版本上反复验证启动、登录、授权、读写等核心功能时，固定种子可以提供更稳定的测试条件，方便对比不同保护选项的效果。

3. 接入自动化构建和 CI/CD

将混淆步骤集成到构建脚本或持续集成流水线中后，为项目指定固定种子，可以让开发机、构建机和流水线使用相同的条件，便于复现和排错。

4. 团队共享混淆配置

多人维护同一个项目时，把随机种子和其他选项一起保存到配置文件里，团队成员加载统一配置后，就能减少因随机结果带来的额外沟通成本。

5. 保存可复现的发布记录

对于重要版本，把当次使用的输入文件、配置、软件版本和种子一起归档。以后要回溯或者重新生成该版本时，可以直接恢复当时的条件。

如何使用随机种子

打开恒盾C#混淆加密大师，选择需要处理的 DLL 或 EXE。
根据项目需求，勾选代码保护、代码混淆和重命名等选项。
在主界面下方找到“随机种子”输入框。
输入便于识别的字母或数字，例如项目名称与版本号的组合。
选择输出路径，点击“开始处理”。
如果需要保留当前设置，点击“保存配置”。

随机种子支持字母和数字。建议使用团队容易识别、能长期保存的内容，例如：

MyProduct150
Release202608
ClientA2026

如果不需要复现结果，保持输入框为空即可。

固定种子与留空随机应该怎么选

如果当前工作重点是测试、排错、回归或自动化构建，建议设置固定种子。这样多次处理的结果更容易比较，也便于其他开发者复现。

如果重点是正式发布，并且希望不同批次的混淆结果保持差异，可以留空或者每个版本使用不同的种子。

一个常见的策略是：测试阶段固定使用项目级种子，正式发布时按版本换用不同的种子。这样既方便日常验证，也能让不同版本之间保持足够的差异。

使用时需要注意什么

相同种子需要搭配相同的输入文件和配置，才能得到一致的结果。
输入程序、保护选项或软件版本变化后，结果也可能跟着变。
随机种子不是密码，不要在里面填写账号、密码等敏感信息。
换随机种子不等于提高保护强度，实际效果取决于你启用的混淆和加密功能。
需要复现正式版本时，记得同时保存输入文件、配置、版本号和种子。

总结

恒盾C#混淆加密大师的随机种子功能，让开发者可以根据实际需求决定混淆结果的稳定性。在排查问题、回归测试、团队协作和 CI/CD 场景中，固定种子可以大幅简化构建管理；而在需要不同版本保持差异的正式发布中，则可以留空或更换种子。合理使用这个配置项，可以让 C# 代码混淆的流程更加清晰、可控，也更适合长期的维护和自动化发布。

YLong软件

安卓手机更新WebView内核全攻略

WebView版本为何至关重要

查询当前WebView版本的方法

通用更新方法（适用于多数机型）

各品牌手机专属更新方案

华为（HarmonyOS / EMUI）

荣耀（MagicOS）

小米 / Redmi（HyperOS / MIUI）

OPPO / 一加 / realme（ColorOS / OxygenOS / realme UI）

vivo / iQOO（OriginOS / Funtouch OS）

三星（One UI）

魅族 / 联想 / 中兴 / 传音等其他品牌

更新后的操作步骤

常见问题解答

实用建议

相关文章

C#强签名作用与恒盾混淆大师使用教程

强签名到底有什么价值

为什么混淆后必须重新签名

如何生成 .snk 密钥文件

具体配置步骤

适用场景推荐

如何验证签名结果

注意事项

总结

HTML打包APK User Agent设置详解

User Agent设置的应用场景

页面显示为电脑版

提示"请使用指定浏览器打开"

统计识别APP来源

设置位置

设置步骤

留空与填写的区别

使用建议

常见问题

相关阅读

HTML打包APK：页面打印功能实现方法

创建打印页面

打包APK

安装并测试打印

常见问题

HTML打包EXE退出密码设置指南

下载最新版本

适用场景

配置步骤

用户看到的效果

和静态密码的区别

使用建议

总结

相关阅读

用HTML打包APK制作视频播放器

创建视频播放页面

打包成APK

测试功能

HTML打包APK实现拍照、录像、录音和文件选择

创建文件采集页面

打包APK并配置权限

安装并测试功能

HTML项目打包APK：二维码扫码功能实现

创建扫码页面

打包APK并勾选相机权限

安装并测试扫码

C#混淆选项选择指南：恒盾加密大师详解

四类混淆选项分别解决什么问题

基本保护选项

防调试、防DnSpy与防断点

防ILDasm、防ILSpy与防de4dot

防篡改与加壳

防虚拟机

注入功能选项

垃圾域、垃圾函数与垃圾类型

垃圾空指令与垃圾字符串

混淆功能选项

程序集与文件结构混淆

流程与函数调用混淆

字符串保护

数字、布尔值与小数保护

函数体隐藏与原生化EXE

重命名选项