If we have the following structure in our application:
And we fill our index.php with the following content just to get a basic website with a form working. You should be able to run this through a php-server of your choice.
Cross-origin resource sharing (CORS) is a mechanism that allows restricted resources (e.g. fonts) on a web page to be requested from another domain outside the domain from which the first resource was served. This is set on the server-side and there is nothing you can do from the client-side to change that setting, that is up to the server/API. There are some ways to get around it tho.
Sources : MDN - HTTP Access Control | Wiki - CORS
CORS is set server-side by supplying each request with additional headers which allow requests to be requested outside of the own domain, for example to your localhost. This is primarily set by the header:
Access-Control-Allow-Origin
| /** | |
| * There is a pro to using document.createElement() instead of just applying a | |
| * string to the page that gets converted to HTML. When we use the pure string method | |
| * we do not get a link/reference to the actual element that is seen on the page. This | |
| * usually means we have to get the element again to modify it. For example, add an event | |
| * listener | |
| */ | |
| //----------------------------------------------- | |
| // .createElement() + .addEventListener() |
| /**************** | |
| * GET REQUEST * | |
| ****************/ | |
| /* We create a new request-object that will handle the transaction between the server/database | |
| * and the client (me/us/the browser). */ | |
| var request = new XMLHttpRequest(); | |
| /* | |
| * We add a listener to the request which will listen to when the state changes, |