0

我正在为MusicBrainz API开发一个前端，它可以搜索艺术家及其版本（特别是发布组）。当我尝试通过Axios 库的封面艺术档案从发行组的各自 MusicBrainz ID (MBID) 中找到某个封面艺术时，我收到两个 CORS 错误：

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://ia802802.us.archive.org/9/items/mbid-<any MBID>/index.json. (Reason: CORS request external redirect not allowed).
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://ia802802.us.archive.org/9/items/mbid-<any MBID>/index.json. (Reason: CORS request did not succeed).

到目前为止我所做的

经过一些研究，我意识到封面艺术档案馆没有自己的图像；相反，访问他们的 API 会导致重定向到Internet Archive API。因此，我直接使用 IA API 来找到我需要的封面，因为我也可以在那里找到带有 MBID 的封面。这本身会导致 CORS 错误，但我使用的是代理（使用 Nuxt.js），这意味着我可以毫无问题地连接到 Internet 存档 - 至少最初是这样。

proxy: {
  '/archive': {
    target: 'https://archive.org/',
    pathRewrite: {
      '^/archive': ''
    }
  }
},

主要问题是 IA 然后再次重定向到动态且经常更改的目的地。因此，我无法预测重定向的去向，也无法避免上述 CORS 错误，即使通过代理也是如此 - Axios 在这里不使用它，这是可以理解的。

我对此进行了相当广泛的研究，当我无法阻止重定向发生时，我找不到如何防止这些错误出现。

const getAlbumArtLocation = (release, index) => {
  this.$axios
    .get(
      '/archive/download/mbid-' + release.id + '/index.json'
    )
    .then((res) => {
      const imageURL = res.data.images[0].image
      getAlbumArt(imageURL, index)
    })
    .catch((err) => {
      // Try get another album artwork.
      console.error(err)
      index += 1
      getAlbumArtCandidate(index)
    })
}

可以在此处找到相关文件的代码。

我的 Nuxt 配置可以在这里找到。

值得注意的是，这些错误仅出现在 Firefox 中，而不会出现在其他基于 Chromium 的浏览器中。

4

1 回答 1

1

编辑

由于您使用的是使用 http-proxy-middleware 的@nuxtjs/proxy 中间件，您可以将代理配置为遵循重定向（默认情况下关闭） - 因此重定向响应不会返回给您的客户端，但代理将遵循在服务器上重定向并仅返回最终响应...

改变你nuxt.config.js的：

'/archive': {
      target: 'https://archive.org/',
      pathRewrite: {
        '^/archive': ''
      }
    }

至：

'/archive': {
      target: 'https://archive.org/',
      pathRewrite: {
        '^/archive': ''
      },
      followRedirects: true
    }
于 2020-06-12T10:19:54.627 回答