允许前端 JavaScript POST 请求到 https://accounts.spotify.com/api/token 端点 [英] Allowing frontend JavaScript POST requests to https://accounts.spotify.com/api/token endpoint

问题描述

为了在我的网络应用程序中获取 Spotify API 的访问令牌(由他们的网络授权流程指定)，我了解到我必须发出一个 POST 请求.但是，当我这样做时，由于跨域问题，我得到了 XMLHttpRequest 500 Error.

In order to get an access token for the Spotify API in my web app (as specified by their Web Authorization Flow), I've learned that I have to make a POST request. However, when I do so, I get the XMLHttpRequest 500 Error due to the cross-origin problem.

我已经想出了如何允许 CORS GET 请求，但不确定如何对 POST 请求执行相同的操作.这个链接提供了配置技巧，但它留下了GET的实际路由和 POST 空白.

I have already figured out how to allow CORS GET requests, but am not sure how to do the same for POST requests. This link provides configuration tips, but it leaves the actual routes for GET and POST blank.

这是我的 Express.js 服务器的相关代码:

This is the relevant code for my Express.js server:

app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  next();
});



app.use(express.static(__dirname + '/public')); // looks in public directory, not root directory (protects files)

app.get('/', function(req, res) {
  // res.header("Access-Control-Allow-Origin", "*");
  // res.header("Access-Control-Allow-Headers", "X-Requested-With");
  res.send(__dirname + '\index.html')
});

app.post('/', function(req, res) {
    res.send(req.body.spotify);
});

(spotify 是 spotify-web-api-js 节点模块).

(spotify is the spotify-web-api-js node module).

我之前曾尝试将 app.get 的确切代码复制到 app.post 中，但这导致服务器崩溃.

I've previously tried copying the exact code for app.get into app.post, but that caused the server to crash.

这是我程序的 JavaScript 文件中的一小段代码，用于在用户单击按钮后发送 POST 请求，该按钮将他们带到 Spotify 授权路径的开头并批准签名-在:

This is the bit of code in my program's JavaScript file that intends to send a POST request after the user clicks on a button that takes them to the start of Spotify's authorization path and approves the sign-in:

$('#spotify').on('click', function() {
    $.support.cors = true;

    $.post("https://accounts.spotify.com/api/token");

      });

(在本例中，spotify 是 HTML 文件中按钮的 ID)

(in this case, spotify is the ID for the button in the HTML file)

在这种情况下，我应该怎么做才能绕过 CORS 问题?我已经被难住了几天.

What should I do to bypass the CORS issue in this case? I've been stumped for a few days.

推荐答案

您可以在 https://github.com/spotify/web-api-auth-examples(参见 authorization_code 方法).

You can find an example of using express to perform the authentication flow with Spotify on https://github.com/spotify/web-api-auth-examples (see the authorization_code approach).

您无法获得向 /api/token 发出客户端请求的访问令牌.您需要向 /authorize 发出请求，该请求将重定向到您的 redirect_uri，后者本身将与访问令牌交换 code.

You can't get an access token making a client-side request to /api/token. You need to make a request to /authorize, which will redirect to your redirect_uri, which itself will exchange a code with an access token.

检查该示例，它应该满足您的需求.

Check that example, which should cover your needs.

这篇关于允许前端 JavaScript POST 请求到 https://accounts.spotify.com/api/token 端点的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！