The following questions will test our knowledge of what we have just learned:

1. What is wrong with the following HTTP POST request using the fetch function?

fetch('http://localhost:17525/api/person', {
  method: 'post',
  headers: {
    'Content-Type': 'application/json',
  },
  body: {
    firstName: 'Fred'
    surname: 'Smith'
  }
})

2. What is wrong with the following request using the fetch function?

fetch('http://localhost:17525/api/person/1')
  .then(res => {
    console.log('firstName', res.body.firstName);
  })

3. What is wrong with the following request using the fetch function?

fetch('http://localhost:17525/api/person/21312')
  .then(res => res.json())
  .catch(res => {
    if (res.status === 404) {
      console.log('person not found')
    }
  });

4. We have an endpoint for deleting users that only administrators have access to use. We have the user's access token in a variable called jwt. What is wrong with the following request?

fetch('http://localhost:17525/api/person/1', {
  method: 'delete',
  headers: {
    'Content-Type': 'application/json',
    'authorization': jwt
  });

5. In this chapter, we implemented a AuthorizedPage component that we could wrap around a page component so that it is only rendered for authenticated users. We could implement a similar component to wrap around components within a page so that they are only rendered for authenticated users. Have a go at implementing this.