我的用例或出现的问题可能很简单。我无法调试或找出为什么我的请求记录为Pending promise。让我启动所有相关代码,然后我们再讨论
- 索引. html**
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Infinite Scroll</title>
<script src="./infiniteScroll.js" defer></script>
</head>
<body>
<div id="testimonial-container"></div>
</body>
</html>
- 无限滚动. js**
async function fetchAndAppendTestimonials(limit = 5, after = 0) {
const testimonialsResponse = await fetch('/testimonials');
const testimonials = testimonialsResponse.json();
console.log(testimonials);
}
fetchAndAppendTestimonials(5, 0);
我开始逐步添加server.js
,以便可以绕过CORS调用外部API-"https://api.frontendexpert.io/api/fe/testimonials";
- 服务器. js**
const express = require('express');
const cors = require('cors');
const path = require('path');
const axios = require('axios');
const app = express();
const port = process.env.PORT || 80;
app.use(cors());
app.use(express.static('public'));
const API_BASE_URL = 'https://api.frontendexpert.io/api/fe/testimonials';
async function fetchTestimonials(limit = 5, after = 0) {
const testimonialUrl = new URL(API_BASE_URL);
testimonialUrl.searchParams.set('limit', limit);
testimonialUrl.searchParams.set('after', after);
try {
const testimonials = await axios.get(API_BASE_URL);
return testimonials.data;
} catch (error) {
console.log(error);
return error;
}
}
app.get('/testimonials', function (req, res) {
const testimonials = fetchTestimonials(5, 0);
console.log('testimonials', testimonials);
res.json(testimonials);
});
app.get('/', function (req, res) {
res.sendFile(path.join(__dirname, '/index.html'));
});
app.listen(port, function () {
console.log('Server is running on port', port);
});
到目前为止,这是整个应用程序(不包含package.json和其他元文件),我不明白的是,在server.js
文件和fetchTestimonials
函数中,返回的证明是Promise { <pending> }
。这一点从函数调用后的console.log
中可以明显看出。
有人能纠正这个错误吗?这样我就可以将JSON响应返回到我的客户端infiniteScroll.js
文件。
切线,但如果有人,可以补充说,如果这是最好的方法,允许CORS将是伟大的。
1条答案
按热度按时间wfypjpf41#
您似乎没有在
/testimonials
路由中等待fetchTestimonials
。通过使路由处理程序异步,可以解决Promise {<pending>}