I have an index.html file that includes a javascript:
async function fetchCelebritiesData() {
try {
const response = await fetch('/data.php');
const data = await response.json();
return data;
} catch (error) {
console.error('Error fetching data:', error);
return [];
}
}
The PHP file connects the data with the application and fetches data from names.json file.
<?php
// Check if the request is coming from an allowed domain
$allowedOrigins = array("example.com", "www.example.com");
$origin = $_SERVER['HTTP_ORIGIN'] ?? ''; // Get the HTTP_ORIGIN from the request
if (in_array($origin, $allowedOrigins)) {
header("Access-Control-Allow-Origin: $origin");
} else {
header("HTTP/1.1 403 Forbidden");
exit;
}
// Read and output the JSON data
$data = file_get_contents("data.json");
header("Content-Type: application/json");
echo $data;
?>
This setup gives me an error in the console that reads like this:
ET https://example.com.com/data.php 403
fetchCelebritiesData @ (index):291
(anonymous) @ (index):375
load (async)
(anonymous) @ (index):373
(index):295 Error fetching data: SyntaxError: Unexpected end of JSON input
at fetchCelebritiesData ((index):292:33)
at async (index):375:30
fetchCelebritiesData @ (index):295
await in fetchCelebritiesData (async)
(anonymous) @ (index):375
load (async)
(anonymous) @ (index):373
Need help in understanding what could be the issue. I have checked the file permission for PHP and JSON and the folder itself it looks fine. –6 4 4–
There’s a log generated which shows this error repeatedly.
[11-Aug-2023 09:08:58 UTC] PHP Notice: Undefined index: HTTP_ORIGIN in /home/pixellic/public_html/web-applications/celebrities-age-finder/get_secure_data.php on line 4
Appreciate your help. I’m a coding novice.
Thankyou.
I tried getting json data securedly using php file.
But I got a 403 error.
2
Answers
There won’t be an
HTTP_ORIGIN
element in$_SERVER
unless you are sending anOrigin
header with the request (see the manual). However you can useREMOTE_HOST
instead:As you noted, you’re getting a 403 error from your code, this is because this test is failing (because
$origin
is always''
with your current code):Note that you could use
REMOTE_HOST
as a backup in the situation where you might send anOrigin
header:You are making a same origin request.
Browsers will only include an
Origin
request header for a cross origin request.Substituting a missing origin with an empty string and then testing that value which can never be an origin in your list against all the rest of your logic is pointless.
Say what you mean instead. Test for the presence of the
Origin
header before trying to do anything with the value:Do not use the
Origin
header for authn/authz.As mentioned, it isn’t set same origin requests, and it can easily be spoofed in hostile requests from outside a browser.
If the
Origin
header is not present then simply don’t include theAccess-Control-Allow-Origin
header. The user’s browser will block the JavaScript of the unauthorised origin from reading the response body. (Same origin requests, like yours, won’t be blocked by the browser, so don’t need theAccess-Control-Allow-Origin
header, which is why theOrigin
header isn’t sent).Remove the
else
branch which spits out a403 Forbidden
response.Not directly relevant to your problem (because you’re making a same origin request) but those are not valid origins.
An origin is either
null
or it is a scheme + hostname + optional port. You are omitting the schemes.e.g.: