Console Error Lesson #9

[Oliver-Turp]

Getting error Uncaught (in promise) SyntaxError: Unexpected token '<', "<!DOCTYPE "... is not valid JSON in the chrome console when running both front end backend lesson #9. Right after you used the proxy.

I copy pasted your repo code into my copy, no fix.

I clone your repo and run it, works fine. Only thing different is the MONGO_URI but that worked fine til now works fine in postman this error is linked to the index setup apparently.

The only other thing I can think of is I am using VITE over CRA but the general methodology should work fine, no?

[gkpk30]

I use Vite and i can never get proxy to work so i use the cors-npm.

//middleware
app.use(cors())
app.use(express.json());

[MJCoder15]

Thanks for telling it

[kwm0304]

You can also add this to your vite.config file
export default defineConfig({
plugins: [react()],
server: {
proxy: {
'/api': {
target: 'http://localhost:4000',
changeOrigin: true,
secure: false
}
}
}
})

[codegode23]

Thank you kwm0304

[Sohail1961]

I have faced the same issue!
I tried everything from YT comments to ChatGPT finally the solution by @kwm0304 and @gkpk30 worked

To summarise

1. Go to your backend folder's terminal and do
   npm install cors

2. Middleware code!
   //middleware
   app.use(cors());
   app.use(express.json());

app.use((req, res, next) => {
console.log(req.path, req.method);
next();
});

app.use('/api/workouts', workoutRoutes);

3: finally in your vite.config.js

export default defineConfig({
plugins: [react()],
server: {
proxy: {
'/api': {
target: 'http://localhost:4000',
changeOrigin: true,
secure: false,
},
},
},
});