来自 Spotify 的 Arielle 在这里。
您似乎正在使用客户端凭据流程,这是您可以与 Spotify API 一起使用的 3 个身份验证流程之一。 (您可以查看所有 3here https://beta.developer.spotify.com/documentation/general/guides/authorization-guide/)
客户端凭据仅供服务器端使用,并且不应该在前端使用,因为它需要一个您不应该泄露的客户端秘密!
您应该使用隐性授予flow,它是为在浏览器中使用而设计的。启动和运行也很容易!
// Get the hash of the url
const hash = window.location.hash
.substring(1)
.split('&')
.reduce(function (initial, item) {
if (item) {
var parts = item.split('=');
initial[parts[0]] = decodeURIComponent(parts[1]);
}
return initial;
}, {});
window.location.hash = '';
// Set token
let _token = hash.access_token;
const authEndpoint = 'https://accounts.spotify.com/authorize';
// Replace with your app's client ID, redirect URI and desired scopes
const clientId = 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx';
const redirectUri = 'http://localhost:8888';
const scopes = [
'user-read-birthdate',
'user-read-email',
'user-read-private'
];
// If there is no token, redirect to Spotify authorization
if (!_token) {
window.location = `${authEndpoint}?client_id=${clientId}&redirect_uri=${redirectUri}&scope=${scopes.join('%20')}&response_type=token`;
}
Gist: https://gist.github.com/arirawr/f08a1e17db3a1f65ada2c17592757049 https://gist.github.com/arirawr/f08a1e17db3a1f65ada2c17592757049
这是一个关于 Glitch 的示例,您可以“重新混合”以制作副本并开始制作您的应用程序:https://glitch.com/edit/#!/spotify-implicit-grant https://glitch.com/edit/#!/spotify-implicit-grant
希望有帮助 - 快乐黑客! ????????????