使用 JavaScript fetch 检查 YouTube 缩略图是否存在

Question

我知道类似的问题已经被问过很多次了，但我仍然无法找到解决方案，甚至无法找到这种方式的解释。

我从事的项目需要 YouTube 缩略图的最佳分辨率。我使用了以下网址https://i.ytimg.com/vi/VIDEOID/maxresdefault.jpg，但我发现在极少数情况下这不起作用，我会得到一个占位符图像和 404 状态。在这种情况下我想使用https://i.ytimg.com/vi/VIDEOID/hqdefault.jpg.

为了检查图像是否存在，我尝试使用 JavaScript 发出获取请求：

const url = "https://i.ytimg.com/vi/VIDEOID/hqdefault.jpg"
fetch(url).then(res => console.log(res.status))

但我收到一条错误消息，指出缺少 CORS 标头“Access-Control-Allow-Origin”。我尝试设置它和我找到的其他几个标头，但无济于事。仅当我以无相关模式发送请求时它才有效，但状态始终为0并且所有其他数据似乎也丢失了。

我还在 Postman 中测试了该请求，甚至复制了 Postman 给我的 JavaScript-Fetch-Snipped：

var requestOptions = {
  method: 'GET',
  redirect: 'follow'
};

fetch("https://i.ytimg.com/vi/VIDEOID/maxresdefault.jpg", requestOptions)
  .then(response => response.text())
  .then(result => console.log(result))
  .catch(error => console.log('error', error));

我读到这是服务器的问题，并且 Youtube 限制了这一点，但是为什么它在 Postman 中工作以及为什么在<cfhttp>ColdFusion 中使用时工作？此外，状态代码甚至会显示在控制台中的 CORS 错误消息中......

Answer 1

以下代码对我来说工作正常，我总是得到 200 状态 ok 可以完成类似的实现

        //import fetch from 'node-fetch';
    const fetch = require('node-fetch');
    loaddata();
    async function loaddata(){
        var Headers="{headers: {'Access-Control-Allow-Origin': '*'}";
        var requestOptions = {
            method: 'GET',
            redirect: 'follow',

        };
        const response = await fetch('https://i.ytimg.com/vi/9DCwyuH29SI/hqdefault.jpg',requestOptions,Headers);
        console.log(response);
    }