Spotify 令牌调用后返回错误网站而不是错误或令牌

Posted

技术标签:

【中文标题】Spotify 令牌调用后返回错误网站而不是错误或令牌【英文标题】:Spotify token post- call return error website instead of error or token 【发布时间】:2017-12-10 03:55:50 【问题描述】:

我正在尝试使用授权代码流而不是我目前使用的隐式授权。 Here 是两个流程的文档。我正在使用我的 Angular 2 应用程序中的 spotify API。前三个步骤进展顺利,我从回调调用中获取代码。但是当我对https://accounts.spotify.com/api/token 进行后调用时,我得到了 CORS 异常,因为调用返回了浏览器禁止的网站。返回页面与点击此链接https://accounts.spotify.com/api/token相同。我尝试使用 curl 调用这个 api,这就是我注意到的。 调用时:

curl -H "Authorization: Basic ZjM...zE=" -d grant_type=authorization_code -d code=MQCbtKe...44KN -d redirect_uri=https%3A%2F%2Fwww.foo.com%2Fauth https://accounts.spotify.com/api/token

它返回错误 json 消息并抱怨无效客户端。

当我删除数据时,它会返回那个错误的 html 页面。

curl -H "Authorization: Basic ZjM...zE=" https://accounts.spotify.com/api/token

所以我假设在我的代码中问题是相同或类似的。那么可以将这些参数设置为 POST 调用主体吗?似乎 spotify 端点根本没有得到我的参数,这就是它不返回错误消息的原因。 Here 是 spotify 提供的示例,这里 here 是 Angular http 组件的文档。

这是我的 TypeScript 调用:

var data  = 
    redirect_uri: this.config.redirectUri,
    grant_type: 'authorization_code',
    code : code
;

let headers = this.getTokenHeaders();
let address = "https://accounts.spotify.com/api/token";
return this.http.post(address,data, new RequestOptions(headers: headers))
    .toPromise()
    .then(res => 
    
        let body = res.json();
        localStorage.setItem('spotify-access-token', body.access_token);
        localStorage.setItem('spotify-refresh-token', body.refresh_token);
        var expiresIn = body.expires_in;

        return true;
    )
    .catch(err=> 
    
        return false;
    );

getTokenHeaders()
    
        return new Headers(this.accountAuth());
    

private accountAuth(): Object 
    var auth = 
        'Authorization': 'Basic ' + (new Buffer(this.config.clientId + ':' + this.config.clientSecret).toString('base64')),
        'Content-Type': 'application/x-www-form-urlencoded'
        //'Content-Type':'application/json'
    ;
    return auth;

我尝试将 Content-Type 设置为 application/json 和 application/x-www-form-urlencoded。

【问题讨论】:

【参考方案1】:

我找到了这个答案https://***.com/a/28406268/8081009 并从服务器端尝试了它,并且当我使用消息正文传递参数时也得到了相同的错误页面。然后我将参数更改为 url,如下所示:

var url = "/api/token?redirect_uri=http://localhost:8080/callback.html&grant_type=authorization_code&code="+code;

现在我收到了正确的消息。希望这对某人有所帮助。

所以不要从客户端使用 api/token 并将参数设置为 url。

【讨论】:

以上是关于Spotify 令牌调用后返回错误网站而不是错误或令牌的主要内容,如果未能解决你的问题,请参考以下文章

Spotify API 授权代码流向我返回 400 错误请求

即使在添加身份验证令牌以获取艺术家的播放列表后,Spotify API 也会出现 CORS 错误

Spotify 授权登录调用错误的 url

spotify-web-api-node:authorizationCodeGrant()给出400 - 错误请求

Android Spotify SDK登录错误意外令牌

Spotify:发布到 api/token 给出了错误的请求,但在 curl 中工作