Pexels 图片的代码 API 不工作 - JavaScript

Question

我正在开发 Microsoft Edge 插件，我让 Pexels API 与 XMLHttpRequest 但我现在正在尝试将其转换为 Request 对象。我多次搜索解决方案，但 none 有效。
代码：

    // Get PEXELs Image
    var page = Math.random()*250;
    var url = "https://api.pexels.com/v1/search?query=cute+pets&page="+page.toString()+"&per_page=1";
    var headers = new Headers();
    headers.append('Authorization', key);
    var er = new Request(url, {headers:headers})
    var fr = fetch(er)
        .then(res => res.json())
    var r = fr
    var photos = r.photos
    console.log("photos", photos)
    var raw = photos[0].src.original;
    console.log("raw", raw);
    // document.getElementById("image").src=raw;

输出：

photos undefined

[Cute Pet Pictures] [LOG/ERROR] TypeError: Cannot read properties of undefined (reading '0') at getImage(popup.js:15) at HTMLDocument.onBLoad(popup.js:25)

Object
 - next_page: [link]
 - page: 99
 - per_page: 1
 - photos: [{...}]
 - prev_page: [link]
 - total_results: 8000

照片对象（仅显示脚本需要的部分）：

photos: Array(1)
    - 0: {... src: {original: [URL] ...} ...}

Answer 1

我通过将代码嵌入到“r”变量下面设法修复了它

var photos = r.photos
console.log("photos", photos)
var raw = photos[0].src.original;
console.log("raw", raw);
// document.getElementById("image").src=raw;

进入R变量的.then函数。

代码中的最终结果：

var r = fr.then((json)=>{
        print("json", json)
        var photos = json.photos
        console.log("photos", photos)
        var raw = photos[0].src.original;
        console.log("raw", raw);
        document.getElementById("image").src=raw;
    })

Pexels 图片的代码 API 不工作 - JavaScript

Code for Pexels image API not working - JavaScript

javascript

microsoft-edge-extension