Resolved using NelmioCorsBundle.
I am currently utilizing angular 4.3.3 for the front end and Symfony3 for the backend, with the addition of FosRestBundle.
When working with Angular, I primarily use HttpClient to handle data request and transmission.
Data retrieval works smoothly and the results are displayed without any issues. However, complications arise when attempting to transmit data as a cors error is encountered.
Remarkably, the ability to post JSON data remains intact while using postman.
The specific error message reads:
1:1 XMLHttpRequest cannot load
http://127.0.0.1/rest/web/app_dev.php/api/comments/new/1. Response for preflight
has invalid HTTP status code 405
Error occured.
{"content":"test comment","email":"<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="423627313602252f232b2e6c212d2f">[email protected]</a>"}
Here is the TypeScript code snippet:
import {HttpClient, HttpErrorResponse, HttpHeaders} from '@angular/common/http';
constructor(private http: HttpClient, private globals: Globals, private activatedRoute: ActivatedRoute) {
}
postComment(post) {
const body = JSON.stringify(post);
this.http.put(this.globals.baseUrl + 'comments/new/' + this.id, body).subscribe(
res => {
console.log(res);
},
err => {
console.log('Error occured.');
console.log(body)
}
);
}
In the Symfony Project: web/.htaccess
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "*"
</IfModule>