Search code examples
jsonreactjselixirphoenix-framework

VM892:1 Uncaught SyntaxError: Unexpected token e in JSON at position 0

I'm presently working on a phx / phoenix API written in Elixir. And I have created a frontend for the API using React.js. However, I'm getting the below error message in the JS console of the browser.

I have successfully created a user using Postman, so I'm 99% sure the error isn't with the phx project, but rather somewhere with the React project.

I have both the frontend and backend hosted on github. And a .env file will need to be created in the root of the React project with the below line,

REACT_APP_API_URL=http://localhost:4000/api

and was working my way through the following tutorial.

Any and all help would greatly be appreciated.

error message

Solution

  • The output of localStorage.getItem("token") being 

    eyJhbGciOiJIUzUxMiIsInR5cCI6IkpXVCJ9.eyJhdWQiOiJVc2VyOjEiLC‌​JleHAiOjE0ODcyODI4OD‌​csImlhdCI6MTQ4NDY5MD‌​g4NywiaXNzIjoiUGhvZW‌​5peENoYXQiLCJqdGkiOi‌​IwNzFlYzgwYi0wZmYzLT‌​QyYzgtODA3Mi1kNzViZm‌​VhZTg4NWEiLCJwZW0iOn‌​t9LCJzdWIiOiJVc2VyOj‌​EiLCJ0eXAiOiJhY2Nlc3‌​MifQ.NsuqH50HooK8vjF‌​fHtPH9iXSykZ9oYA0ul4‌​b_C5fQtpu_zFvNNy-skc‌​v9HI2i25X-NlB-9xOr-x‌​zh2abnrpYUw

    suggests that for some reason, the app stored the token without passing it through JSON.stringify, and calling JSON.parse on this string throws the Unexpected token e error, as expected.

    I did not see any localStorage.setItem without JSON.stringify in the current code, so the token was probably stored like that in a previous version of the app. You should try clearing it manually and logging in again.