Check if file exists using javascript fails

Question

I've seen some of the answers here like this one, but due to my reputation, I can't comment.

The problem is somehow the results show me the wrong one. It all outputs the file exists! even though it does not really exists.

function doesFileExist (urlToFile) {
  const xhr = new XMLHttpRequest()
  xhr.open('HEAD', urlToFile, false)
  xhr.send()

  return console.log(xhr.status == 200 ? 'File exists' : 'File does not exist')
}

It outputs:

File Exists

https://stackoverflow.com/q/3646914 this is the same question. Sadly i cannot comment due to my reputation. And i tried all the answers there — Karma Blackshaw, Oct 18 '18 at 15:50
so, what is xhr.status then, we know it's not 404. Usually a status of 200 means the request worked (not necessarily that the "file exists" though) — James, Oct 18 '18 at 15:52
Some browsers are not sending synchronous requests anymore, despite of setting async argument to false. — Teemu, Oct 18 '18 at 15:52
greater than 20o or not equal to 200, they all output the same sir James, the file exists — Karma Blackshaw, Oct 18 '18 at 15:54
It looks like you're trying to use client-side JS to check for a server-side file. That won't work. — Alex Howansky, Oct 18 '18 at 15:54
@AlexHowansky it should still return 404 if I run it in my console it works as expected — PHP_Developer, Oct 18 '18 at 16:00
Okay. I have a solution. Give me 5 mins. Need to jump on laptop cant code on phone. — Mohammad C, Oct 18 '18 at 16:02
_"in my console it works as expected"_ Is your browser is running on the same machine that's hosting the code? — Alex Howansky, Oct 18 '18 at 16:11
it shouldn't really matter the file does not exist anywhere so requesting that file via javascript in a browser should always get 404 — PHP_Developer, Oct 18 '18 at 16:14

Mohammad C · Accepted Answer · 2018-10-18T17:39:51.947

2

function doesFileExist(urlToFile)
{
    var xhr = new XMLHttpRequest();
    xhr.open('HEAD', urlToFile, false);
    xhr.send();
    if (xhr.readyState == 4 && xhr.status == 404 ) {
        console.log("File doesn't exist");
        return false;
    } else {
        console.log("File exists");
        return true;
    }
}

doesFileExist('/Framework/views/login/activate_studeasdfnt.php')

Try that. I have tested it. Sorry for taking too long. Also if your function is to test if file exists i would recommend checking for a 200 response. But its up to you.

edited Oct 18 '18 at 17:39

answered Oct 18 '18 at 16:25

Mohammad C

1,321
1
8
12

1

Hello sir ! Sorry i haven't thanked you before, it's due to my low reputation. But now, I express my gratitude that I made it out of that hole. Thank you! – Karma Blackshaw Jan 17 '20 at 07:06

score -1 · Answer 2 · answered Oct 18 '18 at 15:51

-1

try checking if it's greater than 400

function doesFileExist(urlToFile)
{
    var xhr = new XMLHttpRequest();
    xhr.open('HEAD', urlToFile, false);
    xhr.send();
    if (xhr.status >=400 ) {
        console.log("File doesn't exist");
        return false;
    } else {
        console.log("File exists");
        return true;
    }
}

doesFileExist('/Framework/views/login/activate_studeasdfnt.php')

answered Oct 18 '18 at 15:51

PHP_Developer

386
3
11

same output sir, file exists – Karma Blackshaw Oct 18 '18 at 15:53
does the file exist? if I run this in my in my console it works correctly – PHP_Developer Oct 18 '18 at 15:55
add this in the else `console.log("File exists"+xhr.status);` – PHP_Developer Oct 18 '18 at 15:55
still, but the status is 200 – Karma Blackshaw Oct 18 '18 at 15:57
im going to post my file folder structure – Karma Blackshaw Oct 18 '18 at 15:57

score -1 · Answer 3 · answered Oct 18 '18 at 16:12

-1

$('#activate_user_level').on('change', function(){
    var user_level = $(this).val(),
        content = $('#content'),
        url = '/views/login/activate_'+ user_level +'.php';

    $.ajax({
        url : controllers('ActivatesController'),
        method : 'POST',
        data : {change_modal_content_activate : 1, url : url},
        success : function(e){
            console.log(e)
        }
    })
})

server

if(isset($_POST['change_modal_content_activate'])){
    $url = dirname(__DIR__) . $init->post('url');
    var_dump(file_exists($url));
}

answered Oct 18 '18 at 16:12

Karma Blackshaw

880
8
20

1

Security tip 1: don't pass the full file name, you're disclosing too much info about how your system is built. Just pass the `user_level` string and then build the file name on the server side. – Alex Howansky Oct 18 '18 at 16:20
Security tip 2: Don't trust the value passed in for `user_level`. What if somebody passes in a value like `../../../../etc/foo`? Instead of building a file name with the string, check that it exists in a hard-coded array, or build a class name and use `class_exists()`. – Alex Howansky Oct 18 '18 at 16:22
1

hey @Fear, fixed your original post. – Mohammad C Oct 18 '18 at 16:41
what do you mean sir @noyanc – Karma Blackshaw Oct 18 '18 at 17:37
check my answer. I have provided a fix to your problem with the code you provided – Mohammad C Oct 18 '18 at 17:39

Check if file exists using javascript fails

3 Answers3