javascript - 相册或视频的 Vimeo API 列表返回 200 但没有列表。 (在 native react 中)

Question

我的目标是从我的 Vimeo 帐户中获取 Vimeo 中的相册列表或视频列表，其中所有内容都是私有(private)的。我正在使用 React Native 和 javascript 获取功能...

fetch(`https://api.vimeo.com/users/13477675/albums?client_id=<CLIENT_ID>`,{
            method: 'GET',
            page: 1,
            headers: new Headers({
                'Content-Type': 'application/vnd.vimeo.*+json',
                "Authorization" : "Bearer <TEST_TOKEN>"
            })
        }).then((response)=>{
            console.log('RESPONSE: '+JSON.stringify(response));
        });

我收到状态代码为 200 的 JSON 响应，就像它应该是的那样。但是，我没有得到专辑或视频或任何类似的列表。 (当我使用 Vimeo Playground 时，我确实按预期获得了专辑或视频列表，并且在那里使用相同的信息...)

这是我得到的回复:

{"type":"default","status":200,"ok":true,"statusText":200,"headers":{"map":{"x-ratelimit-remaining":["95"],"x-ratelimit-limit":["100"],"expires":["Fri, 21 Apr 2028 00:26:23 GMT"],"connection":["keep-alive"],"cache-control":["no-cache, max-age=315360000"],"vary":["Accept,Vimeo-Client-Id,Accept-Encoding"],"content-type":["application/vnd.vimeo.album+json"],"date":["Tue, 24 Apr 2018 00:26:23 GMT"],"content-encoding":["gzip"],"via":["1.1 varnish, 1.1 varnish"],"x-cache-hits":["0, 0"],"accept-ranges":["bytes"],"strict-transport-security":["max-age=15552000; includeSubDomains; preload"],"x-cache":["MISS, MISS"],"x-ratelimit-reset":["2018-04-24T00:41:23+00:00"],"x-served-by":["cache-iad2143-IAD, cache-dca17724-DCA"],"age":["0"],"server":["nginx"],"x-timer":["S1524529583.137340,VS0,VE316"],"content-length":["3391"]}},"url":"","_bodyInit":{"listeners":{},"isRNFetchBlobPolyfill":true,"multipartBoundary":null,"_ref":"/Users/jeremyfrancis/Library/Developer/CoreSimulator/Devices/E1D3C5D3-5FF7-4C3A-81A4-B6A823F8A7AF/data/Containers/Data/Application/8AA6BEA8-EE15-4E6E-8AE2-A31CC571E19E/Documents/RNFetchBlob-blobs/blob-tb4fwue6s2ls7tjhcl8b","_blobCreated":true,"_closed":false,"cacheName":"blob-tb4fwue6s2ls7tjhcl8b","type":"text/plain","size":86998},"_bodyBlob":{"listeners":{},"isRNFetchBlobPolyfill":true,"multipartBoundary":null,"_ref":"/Users/jeremyfrancis/Library/Developer/CoreSimulator/Devices/E1D3C5D3-5FF7-4C3A-81A4-B6A823F8A7AF/data/Containers/Data/Application/8AA6BEA8-EE15-4E6E-8AE2-A31CC571E19E/Documents/RNFetchBlob-blobs/blob-tb4fwue6s2ls7tjhcl8b","_blobCreated":true,"_closed":false,"cacheName":"blob-tb4fwue6s2ls7tjhcl8b","type":"text/plain","size":86998}}

这是我在 Vimeo Dev API 中查找的位置:https://developer.vimeo.com/api/reference/albums

更新

我已经更新了我的代码以使用 .json() 如下...

fetch(`https://api.vimeo.com/users/13477675/albums?client_id=<CLIENT_ID>`,{
        method: 'GET',
        page: 1,
        headers: new Headers({
            'Content-Type': 'application/vnd.vimeo.*+json',
            "Authorization" : "Bearer <TEST_TOKEN>"
        })
    }).then(response => response.json()).then((response)=>{
        console.log('RESPONSE: '+JSON.stringify(response));
    }).catch((error)=>{console.log(error.message});

这会捕获错误并打印:“无法解析 blob 的数据:(null)”

Answer 1

fetch 调用的返回值是 Response目的。这不是您想要的实际对象 - 它是一个流，必须先解析为对象(或文本，或其他)才能使用。

由于您正在处理 JSON，因此您需要将响应定向为将 JSON 解析为一个对象:

fetch(`https://api.vimeo.com/users/13477675/albums?client_id=<CLIENT_ID>`, {
  method: 'GET',
  page: 1,
  headers: new Headers({
    'Content-Type': 'application/vnd.vimeo.*+json',
    "Authorization": "Bearer <TEST_TOKEN>"
  })
})
  .then(response => response.json())
  .then(responseObject => {
    console.log('RESPONSE: ' + JSON.stringify(responseObject));
    console.log(responseObject.type);
  });

除了检查其 ok 属性外，在解析 Response 对象之前，您无法对它做很多有用的事情。