寻求支持自定义查询参数的第三方JavaScript社交分享方案

我们正在用React开发一款音视频搜索应用，需要实现搜索结果单条分享功能：用户把单个搜索结果分享到Facebook、Messenger、LinkedIn、Twitter等平台后，其他用户点击链接进入应用时，能直接定位并展示该条结果——这得靠URL里的自定义查询参数实现。

目前遇到的问题是：市面上多数第三方分享工具只支持传递基础URL（window.location.origin + window.location.pathname），没法满足我们带自定义查询参数的需求。我们自己已经写了一套符合要求的分享逻辑，但担心社交平台的分享接口URL每年更新会导致这套自定义代码失效，所以想找能支持自定义查询参数的第三方JS库或服务，减少后续维护成本。

场景示例 #

• 单个音频搜索结果的目标访问链接（通过q="Reunited"参数实现精准展示）：https://www.clipstock.com/audio?q=%22Reunited%22&size=n_12_n
• 我们自定义生成的Facebook分享链接（其中https://www.facebook.com/sharer/sharer.php?u=部分存在因平台更新失效的风险）：https://www.facebook.com/sharer/sharer.php?u=https://www.clipstock.com/audio?q=%22Reunited%22&size=n_12_n
• 单个视频节点的独立页面链接（这类链接适配常规第三方分享方案，但不是我们本次需求的目标）：https://www.clipstock.com/clip/young-male-swimmer-diving-starting-block-olympic-size-pool-lanes-slow-motion

当前自定义实现的核心代码 #

const drupalContext = useContext(DrupalContext);
const queryString = type === "sfx" ? drupalContext.sfxQueryString : "";
const baseUrl = window.location.origin.concat(window.location.pathname);
const sharingLink =
  type === "video"
    ? baseUrl.concat("?q=").concat(nodeId)
    : baseUrl
        .concat("?q=")
        .concat(encodeURI('"'))
        .concat(encodeURI(title))
        .concat(encodeURI('"'))
        .concat(queryString);

const shareViaFacebook = () => {
  let shareUrl = "";
  if (platform?.os?.family === ("iOS" || "Android" || "Windows Phone")) {
    shareUrl = "fb://share/?link=" + sharingLink;
  } else {
    shareUrl = "https://www.facebook.com/sharer/sharer.php?u=" + sharingLink;
  }
  window.open(shareUrl);
};

我们已经为Facebook、Messenger、LinkedIn、Twitter、邮件、复制链接等平台都写了类似的shareVia...方法，如果找不到合适的第三方方案，就只能砍掉社交平台分享，仅保留邮件和复制链接功能。

内容的提问来源于stack exchange，提问作者Jamie Sowder