更新记录

1.0.0（2026-07-08）

• 新增 Instagram Story 图片分享。
• 新增 Facebook ShareDialog 链接分享。
• 新增 X / Twitter scheme 与 Web Intent 分享。
• 新增 shareSocial 统一分享入口。
• 新增 zs-share-panel 三平台分享面板组件。
• 新增 Android / iOS 原生 UTS 实现和调试示例工程。

平台兼容性

uni-app(4.76)

uni-app x(4.76)

zhuanz-social-share

zhuanz-social-share 是一个 uni-app / uni-app x 社交分享插件，封装：

• Instagram Story 图片分享
• Facebook ShareDialog 链接分享
• X / Twitter 发帖分享
• zs-share-panel 三平台分享面板组件

插件本身不采集、不存储、不上传用户数据，只把宿主应用传入的分享文案、链接或本地图片交给对应平台客户端或 Web 分享页。

平台支持

安装

将插件目录放入项目：

uni_modules/zhuanz-social-share

iOS 配置

在 manifest.json 的 app-ios.distribute 中配置：

{
  "urlschemes": [
    "fb你的FacebookAppID"
  ],
  "LSApplicationQueriesSchemes": [
    "instagram",
    "instagram-stories",
    "fb",
    "fbapi",
    "fb-messenger-share-api",
    "fbauth2",
    "fbshareextension",
    "twitter",
    "x"
  ]
}

如希望 iOS 从 Info.plist 读取默认 Facebook 配置，也可以加入：

<key>FacebookAppID</key>
<string>你的FacebookAppID</string>
<key>FacebookClientToken</key>
<string>你的FacebookClientToken</string>
<key>FacebookDisplayName</key>
<string>你的App名称</string>

更推荐在调用 shareFacebookLink 或 shareSocial 时传入 facebookAppId、facebookClientToken、facebookDisplayName，避免把业务配置写死在插件里。

Android 配置

插件已声明：

• INTERNET
• Facebook / Instagram / X 的 package visibility queries
• Facebook Share SDK Gradle 依赖

调用 Facebook 分享时仍需传入 Meta 后台的 appId 和 clientToken。

API

shareSocial(options)

统一分享入口。

import { shareSocial } from '@/uni_modules/zhuanz-social-share'

shareSocial({
  channel: 'facebook',
  title: '分享标题',
  summary: '分享摘要',
  href: 'https://example.com/post/1',
  facebookAppId: '你的FacebookAppID',
  facebookClientToken: '你的FacebookClientToken',
  facebookDisplayName: '你的App名称',
  success: (res) => {},
  fail: (err) => {}
})

channel 可传：

• instagram / ins
• facebook / fb
• x / twitter

Instagram Story 分享必须传本地图片路径：

shareSocial({
  channel: 'instagram',
  imagePath: tempFilePath,
  href: 'https://example.com/post/1',
  instagramSourceApplication: '你的FacebookAppID'
})

X 分享：

shareSocial({
  channel: 'x',
  title: '分享标题',
  summary: '分享摘要',
  href: 'https://example.com/post/1'
})

shareFacebookLink(options)

直接打开 Facebook ShareDialog。

import { shareFacebookLink } from '@/uni_modules/zhuanz-social-share'

shareFacebookLink({
  href: 'https://example.com/post/1',
  quote: '分享文案',
  appId: '你的FacebookAppID',
  clientToken: '你的FacebookClientToken',
  displayName: '你的App名称'
})

shareInstagramStory(options)

直接打开 Instagram Story 图片分享。

import { shareInstagramStory } from '@/uni_modules/zhuanz-social-share'

shareInstagramStory({
  imagePath: tempFilePath,
  attributionUrl: 'https://example.com/post/1',
  sourceApplication: '你的FacebookAppID',
  backgroundTopColor: '#FFFFFF',
  backgroundBottomColor: '#FFFFFF'
})

shareX(options)

直接打开 X / Twitter 分享。

import { shareX } from '@/uni_modules/zhuanz-social-share'

shareX({
  text: '分享文案',
  url: 'https://example.com/post/1',
  preferApp: true
})

openSocialShareUrl(options)

打开自定义 scheme 或 Web URL。

import { openSocialShareUrl } from '@/uni_modules/zhuanz-social-share'

openSocialShareUrl({
  url: 'instagram://camera',
  channel: 'instagram'
})

logSocialShareEnvironment(appId, clientToken, displayName)

输出当前 App 配置、iOS scheme 可用性和 Facebook 配置状态，用于真机排查。

组件

<template>
  <zs-share-panel
    :title="title"
    :summary="summary"
    :href="href"
    :image-path="imagePath"
    :facebook-app-id="facebookAppId"
    :facebook-client-token="facebookClientToken"
    :facebook-display-name="facebookDisplayName"
    @success="onSuccess"
    @fail="onFail"
  />
</template>

常见问题

Instagram 分享失败

• 确认手机已安装 Instagram。
• 确认 imagePath 是本地图片路径，不是远程 URL。
• iOS 需要 LSApplicationQueriesSchemes 包含 instagram 和 instagram-stories。
• Android 需要真机测试，模拟器通常没有 Instagram 客户端。

Facebook 分享失败

• 确认 appId 和 clientToken 来自同一个 Meta 应用。
• iOS 确认已配置 fb{FacebookAppID} URL Scheme。
• Android 确认自定义基座已重新制作并包含 Facebook Share SDK 依赖。
• Facebook App 处于开发模式时，测试账号需要加入 Meta 后台角色。

X 分享只打开网页

插件会优先尝试 twitter://、x://，失败后打开 https://twitter.com/intent/tweet。如目标设备没有安装 X 客户端，这是预期降级。