HTML5 中 Manifest 怎么配置 share_target 实现系统分享接入-H5教程-PHP中文网

HTML5 的 Manifest 文件不支持 share_target 配置；share_target 是 Web App Manifest（manifest.json）中的属性，属于 PWA 规范，需在 manifest.json 中声明并配合 service worker、HTTPS 及安装条件使用。

html5 中 manifest 怎么配置 share_target 实现系统分享接入

HTML5 的 Manifest 文件不支持 share_target 配置。share_target 是 Web App Manifest（即 manifest.json）中的一个功能属性，属于 PWA（渐进式 Web 应用）规范，与已废弃的旧版 HTML5 Cache Manifest（cache.manifest）完全无关。

区分两个不同“Manifest”

很多人混淆了以下两者：

Cache Manifest（HTML5 Application Cache）：基于 cache.manifest 文件，2019 年起被所有主流浏览器废弃，不支持 share_target，也不再推荐使用。
Web App Manifest（manifest.json）：JSON 格式文件，用于定义 PWA 的元信息（如图标、启动页、显示模式），share_target 正是它的一部分（W3C 共享目标规范），需搭配 navigator.share() 或系统分享集成使用。

正确配置 share_target（在 manifest.json 中）

要让 PWA 接收系统分享（例如从图库、浏览器点“分享到…”选择你的 PWA），需在 manifest.json 中声明 share_target，并确保满足以下条件：

Wechat Article Html

将 Markdown 文章转换为微信公众号兼容的纯 HTML 格式。当用户要求"转成微信格式"、"生成公众号文章 HTML"、"排版到微信草稿箱"、"微信粘贴格式"时触发。输出带内联样式的纯 HTML，微信编辑器可直接渲染，无需额外适配。支持标题、段落、列表、粗体、行内代码、表格、引用块、代码块、配图的完整转换。

下载

站点已注册为可安装 PWA（有 valid manifest + service worker + HTTPS）
用户已将该 PWA 添加到主屏幕（或 Android 上通过 Chrome 触发“添加到主屏幕”）
目标页面（action 指向的路径）能处理 POST 请求并解析分享数据（如 text、files、url）

示例 manifest.json 片段：

{ "name": "My Share App", "short_name": "ShareApp", "start_url": "/", "display": "standalone", "share_target": { "action": "/receive-share", "method": "POST", "enctype": "multipart/form-data", "params": { "title": "title", "text": "text", "url": "url", "files": [ { "name": "image", "accept": ["image/*"] } ] } } }

后端/页面需配合处理分享请求

share_target.action 指向的页面（如 /receive-share）必须能接收并响应浏览器发起的 POST 表单请求。常见实现方式：

服务端路由（如 Express、PHP、Python Flask）解析 multipart body，提取 title/text/url/files
前端页面也可通过 self.addEventListener('fetch', ...) 在 Service Worker 中拦截该请求，再转发给页面逻辑（但需注意跨域和 formData 解析限制）
Android Chrome 会将分享内容以标准表单格式提交；iOS Safari 目前暂不支持 share_target