无法使用 Axios 或 D3-fetch 解析 Dropbox.com 重定向

Question

我正在尝试从 Dropbox 链接获取浏览器中的数据：https://www.dropbox.com/s/101qhfi454zba9n/test.txt?dl=1

使用 Axios 这在 Node 中有效：

axios.get('https://www.dropbox.com/s/101qhfi454zba9n/test.txt?dl=1').then(x => {
  console.log('Received correctly')
  console.log(x.data);
}).catch(error => {
    console.log('Error', error.message);
    if (error.response) {
      // The request was made and the server responded with a status code
      // that falls out of the range of 2xx
      console.log(error.response.data);
      console.log(error.response.status);
      console.log(error.response.headers);
    } else if (error.request) {
      // The request was made but no response was received
      // `error.request` is an instance of XMLHttpRequest in the browser and an instance of
      // http.ClientRequest in node.js
      console.log(error.request);      
    }
    console.log(error) 
});

https://runkit.com/stevebennett/5dc21d04bbc625001a38699b

但是它在浏览器中不起作用（单击“控制台”选项卡）：

https://codepen.io/stevebennett/pen/QWWmaBy

我只是得到一个通用的“网络错误”。我看到正在检索 301 重定向，这看起来很正常，但由于某种原因，它没有被遵循。

与 D3 完全相同：“尝试获取资源时发生网络错误。”

https://codepen.io/stevebennett/pen/KKKoZYN

发生了什么事？

Answer 1

由于 CORS 政策，这似乎失败了。使用XMLHttpRequest 直接尝试此操作失败：

从源“...”访问“https://www.dropbox.com/s/101qhfi454zba9n/test.txt?dl=1”处的 XMLHttpRequest 已被 CORS 策略阻止：请求的资源上不存在“Access-Control-Allow-Origin”标头。

www.dropbox.com 本身不允许使用 CORS。