React/TypescriptとServerless Stackを用いたアプリ開発を行っております。GET APIを使ってdynamodbからユーザー情報を取得したいのですが、console.info('user function', user)
で"undefined"が表示されます。
ただし、vscode's terminalでは以下のように表記されています。
GET /users/aaa@gmail.com 7aefa RESPONSE {"statusCode":200,"body":{"checkinDate":163,"storeName":"test_shop","email":"aaa@gmail.com","name":"aaa"}}
.
Chromeのコンソールでは以下のようにエラーが出ています。
Error: Request failed with status code 500 at createError (createError.js:16) at settle (settle.js:17) at XMLHttpRequest.onloadend (xhr.js:54)
vscodeのターミナルとchromeのconsoleで言っていることが違います。 また、Cloud watchのログをチェックしたのですが、エラーらしきものは見つけることができませんでした。アドバイスや修正点を教えていただければ非常に助かりますので、何卒よろしくお願い致します
UserPage.tsx
tsx
import React, { useState, useRef, useEffect } from 'react' import { useParams } from 'react-router-dom' import { API } from 'aws-amplify' const UserPage: React.FC = () => { const [user, setUser] = useState([]) const { id }: { id: string } = useParams() useEffect(() => { function loadUser() { return API.get('users', `/users/${id}`) } async function onLoad() { try { const user = await loadUser().catch(e => console.error(e)) console.info('user function', user) setUser(user) } catch (e) { console.error(e) } } onLoad() }, [id]) return ( <> <h3>user{user}</h3> </> ) }
getUser.ts
ts
import handler from "./util/handler"; import dynamoDb from "./util/dynamodb"; export const main = handler(async (event: any) => { const params = { TableName: process.env.TABLE_NAME, Key: { storeName: "test_shop", email: event.pathParameters.id, }, }; const result = await dynamoDb.get(params); if (!result.Item) { throw new Error("Item not found."); } // Return the retrieved item return result.Item; });
handler.ts
ts
export default function handler(lambda: any) { return async function (event: any,context: any){ let body, statusCode; try { // Run the Lambda body = await lambda(event, context); statusCode = 200; } catch (e: any) { log.error(e); body = { error: e.message }; statusCode = 500; } // Return HTTP response return { statusCode, body, }; }; }
まだ回答がついていません
会員登録して回答してみよう