質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
Amazon DynamoDB

Amazon DynamoDBは、 AWS上のNoSQLデータベースサービスです。フルマネージド型のサービスで、スキーマレス、高速且つ安定性のある動作、自動的に容量を変更する自動スケーリングなどの特徴を持ちます。

GET

GETとはHTTPが対応するリクエストメソッドの一つです。クライアントからサーバーへ送られたURLパラメータのデータを取得する時必要がある時に使われます。

TypeScript

TypeScriptは、マイクロソフトによって開発された フリーでオープンソースのプログラミング言語です。 TypeScriptは、JavaScriptの構文の拡張であるので、既存の JavaScriptのコードにわずかな修正を加えれば動作します。

apt-get

apt-getコマンドはUNIX系OSのパッケージのインストールなど、パッケージ管理を行うためのコマンドです。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

Q&A

0回答

792閲覧

Serverless Stack: GETリクエストでundefinedが返ってくる

607842

総合スコア8

Amazon DynamoDB

Amazon DynamoDBは、 AWS上のNoSQLデータベースサービスです。フルマネージド型のサービスで、スキーマレス、高速且つ安定性のある動作、自動的に容量を変更する自動スケーリングなどの特徴を持ちます。

GET

GETとはHTTPが対応するリクエストメソッドの一つです。クライアントからサーバーへ送られたURLパラメータのデータを取得する時必要がある時に使われます。

TypeScript

TypeScriptは、マイクロソフトによって開発された フリーでオープンソースのプログラミング言語です。 TypeScriptは、JavaScriptの構文の拡張であるので、既存の JavaScriptのコードにわずかな修正を加えれば動作します。

apt-get

apt-getコマンドはUNIX系OSのパッケージのインストールなど、パッケージ管理を行うためのコマンドです。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

0グッド

0クリップ

投稿2021/10/29 23:16

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

1import React, { useState, useRef, useEffect } from 'react' 2import { useParams } from 'react-router-dom' 3import { API } from 'aws-amplify' 4 5 6const UserPage: React.FC = () => { 7 const [user, setUser] = useState([]) 8 const { id }: { id: string } = useParams() 9 10 useEffect(() => { 11 function loadUser() { 12 return API.get('users', `/users/${id}`) 13 } 14 15 async function onLoad() { 16 try { 17 const user = await loadUser().catch(e => console.error(e)) 18 console.info('user function', user) 19 setUser(user) 20 } catch (e) { 21 console.error(e) 22 } 23 } 24 onLoad() 25 }, [id]) 26 27 return ( 28 <> 29 <h3>user{user}</h3> 30 </> 31 ) 32} 33

getUser.ts

ts

1import handler from "./util/handler"; 2import dynamoDb from "./util/dynamodb"; 3 4export const main = handler(async (event: any) => { 5 const params = { 6 TableName: process.env.TABLE_NAME, 7 Key: { 8 storeName: "test_shop", 9 email: event.pathParameters.id, 10 }, 11 }; 12 13 const result = await dynamoDb.get(params); 14 if (!result.Item) { 15 throw new Error("Item not found."); 16 } 17 18 // Return the retrieved item 19 return result.Item; 20});

handler.ts

ts

1export default function handler(lambda: any) { 2 3 return async function (event: any,context: any){ 4 5 let body, statusCode; 6 7 try { 8 // Run the Lambda 9 body = await lambda(event, context); 10 statusCode = 200; 11 } catch (e: any) { 12 log.error(e); 13 body = { error: e.message }; 14 statusCode = 500; 15 } 16 17 // Return HTTP response 18 return { 19 statusCode, 20 body, 21 }; 22 }; 23}

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問