Display a Note

Chapter Comments
1

From @jayair on Mon Apr 10 2017 01:06:45 GMT+0000 (UTC)

Link to chapter - http://serverless-stack.com/chapters/display-a-note.html

Copied from original issue: https://github.com/AnomalyInnovations/serverless-stack-com/issues/53

2

From @AndrewWrightNZ on Tue Sep 12 2017 05:57:59 GMT+0000 (UTC)

Hey I can view all notes in the list view on Home.js but when I click on a note I get the error:

TypeError: Failed to fetch

{message: "Missing Authentication Token"}
message
:
"Missing Authentication Token"

Any ideas?

3

From @jayair on Tue Sep 12 2017 19:42:48 GMT+0000 (UTC)

@AndrewWrightNZ That’s weird that it’s looking for the token. Can I just do a sanity check and look at your serverless.yml for the backend?

4

From @AndrewWrightNZ on Tue Sep 12 2017 19:44:15 GMT+0000 (UTC)

@jayair Yeah sure, https://github.com/AndrewWrightNZ/notes-app-api/blob/master/serverless.yml

5

From @jayair on Wed Sep 13 2017 18:51:30 GMT+0000 (UTC)

@AndrewWrightNZ Yeah that looks okay.

In a previous version of the tutorial we were sending the userToken in each of the invokeApig calls. Can I see your Home.js?

6

From @AndrewWrightNZ on Thu Sep 14 2017 01:38:51 GMT+0000 (UTC)

Yeah - https://github.com/AndrewWrightNZ/notes-app-client/blob/master/src/containers/Home.js

From a quick google search it may be AWS config related?

7

From @jayair on Thu Sep 14 2017 18:22:30 GMT+0000 (UTC)

@AndrewWrightNZ Not sure if this is the right version but I tried your repo and the invokeApig call in Home.js is making a request to the wrong API endpoint? And there is no Notes.js? If you push the updated version I’ll take a look.

8

From @AndrewWrightNZ on Fri Sep 15 2017 22:24:26 GMT+0000 (UTC)

@jayair awesome, just reviewed all of the routes and its working :100:

9

From @tommedema on Fri Oct 20 2017 06:46:17 GMT+0000 (UTC)

Is there any reason why some async functions are not defined as async. Is this deliberate?

I.e.

getNote() {
    return invokeApig({ path: `/notes/${this.props.match.params.id}` });
}

instead of

async getNote() {
    return await invokeApig({ path: `/notes/${this.props.match.params.id}` });
}
10

I can get all of my notes using
API.get(“notes”, “/notes”), but using API.get(“notes”, /notes/${this.props.match.params.id}) just returns an empty string w/ no errors.
(note I have the backticks in there, this text editor is editing them out).

I have verified that the props.match.params thing is returning the correct noteId.

I also want to point out that when I use API.del(“notes”, …params.id) it does properly DELETE the note.

11

For the /notes/${this.props.match.params.id} route, can you test it directly using the steps in this chapter?

And for the delete case, what happens when you call it?

12

I get a 200 response.

I’m getting a 200 response for everything; including the “get a note”. It’s just returning an empty string instead of a note object.

13

Hmm something seems off. Can you compare it to the repo?

14

Why do I get an error like this when I click on a note?

Capture
Capture.PNG736Ă—316 14.4 KB

15

This seems related to React Router? After which step of the tutorial are you seeing this?

1 Like
16

Everything worked fine until the front end implementation of render all notes part. But when it comes to displaying a note, this error appears. I have tried changing react-router versions. But it doesn’t seem to work. Thank you so much for spending time to reply. :slight_smile:

17

Hmm if that is the case then maybe compare the code you have, specifically this chapter to the one in the repo?

18

Hello,

Thanks for the great tutorial !

I have implemented the “create”, “list”, “get”, “update”, and “delete” functionalities at the client and at the backend and all of them worked fine except “get” which throws the following error messages:

  • At the client: <<Error: Request failed with status code 500>>
  • At the backend (CloudWatch Logs): <<ValidationException: The provided key element does not match the schema>>

Checking futher with CloudWatch Logs I realized that all the entries in the object “event.requestContext.identity” in the “get” lambda function are null except “sourceIp” and “userAgent”:

identity:

{ cognitoIdentityPoolId: null,
accountId: null,
cognitoIdentityId: null,
caller: null,
sourceIp: 'XXX.XXX.XXX.XXX',
accessKey: null,
cognitoAuthenticationType: null,
cognitoAuthenticationProvider: null,
userArn: null,
userAgent: 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3578.98 Safari/537.36',
user: null }

The other “event” objects of the rest of lambdas are filled correctly.

What could it be?

19

This sounds like the get function is not going through an authentication process. I would check the serverless.yml and see if the authorizer is set correctly. Especially if it is indented correctly in comparison to the other functions.

1 Like
20

Hello,

Thanks for the hint.

I have checked both the authorizer and the indentation and they are correct.

Anyway, I have to say that the problem has faded away when entering the second part of the tutorial (Automation) and I have cloned the github repository " serverless-stack-demo-api". While I have not found the root cause for the above mentioned problem, it works properly now and I have decided to move forward.

Thank you very much for your support!