How to deal with CORS error on Vue CLI 3?

The Final Solution to CORS Error During Development.
Read this content on Medium:
medium.com/@ne...
What is CORS?
www.codecademy...

[@hamsterman64]

Thank you! This problem has been driving me up the wall. Now I can be productive again.

[@1TeddyBear11]

Awesome, been looking up for a decent solution for hours.
I'm looking forward to more of your Vue tutorials.

[@sanyuktakate4099]

I got a 404 error. May I know how we can solve this after we have solved the CORS error using the above issue?

[@adibzadeh]

Hi Negar!
Very good tutorial, this is a very good and standard solution for CORS problem 👌 Thanks

[@sanyuktakate4099]

Thank you for this video. I followed your tutorial. But after I change the code according to the way you have mentioned, I get a 404 error for the api url. My client is running on 127.0.0.1:8010. When I changed my base url of the api to 127.0.0.1:8010/users, I get a 404 error. This worked fine when I had my other client application running on the localhost:8080. This there some issue with 127.0.0.1:8010 specifically. The above code works just fine for another application. The only thing that changed was the client url (where the app is hosted).

[@nawfalkh8942]

any solution for this problem plz?!

[@hieuem9416]

me too, 404 :(

[@amirtorabi3978]

I have the same problem when deploying my app in Vercel.

[@machamachacek]

Thank you so much, I have been struggling with this for hours.

[@bilalsengul4475]

You are an angel and you have soothed my soul which has been trying to fix the same code for hours. Thank you, thank you, thank you.

[@xredmask263]

question, what can I do if I trying to get multiple resources from multiples URL's? is the same method could work?

[@dawnzhou1247]

"What is CORS" this artical can't be found...Could somebody give another link?

[@muaazhammad4446]

is it only for dev envirment ? its runing smoothly on localhoast but when i uplaod on server (after changing urls ) it not work ....

[@elyor_programmer]

Hello Everyone Thanks. you understood very well. your voice was like a music.

[@mixa26]

Omg thanks so much, ive been looking for a solution for hours.

[@krishshah3974]

thank you so much! ur explanation helped me get past this error

[@antonsheva2569]

Thank you. I spent three days trying to resolve this problem

[@randaelkhashen1631]

Thank you, it fixed my problem when in dev environment (npm run serve), but I still have a problem after building the project (npm run build), Can u help me?

[@mahdisalah6834]

did you solve it?

[@randaelkhashen1631]

@@mahdisalah6834 solved from server side configurations

[@bystronq]

thank you so much you saved me from using cors in backend :)

[@soumitripattnaik]

Will this work for vue projects created by vite?

[@elielson3ew4234]

shuld i make the same for production? what is different?

[@kiasaty]

Hi, does this work on production server?

[@sumitpanchbhai1868]

Thank you so the solution and explaining the problem

[@CodeWithEd]

very good explanation 👌
thanks for sharing

[@Rasecz]

You just dropped me a life saver!

[@hgencer03]

Thank you! it solved my problem.

[@vaibhavbhavsar6083]

I am continuously getting Error :The connection to ws://192.168.2.106:8080/sockjs-node/450/hhuu0ii4/websocket was interrupted while the page was loading. app.js line 2519 > eval:1684:9
On console

[@fadelbidiga5099]

It doesn't work for vue4 someone can help me ?

[@n1th1nnj]

This is working fine for development instance.
But i'm getting the same CORS error after hosting to the github page ( Please note that i tried to change the base URL to the github host link for the app ). Can anyone please help on this.

[@Tux0xFF]

all other tutorials do not address this issue, they just build stuff on same domain and go in circles and never fix this issue, but Negar in less than 10 minutes was able to show a practical solution and actually works.

[@goforgroobs]

What if you have an application that needs to make request from multiple different applications? This looks like it would only work for a single external api....

[@ДіанаХапусова]

