API Rest Laravel 8 Cors - php

I have an API Rest with Laravel 8.12 and a front-end with VueJS, locally I can connect to the API correctly, but when uploading everything to the server where the system will be, which has "Window Server 2012 R2" installed, when trying to consult the end points the API gives cors error, I tried installing laravel cors plugins, creating a middleware and nothing, it does not work always gives cors error.
Also try using the headers
header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Headers: X-API-KEY, Origin, X-Requested-With, Content-Type, Accept, Access-Control-Request-Method");
header("Access-Control-Allow-Methods: GET, POST, OPTIONS, PUT, DELETE");
header("Allow: GET, POST, OPTIONS, PUT, DELETE");
I put these in the public/index.php and routes/api.php and it still gives the error.
I do not know if it is the server that is blocking due to some missing configuration, here I do not know completely how it would be done in the ISS.
How could I solve the cors error?

Related

CORS error in PHP server, even though 'header('Access-Control-Allow-Origin: *')' is present

I got a simple PHP server running on my local. I send requests from frontend to the PHP server. But I get CORS error even though 'header('Access-Control-Allow-Origin: *')' is present on the PHP file.
Frontend runs on 8080 port and PHP server runs on 3000 port.
Here is the error I get
Access to XMLHttpRequest at 'http://localhost:3000/' from origin 'http://localhost:8080' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
And these lines are at the top of the PHP file
header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Credentials: true");
header('Access-Control-Allow-Methods: GET, PUT, POST, DELETE, OPTIONS');
header('Access-Control-Max-Age: 1000');
header('Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token , Authorization');
Any idea why?

Axios API request doesn't send full referer in Vue.js

I have a Vue app under http://localhost:8080 and PHP API under http://vue-api.test. API requests are handled in Axios.
The problem is that $_SERVER['HTTP_REFERER'] in my API gives me always http://localhost:8080/ even if the request is sent from http://localhost:8080/page or http://localhost:8080/bla-bla-bla. Simply full path is cutted.
I tried to set different policies in Axios via headers headers: {'Referrer-Policy': 'unsafe-url'}, but it always gives me only hostname, not the full path (http://localhost:8080/page or http://localhost:8080/bla-bla-bla).
I need to know the full path of the page in my API where the request has been invoked from.
Headers in my API:
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: GET, POST, PATCH, PUT, DELETE, OPTIONS');
header('Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token, Referrer-Policy');

Preflight Request fails CORS (does not have HTTP Request OK status ) when response code isn't hardcoded

I am using a simple PHP backend and Angular frontend. I was having trouble with CORS. I have set proper headers and still faced CORS block. I tried a lot of things and noticed the following.
Since I expected a lot of PHP files I wanted uniformity among the responses. So, I created a PHP file called httpHelper.php and added a function that would set headers, response status code, and return the response.
The following is the httpHelper.php
<?php
function json_response($code = 200, $message = null)
{
header_remove();
http_response_code($code);
header('Content-Type: application/json');
header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Methods: PUT, GET, POST");
header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept");
return "{ \"detail\":". $message."}";
}
The call to this function would be made from another PHP file that would be like,
echo json_response(200, json_encode(FALSE));
I was faced with the CORS block..
Access to XMLHttpRequest at
'http://localhost:8080/checkFeedbackStatus.php' from origin
'http://localhost:4200' has been blocked by CORS policy: Response to
preflight request doesn't pass access control check: It does not have
HTTP ok status.
But when the same httpHelper.php was coded with a constant status code, I have no issue.
<?php
function json_response($code = 200, $message = null)
{
header_remove();
http_response_code(200);
header('Content-Type: application/json');
header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Methods: PUT, GET, POST");
header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept");
return "{ \"detail\":". $message."}";
}
I would like to know what I am missing, where things are getting messed up.
By the way, The request type was HTTP POST
It will not work until you use actual domain, it is currently against the CORS headers.
there may be several ways to make it work but i know only 2 of them.
Using Proxy in Xampp
Using Ngrok, this will provide you public domain to loopback on localhost.
If you are using xampp, you can edit httpd.conf and add a proxy at the end of the file and restart the apache service
ProxyPass /checkStatus http://localhost:8080/checkFeedbackStatus.php
ProxyPassReverse /checkStatus http://localhost:8080/checkFeedbackStatus.php
For Ngrok you can read the docs here
Once you setup ngrok, you can use any port to use ngrok as a public domain
ngrok http 8080

No 'Access-Control-Allow-Origin' with laravel and angular js

I used Angular js for frontend application and for backend i used laravel 5.2, I already install cors origin allowed in my project
because all data transfer very good, but when I upload images using
ajax and base64, then I get this message from my browser:
XMLHttpRequest cannot load http://www.api.panakeias.com/updateTeacherpicprofile/9. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost' is therefore not allowed access. The response had HTTP status code 500.
I deployed my two project on digital ocean LEMP Stack Ubuntu 16.04
frontend project is on main domain and backend project is on sub-domain.
Add this code on top of your route.php:
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Credentials: true');
header('Access-Control-Allow-Methods: POST, GET, OPTIONS, PUT');
header("Access-Control-Allow-Headers: Authorization, X-Requested-With, Content-Type, Accept");

CORS error in angularjs + PHP application

I'm working on AngularJS and PHP application. When I try to run the index.html page, its throwing this error,
MLHttpRequest cannot load http://...... No
'Access-Control-Allow-Origin' header is present on the requested
resource. Origin 'http://localhost' is therefore not allowed access.
The response had HTTP status code 500.
Working on LAMP.
I know I need to include the header files. But where should I include it? Should I include it in config.php where I had definded my database? If not then where??
You are missing CORS settings on your PHP headers, try adding following:
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: GET, POST, OPTIONS');
header('Access-Control-Allow-Headers: Origin, Content-Type, Accept, Authorization, X-Request-With');
header('Access-Control-Allow-Credentials: true');
Set header:
header('Access-Control-Allow-Origin: http://example.com', false);

Categories