用于Spotify的无效重定向URI [英] Invalid redirect URI for spotify

问题描述

我正在尝试使Spotify API与AngularJS一起使用.我在授权阶段收到无效的重定向URI错误( https://developer. spotify.com/web-api/authorization-guide/).

I'm trying to get the Spotify API working with AngularJS. I'm getting an invalid redirect URI error at the authorization stage (https://developer.spotify.com/web-api/authorization-guide/).

我已经在白名单中添加了redirect_uri，当我拥有URI之类的内容时，它可以正常工作

I have added the redirect_uri in the white list and it works when I have a URI such as

http://localhost:3000 

，但是当我的URI中带有哈希值

but it doesn't work when I have a URI with a hash

http://localhost:3000/#/main

我要使用后一个URI的原因是因为使用前一个URI时，我无法通过angular获取参数

The reason I want to use the latter URI is because with the former I get a URI which I can't get the parameters from via angular

http://localhost:3000/<parameters returned from spotify>/#/main) 

我希望URI像这样:

http://localhost:3000/#/main/<parameters returned from spotify>

非常感谢您的帮助.

推荐答案

有几种方法可以做到.我建议您看看 possan/webapi-player-example 使用AngularJS构建，并使用PostMessage在重定向URI(callback.html)和Angular应用(app.js)之间进行通信.

There are several ways you can do it. I recommend you to have a look at the possan/webapi-player-example, which is built using AngularJS and uses a PostMessage to communicate between the redirect URI (callback.html) and the Angular app (app.js).

如果没有PostMessages选项，则可以尝试以下操作:

If PostMessages is not an option, you can try this:

1. 启动循环以检查localStorage
上的特定键
2. 在弹出窗口中打开登录页面.
3. 在回调页面上，写入localStorage从Spotify获得的数据(即access_token，refresh_token，expires_in).
4. 几秒钟后关闭弹出窗口
5. 该循环应该已经意识到要在localStorage中写入新值.

1. Start a loop to check a certain key on localStorage
2. Open the login page in a popup.
3. From the callback page, write in localStorage the data you get back from Spotify (i.e. access_token, refresh_token, expires_in).
4. Close the popup after a couple of seconds
5. The loop should have realised about the new value being written in localStorage.

先前的流程虽然稍微复杂一点，但在诸如iOS设备之类的环境中效果很好，有时无法正确地在回调页面和主"页面之间进行通信.

The previous flow, although a bit more complex, works well in environments such as iOS devices where it is sometimes impossible to communicate between the callback page and the "main" page properly.

这篇关于用于Spotify的无效重定向URI的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！