module isn`t defined, what should i do?

[@rafaelmoraes1288]

Thanks a lot!!!! For real!
I was looking for a way to resolve this fucking error for so long, I appreciate so much!!

[@BhatiJhabarSingh]

Will it work even after hosting it.

[@gamercat4878]

wow nice tricks, thanks you!

[@phornjames7903]

how did i do this , if i install vue in laravel

[@ni_kabiu_john]

Ooooh My God.. so i had to interact with Apis and CORS was an issue..
THANKS ALOT NEGAR DEV

[@veljkoradunovic5449]

Trying 2 hours to find a solution, trying different browsers, nothing helps! :D
This video made my day! Thanks!!!!!!!

[@leozebul]

Thank you so much for help me.

[@lucapassani1129]

What's the name of the tool you are using to access multiple clipboards? I'm intrigued. Thanks

[@jozefmaslovsky9270]

I send you big humens thanks

[@Aljosa95]

Thank you very much! :D

[@imanismayana8863]

im beginner in vue and node, i spend one day for the problem, very helpful thanks 😄❤

[@MiguelReyesDeveloper]

Thank you so much!

[@darkestmetal5567]

Sure, can you share different ways other than complicated proxy shit?

[@MilesGilbert]

thanks for the clear and helpful explanation. this solved my problem.

[@perezmlal]

I has waste a lot of time dealing with https, certificates and cors errors. This solves all of them :D many thanks

[@thiagomariano9]

Muito obrigado, estava a dias tentando resolver isso...

[@shaikhamirprofile]

This is really a TADA!!! solution.
Video is lengthy though but has good information

[@willianregina]

i love you

[@GadiedCarrero]

you are the best....i search all day...and no body told me a solution for this

[@munteanuoana6540]

This solution works like magic. YOU ARE THE BEST!

[@jeffreyvanzwam2432]

Life-saving solution this, thank you very much!

[@14lucas06]

Thank you very much.

[@edvaldojunior6329]

I Love you lady, you save me

[@vanphan7124]

thank you so much!

[@gor2em]

thankyou

[@patricksondplay]

Thanks,

Really thank you!!!

[@pumagamer4358]

Thank u very much !

[@piotrkalman1562]

I've been looking for this all day. Thank you thank you thank you :)

[@reis.mmatheus]

Great job, i was thinking to change to fetch, but the problem has been solved. Thanks

[@Lanvisor]

Not working. :(

[@kwynintelligence435]

Thank you ... helped me a lot for testing ... I use expressjs on backend .... so one has also to look at cors settings for expressjs to get the build version running ';-)

[@amycai3867]

Thanks very much! fixed the problem finally

[@ehsanehsani2809]

Thanks Negar

[@junzio8433]

Very good tutorial❤❤❤❤❤❤ Thanks to you, I solved the problem

[@afshintavakolian6884]

Thank you👏

[@adsboonyadol]

Thank you so much,
I hope you will teach more about web development techniques with vue language. I am waiting to learn from you.
I'm not good at language, use google translate to help
;)

[@lorcapio3549]

Thank you!

[@bawer_my]

thank you

[@nemorobles975]

1000 likes

[@ernestovilela286]

It worked very well, thanks so much, you saved me

[@thiagopereira1352]

I love you

[@mr_yoshidasan]

Solo diré. TE AMO.

[@gabrielyorramnsoaresdasilv8353]

thanks!!!

[@kanishmalviya]

thanks

[@geeekfa3278]

آفرین نگار

[@NazrulIslam-iz6sw]

Thanks .. but how do i face the same problem in production server/while I m using my hosting cPanel??

[@NegarDev]

For production, this error should be handled in the backend by the API provider.

[@dynamohack]

ultimate solution i was so angry when this error came up

[@Nico-zl8cf]

Hi ! You solved my problem, thank you so much..

[@somang2401]

Thank you. This solution worked for me after 2 days of failure.

[@brahimoulhaj8139]

Problem solved. Thank youuuu !!!

[@Mid.G.]

Thats coo, now what the production ready version of this?

[@CaioSFG]

salvou minha vida

[@ngochuuo9837]

Thanks, Negar. You are my hero!!!

[@daniellyadnov6926]

Thank you!) You're the BEST)

[@arispriyanto7557]

Very Very nice tricks Negar
thank you very much

[@nove1398]

This is exactly what i needed for my problem. Thanks

[@Trinita1970]

merci

[@w123au]

Dear Negar,
you are awesome...
it was driving me crazy ...

[@ascetahedonista7161]

I'm not sure if this is considered a bad practice.

[@AdrianChallinor]

THANK YOU.
I have been struggling with this, but your video finally allowed me to see the light.

[@ilhamhanif3765]

Thank youuu u really saved my life

[@macelomelo7825]

Niceeeeeeeeeeeeeee!

[@VelizFrancia2012]

Do you guys know how I can accomplish this in React?

[@viruspk]

wow, just wow, that swapping url thing is a great hack. You are a lifesaver. 👏👌👍

[@nivlesselvin]

Thanks it worked out well....

[@jamiebrs1]

Thank you so much for this. It was a BIG help.

[@hemantvc]

Thank you for sharing helpful information

[@YasirMalik24]

you really deserve more than 5 stars. #thanks you made my day.

[@orkungedik998]

Thanks for the detailed explanation. Some heroes do not wear capes like you :)

[@mertyertugrul]

This is very helpful. Please make more contents.