Escaping backslash in string - javascript

Question

I need to show the name of the currently selected file (in <input type="file"> element).

Everything is fine, the only problem is I'm getting this kind of string "C:\fakepath \typog_rules.pdf" (browset automatically puts this as value for the input element).

When I try to split the string by '\' or '\\' it fails because of unescaped slashes. Attempts to match/replace slashes fails too. Is there a way around this? I need this to work at least in Opera and IE (because in other browsers I can use FileReader)

E.G. I'm getting "C:\fakepath\typog_rules.pdf" as input and want to get "typog_rules.pdf" as output.

Does this answer your question? [JavaScript backslash (\‌) in variables is causing an error](https://stackoverflow.com/questions/3903488/javascript-backslash-in-variables-is-causing-an-error) — Liam, Jul 27 '20 at 07:59

score 39 · Accepted Answer · edited May 23 '17 at 12:15

39

For security reasons, it is not possible to get the real, full path of a file, referred through an <input type="file" /> element.

This question already mentions, and links to other Stack Overflow questions regarding this topic.

^{Previous answer, kept as a reference for future visitors who reach this page through the title, tags and question.}
The backslash has to be escaped.

string = string.split("\\");

In JavaScript, the backslash is used to escape special characters, such as newlines (\n). If you want to use a literal backslash, a double backslash has to be used.

So, if you want to match two backslashes, four backslashes has to be used. For example,alert("\\\\") will show a dialog containing two backslashes.

edited May 23 '17 at 12:15

Community

1
1

answered Dec 23 '11 at 16:32

Rob W

341,306
83
791
678

Not helpful. You can't control what browser gives you as input[file] value. "C:\fakepath \typog_rules.pdf".split("\\"); => ["C:akepath ypog_rules.pdf"] – Max Dec 23 '11 at 18:48
@user1113690 What do you want? Split `"C:\\fake\\path\\file"` in `["C:", "fake", "path", "file"]`? You have to clarify your question, and add the current output, the real input, the expected output and the relevant code. – Rob W Dec 23 '11 at 18:53
I'm getting "C:\fakepath\typog_rules.pdf" as input and want to get "typog_rules.pdf" as output. – Max Dec 23 '11 at 19:25
1

Aha - That is expected behaviour. Clearly, for **security reasons**, it is **not desirable** that a piece of JavaScript can get the full path of a file. To summarise, it is **not possible to get the full path of a file in a `` element**. – Rob W Dec 23 '11 at 20:51
Sadly, as it seems, this is applicable only to Opera. IE can split the string "C:\fakepath \typog_rules.pdf".split("\\"); as supposed to. Thanks for your time! – Max Dec 24 '11 at 06:48
@user1113690 Because IE shows the full path. Your problem has nothing to do with string operations, but with getting the value of a file input field. If this answer satisfied you, mark the question as Accepted, by clicking at the green tick at the left side of the answer. – Rob W Dec 24 '11 at 09:21
Any solution to this? Getting "C:\fakepath \typog_rules.pdf".split("\\"); => ["C:akepath ypog_rules.pdf"] in MAC Chrome – Pankaj Phartiyal Apr 04 '13 at 07:42
@PankajPhartiyal Did you escape the backslash within the original string literal? If you It seems that you've used one backslash, which escapes the following characters: `\f` (form feed), `\t` (tab). Use `"C:\\fakepath\\typog_rules.pdf".split("\\");` instead. Two backslashes are needed to see a backslash in a string. – Rob W Apr 04 '13 at 07:45
And how can I do that in Javascript. I mean how can I convert single backslash into double. Because escaping can't be avoided in such strings. replace, split and other string manipulation functions can't detect "/" as the string is passed to them in escaped form. e.g. `"C:\fakepath\alex-dukal_stamp-brushes_v2.abr".lastIndexOf('\\')` returns -1 – Pankaj Phartiyal Apr 04 '13 at 07:51
@PankajPhartiyal Like I said in my previous comment, `\f` is an escaped *form feed* character. It is not a "backslash followed by f". If you want to put a backslash in a string, escape it: `\\`. You don't have to worry about the escapes if you understand them. Just remember to escape the backslash when you intend to refer to a backslash in the source code. When you get input from e.g. the user, backslashes do not have this special meaning. – Rob W Apr 04 '13 at 07:56
`$("[type=file]").val()` returns `"C:\fakepath\alex-dukal_stamp-brushes_v2.abr"` but when I type `"C:\fakepath\alex-dukal_stamp-brushes_v2.abr"` then it retunrs escaped version `"C:akepathalex-dukal_stamp-brushes_v2.abr"`. Means `$("[type=file]").val()` returns double escaped string which preserves slashes. I was playing around with raw string in chrome console and getting it all wrong. Thanx Man. – Pankaj Phartiyal Apr 04 '13 at 08:08
2

@Pankaj: and you're still getting it wrong, the in memory representation of strings are never escaped. Escaping is a matter of serialization. .val() return strings unescaped. What is not correct is that when printing, the printed value of a string may not round trip because string literals requires escaping. – Lie Ryan May 30 '13 at 14:15

score 6 · Answer 2 · answered Dec 23 '11 at 16:32

6

Escape the backslash character.

foo.split('\\')

answered Dec 23 '11 at 16:32

Quentin

914,110
126
1,211
1,335

Oops, not sure if this is the problem. Looks like the OP already tried that (I was looking at the source of the question — and edited it to show it clearly) – sidyll Dec 23 '11 at 16:35

Himerzi · Answer 3 · 2014-07-28T16:04:29.383

4

I think this is closer to the answer you're looking for:

<input type="file">

$file = $(file);
var filename = fileElement[0].files[0].name;

edited Jul 28 '14 at 16:04

answered Jan 18 '13 at 17:32

Himerzi

899
1
8
16

If i have a string like this "FILEUPLOADS\city_sri\src\com\travelocityapp22\commonmodule\dto" then how to split them using '\' – rolling stone May 26 '15 at 12:56

score 3 · Answer 4 · answered Jul 02 '18 at 11:10

3

Slightly hacky, but it works:

const input = '\text';
const output = JSON.stringify(input).replace(/((^")|("$))/g, "").trim();

console.log({ input, output });
// { input: '\text', output: '\\text' }

answered Jul 02 '18 at 11:10

Ashley Williams

6,770
4
35
42

score 0 · Answer 5 · edited Jun 22 '16 at 08:52

0

Add an input id to the element and do something like that:

document.getElementById('inputId').value.split(/[\\$]/).pop()

edited Jun 22 '16 at 08:52

Matteo Baldi

5,613
10
39
51

answered Jun 22 '16 at 08:11

Yifat Biezuner

40
1

Escaping backslash in string - javascript

5 Answers5

Linked

Related