Soundcloud JS SDK - SC.如果 iOS 上安装了应用程序,则 Connect() 回调窗口无法关闭

Soundcloud JS SDK - SC.Connect() callback window can't close if App installed on iOS

本文关键字:Connect 回调 窗口 应用程序 SC SDK JS 如果 iOS 安装 Soundcloud      更新时间:2023-09-26

The Soundcloud's JS SDK, SC.connect(); 在身份验证后重定向到回调窗口。桌面和移动设备上一切正常,除非您安装了soundcloud APP(在iOS上);

回调文件:

    <html lang="en">
      <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Connect with SoundCloud</title>
      </head>
      <body onload="window.opener.setTimeout(window.opener.SC.connectCallback, 1)">
        <b style="text-align: center;">This popup should automatically close in a few seconds</b>
      </body>
    </html>

如果您安装了该应用程序,SC.connect() 会打开该应用程序以在进行身份验证之前检查您是否已登录,并将您重定向到回调。然后 callback.html 的 window.opener 不再是你的窗口(因为应用程序打开了它),并且窗口无法调用方法并关闭。

控制台说:

TypeError: null is not an object (evaluating 'window.opener.SC')
TypeError: null is not an object (evaluating 'window.opener.setTimeout')

有没有办法在不修改 soundcloud SDK 的情况下访问我的原始窗口?

我的解决方案是通过在模态中使用 iframe 来绕过应用程序的打开:

        this.connect= function(){
            var url = "https://soundcloud.com/connect?client_id="+conf.soundcloud.client_id+"&redirect_uri="+conf.url.base+"/soundcloud-callback.html"+"&response_type=token&scope=non-expiring";
            $('#sc-connect-modal').modal('show');
            $( "#sc-connect-modal .modal-body" ).html('<iframe height="500px" width="100%" frameBorder="0" src="'+url+'"></iframe>');
        };

我的声云回调.html:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Connect with SoundCloud</title>
  </head>
  <body onload="window.setTimeout(window.parent.scCallback(window.location.hash), 1);">
    <b style="text-align: center;">This popup should automatically close in a few seconds</b>
  </body>
</html>

回调函数:

        $window.scCallback = function(response) {
            console.log(response);
            $('#sc-connect-modal').modal('hide');
            response=response.replace('#','');
            var token = getUrlParameter(response,'access_token');
            $rootScope.user.sc_token=token;
            soundcloud.generateAuthString();
            SC.get("/me"+soundcloud.authString).then(function(response){
                // ...
            });
        }

注意 getUrlParameter()只是一个自定义函数来获取参数

把它变成你的加载函数,Soundcloud的API还没有更新。

<body onload="window.setTimeout(window.opener.SC.connectCallback, 1)">