使用 JavaScript 和 Axios 的 Dropbox 访问令牌 api 调用引发错误答案

【问题标题】：Dropbox access token api call raised error using JavaScript and Axios使用 JavaScript 和 Axios 的 Dropbox 访问令牌 api 调用引发错误
【发布时间】：2022-10-19 17:23:18
【问题描述】：

目前我正在我的 VueJS 项目中进行 Dropbox 集成，并且我能够成功获得授权码。但遗憾的是无法使用 JS 和 Axios 获取调用访问令牌 API。每当调用 API 时，它都会引发以下错误：

还有我的调用 API 端点：

let url = "https://dropbox.com/oauth2/token?client_id="+state.clientId+"&client_secret="+state.client_secret+"&redirect_uri="+redirect_uri+"&code="+state.dropbox_code+"&scope="+scope+"&grant_type=authorization_code";      

await axios.post(url)`

我能做些什么来解决这个问题？

【问题讨论】：

标签： cors dropbox-api

【解决方案1】：

您正在尝试以编程方式将XMLHttpRequest 设为“dropbox.com/oauth2/authorize”，但这实际上是一个网页，而不是应该以编程方式调用的东西。您应该将最终用户引导至其浏览器中的该页面。有关详细信息，请参阅 Dropbox OAuth Guide 和 authorization documentation。

【讨论】：

感谢您的回答，api端点是“oauth2/token”而不是“oauth2/authorize”。那么，对于两者来说，你的答案是一样的吗？
与 /oauth2/authorize 不同，/oauth2/token 端点旨在以编程方式访问。在用户通过 /oauth2/authorize 授权应用后，应用使用 /oauth2/token 端点。

【解决方案2】：

是的，最后我通过使用“fetch”方法而不是“axios”自己解决了这个问题。

解决方案示例：`let url = "https://api.dropboxapi.com/oauth2/token?client_id="+state.clientId+"&client_secret="+state.client_secret+"&redirect_uri="+redirect_uri+"&code="+state. dropbox_code+"&grant_type=authorization_code";

  fetch(url, {
    method: 'POST',       
    mode: 'cors',
    cache: 'no-cache',       
  })
  .then(res => res.json())
  .then(data => state.dropbox_access_response = data )
  .catch(err => console.log('access err =>',err));`

【讨论】：