Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0 when trying to pull data from s3 in an api route

Question

我正在尝试从 S3 存储桶中提取 JSON 文件。下面是我的 api 路径，它拉取了 json 文件：

const {GetObjectCommand, S3Client} = require("@aws-sdk/client-s3");
const client = new S3Client() // Pass in opts to S3 if necessary

function getObject (Bucket, Key) {
    return new Promise(async (resolve, reject) => {
        const getObjectCommand = new GetObjectCommand({ Bucket, Key })

        try {
            const response = await client.send(getObjectCommand)

            // Store all of data chunks returned from the response data stream
            // into an array then use Array#join() to use the returned contents as a String
            let responseDataChunks = []

            // Handle an error while streaming the response body
            response.Body.once('error', err => reject(err))

            // Attach a 'data' listener to add the chunks of data to our array
            // Each chunk is a Buffer instance
            response.Body.on('data', chunk => responseDataChunks.push(chunk))

            // Once the stream has no more data, join the chunks into a string and return the string
            response.Body.once('end', () => resolve(responseDataChunks.join('')))
        } catch (err) {
            // Handle the error or throw
            return reject(err)
        }
    })
}

export default async (req, res) => {
    const records = await getObject('bucket', 'file.json')
    res.statusCode = 200;
    res.json(records)
};

以下是我获取数据的方式：

fetch('/api/getRecords').then(res => res.json()).then(data => {console.log(data)})

检查控制台时出现以下错误：

GET https://www.example.com/api/getRecords 500

和

Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0

奇怪的是，这只发生在我的生产环境中。当我在我的开发环境中转到我的 api 路线时，它工作得很好。

我已经在生产环境中记录了来自 api 路由的响应，它返回 html 而不是它应该从中获取的 json 文件S3 存储桶。

<!DOCTYPE html>
<html>
<head>

<meta name="viewport" content="width=device-width"/>
<meta charSet="utf-8"/>
<title>500: Internal Server Error</title>
<meta name="next-head-count" content="3"/>
<link rel="preload" href="/_next/static/css/0ff82fa55a0f6a71.css" as="style"/><link rel="stylesheet" href="/_next/static/css/0ff82fa55a0f6a71.css" data-n-g=""/><noscript data-n-css=""></noscript>
<script defer="" nomodule="" src="/_next/static/chunks/polyfills-5cd94c89d3acac5f.js"></script>
<script src="/_next/static/chunks/webpack-f4f9fa09c58ec7ec.js" defer=""></script><script src="/_next/static/chunks/framework-bb5c596eafb42b22.js" defer=""></script>
<script src="/_next/static/chunks/main-1d8adce4d7e8417e.js" defer=""></script>
<script src="/_next/static/chunks/pages/_app-d6205651e8a6f164.js" defer=""></script>
<script src="/_next/static/chunks/pages/_error-a3f18418a2205cb8.js" defer=""></script>
<script src="/_next/static/pxh73WL611kWpBZCFSQx6/_buildManifest.js" defer=""></script>
<script src="/_next/static/pxh73WL611kWpBZCFSQx6/_ssgManifest.js" defer=""></script>
<script src="/_next/static/pxh73WL611kWpBZCFSQx6/_middlewareManifest.js" defer=""></script>

</head>

<body>

<div id="__next" data-reactroot="">
    <div style="color:#000;background:#fff;font-family:-apple-system, BlinkMacSystemFont, Roboto, &quot;Segoe UI&quot;, &quot;Fira Sans&quot;, Avenir, &quot;Helvetica Neue&quot;, &quot;Lucida Grande&quot;, sans-serif;height:100vh;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center">
    <div>
    <style>body { margin: 0 }</style>
    <h1 style="display:inline-block;border-right:1px solid rgba(0, 0, 0,.3);margin:0;margin-right:20px;padding:10px 23px 10px 0;font-size:24px;font-weight:500;vertical-align:top">500</h1>
    <div style="display:inline-block;text-align:left;line-height:49px;height:49px;vertical-align:middle">
        <h2 style="font-size:14px;font-weight:normal;line-height:inherit;margin:0;padding:0">Internal Server Error<!-- -->.</h2>
</div>
</div>
</div>
</div>
<script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{"statusCode":500}},"page":"/_error","query":{},"buildId":"pxh73WL611kWpBZCFSQx6","nextExport":true,"isFallback":false,"gip":true,"scriptLoader":[]}</script>

</body>
</html>

有人知道如何解决这个问题吗？

Answer 1

确保您调用的是生产服务器而不是开发服务器

Answer 2

我的生产环境中的访问密钥存在问题。本质上，我的一个 lambda 表达式出现了权限被拒绝的错误。解决该问题后，问题就解决了。没有 @Ermiya Eskandary

的帮助，我无法做到

Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0 when trying to pull data from s3 in an api route

Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0 when trying to pull data from s3 in an api route

javascript

amazon-s3

fetch-api

next.js