How to add CORS request in header in Angular 5

by

In my experience the plugins worked with HTTP but not with the latest httpClient. Also, configuring the CORS response headers on the server wasn’t really an option. So, I created a proxy.conf.json file to act as a proxy server. This is for development purposes only.

Read more about this here.

proxy.conf.json file:

{
  "/posts": {
    "target": "https://example.com",
    "secure": true,
    "pathRewrite": {
    "^/posts": ""
  },
    "changeOrigin": true
  }
}

I placed the proxy.conf.json file right next the the package.json file in the same directory.

Then I modified the start command in the package.json file:

"start": "ng serve --proxy-config proxy.conf.json"

The HTTP call from my app component:

return this._http.get('/posts/pictures?method=GetPictures')
.subscribe((returnedStuff) => {
  console.log(returnedStuff);
});

Lastly to run my app, I’d have to use npm start or ng serve --proxy-config proxy.conf.json

More Related Contents:

  1. Read response headers from API response – Angular 5 + TypeScript
  2. Angular CLI Error: The serve command requires to be run in an Angular project, but a project definition could not be found
  3. Set focus on element
  4. Compile dynamic HTML in Angular 4/5- something similar to $compile in Angular JS
  5. Angular 5 – Copy to clipboard
  6. Migrating Angular 4.x to Angular 5 [duplicate]
  7. Uncaught (in promise): Error: StaticInjectorError(AppModule)[options]
  8. angular-i18n work-around for translations in code?
  9. Angular 5 Reactive Forms – Radio Button Group
  10. How to update / upgrade from Angular 4 to Angular 5+
  11. Use OpenLayers 4 with Angular 5
  12. Angular5: Deploying Angular application to multiple clients
  13. How to bind raw html in Angular2 [duplicate]
  14. Property ‘value’ does not exist on type ‘EventTarget’
  15. How can i make a MatDialog draggable / Angular Material
  16. Angular 2 Routing run in new tab
  17. error NG6002: Appears in the NgModule.imports of AppModule, but could not be resolved to an NgModule class
  18. Best way to “flatten” an array inside an RxJS Observable
  19. Use nav.push with side menu in ionic 2
  20. ERROR Error: No value accessor for form control with unspecified name attribute on switch
  21. View is not updated on change in Angular2
  22. Debug & Run Angular2 Typescript with Visual Studio Code?
  23. Parameter in to Animation Angular2
  24. Do I have to unsubscribe from ActivatedRoute (e.g. params) observables?
  25. What is the difference between @Inject vs constructor injection as normal parameter in Angular 2?
  26. How to validate white spaces/empty spaces? [Angular 2]
  27. Style html,body from web component (Angular 2)
  28. How to send 1000 XHTTP Requests with maximum number of parallel requests
  29. `[(ngModel)]` vs `[(value)]`
  30. Angular Material2 theming – how to set app background?

Leave a Comment