如何通过回调获取弹窗内订阅按钮的点击状态（HTML/JS）

首先得给你划个重点：浏览器的同源策略会直接阻止你访问不同源窗口（这里是YouTube的弹窗）的DOM元素和事件，所以想直接监听弹窗里订阅按钮的点击动作是行不通的。不过我们有几种间接但可靠的方法来实现类似需求，下面详细说：

1. 优先用YouTube Data API（最靠谱的方案） #

如果你的目标是确认用户是否完成订阅，官方API是最稳定的选择：

• 第一步，去Google Cloud平台创建项目，启用YouTube Data API v3，拿到API密钥和OAuth 2.0客户端ID（因为要获取用户的订阅信息，需要用户授权）。
• 引导用户完成授权后，就能调用API查询用户对目标频道的订阅状态，不管用户是在弹窗里操作还是其他地方订阅的，都能准确获取结果。

给你个JavaScript的调用示例：

// 假设已经通过OAuth 2.0拿到了有效的accessToken
fetch(`https://www.googleapis.com/youtube/v3/subscriptions?part=snippet&channelId=UCF_Xf8l8kspCPkgzhn5sYRw&mine=true&access_token=${accessToken}`)
  .then(res => res.json())
  .then(data => {
    if (data.items.length > 0) {
      console.log("用户已经订阅这个频道啦");
    } else {
      console.log("用户还没订阅哦");
    }
  })
  .catch(err => console.error("查询订阅状态出错:", err));

2. 监听弹窗关闭后再验证状态（简易间接法） #

如果不想折腾API授权，也可以退一步：等用户关闭弹窗后，再调用API去查询订阅状态，以此推断用户是否在弹窗里点击了订阅按钮。

修改你的popitup函数就行：

function popitup(link) {
  var w = window.open(
    link.href,
    link.target || "_blank",
    "menubar=no, toolbar=no, location=no, directories=no, status=no, scrollbars=no, resizable=no, dependent, width=800, height=620, left=0, top=0"
  );
  
  if (w) {
    // 每隔500毫秒检查一次弹窗是否关闭
    const checkInterval = setInterval(() => {
      if (w.closed) {
        clearInterval(checkInterval);
        console.log("弹窗关了，现在去查订阅状态...");
        // 这里插入上面的API查询逻辑
      }
    }, 500);
    return false;
  }
  return true;
}

为啥直接监听弹窗元素不行？ #

再啰嗦一句：你的页面和YouTube域名不一样，浏览器为了安全，会禁止跨域访问其他窗口的DOM和事件。比如你试写w.document.querySelector("#subscribe-button")，浏览器直接给你抛跨域错误，这个是没法绕开的安全机制。

总之，最推荐用官方API，能准确拿到订阅状态；弹窗关闭后查询的方式只能做间接推断，没法实时知道用户是不是真的点了按钮。

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