0

We are currently building an application with an API based on Laravel and an Angular 5 frontend. We are no experts with either one of these so we are progressing rather slow. One error keeps popping up a lot lately:

HttpErrorResponse {headers: HttpHeaders, status: 0, statusText: "Unknown Error", url: null, ok: false, …}
error: ProgressEvent {isTrusted: true, lengthComputable: false, loaded: 0, total: 0, type: "error", …}
headers:HttpHeaders {normalizedNames: Map(0), lazyUpdate: null, headers: Map(0)}
message:"Http failure response for (unknown url): 0 Unknown Error"
name:"HttpErrorResponse"
ok:false
status:0
statusText:"Unknown Error"
url:null
__proto__:HttpResponseBase

I already spent a few hours yesterday and now today, too, on trying to find the culprit. I found a lot of possible reasons why this is happening but so far, nothing seems to be what is wrong in our case. And strangely it only happens on PUT requests. Everything else works without errors.

So if someone has a hint or an idea where this might come from, please comment! I am fully aware that this might be a total noob error or ignorance on my side, feel free to tell me how stupid i am if you know where i missed something obvious :)

Thank you!

  • Possibly a CORS issue? [https://stackoverflow.com/a/47295193/5651536](https://stackoverflow.com/a/47295193/5651536). The request could be failing the preflight check. – John Ellmore Mar 15 '18 at 18:08
  • Check the network tab for your browser's developer console to see what data it's sending, and what the response is. Check the laravel logs (`/storage/logs`) to see if there's a hint there as to what's going on. – aynber Mar 15 '18 at 18:22
  • Thanks for the hints. I also thought it was a CORS issue but adding the appropriate headers did not fix it. Maybe my CORS implementation was wrong. I will check on that tomorrow. Same for the Logs... I was unaware of the location... – ThisMightWork Mar 15 '18 at 22:42

1 Answers1

0

It probably CORS issue. There are some options to fix this.

  1. Angular Proxy Config https://juristr.com/blog/2016/11/configure-proxy-api-angular-cli/
  2. Laravel Cors https://github.com/barryvdh/laravel-cors

Make sure you are using Laravel cors only for development, it might become security issue on production.

Other way, you can try hard part. Build your Angular app.

ng build

Then put the webpack in Laravel public dir and move it into apache/nginx.

Misti
  • 61
  • 9
  • Hey, thanks for the hints. I tried a simpler CORS solution for the Laravel API but it did not fix the problems. I will give that one another shot. The problem is that the final frontend will have to work not only directly from the webserver but also from mobile clients that talk directly to the api and also need to work with local cached resources. – ThisMightWork Mar 19 '18 at 09:04