Get the file name without GET parameters from a full path using JavaScript?

Question

Given /foo/bar/image.jpg?x=1&y=2, how do I obtain image.jpg?

https://stackoverflow.com/a/423385 provides a partial answer, but does not address the GET parameters.

you could use the information in the location object to get it. http://www.w3schools.com/jsref/obj_location.asp — toskv, Oct 04 '15 at 15:41
@toskv `/foo/bar/image.jpg?x=1&y=2` is the `src` of an image, and not the page URL. Does your recommendation still apply? — user1032531, Oct 04 '15 at 15:42
you can add up to this regex "fullPath.replace(/^.*[\\\/]/, '')" to avoid everything after the question mark as well. — priya vyas, Oct 04 '15 at 15:44
@user1032531 yes i didn't give you a ready regex. I just gave you the idea to add up something to remove everything after "?" as well. something like this "/\/([^?\/]+(?=\?|$))/gm" — priya vyas, Oct 04 '15 at 15:55

score 4 · Accepted Answer · answered Oct 04 '15 at 15:48

4

You can use regex as others have suggested, but I find this more readable:

var src = '/foo/bar/image.jpg?x=1&y=2';
var img = src.split('/').pop().split('?')[0];
console.log(img);

answered Oct 04 '15 at 15:48

Majid Fouladpour

27,709
19
72
126

All answers work, and I can't tell which one is best, but this one is a couple of characters shorter than the rest and maybe more readable (at least for a regex hack like me!). – user1032531 Oct 04 '15 at 16:02

score 2 · Answer 2 · answered Oct 04 '15 at 15:46

2

Since the ? symbol separates the GET parameters from the URL, you can

str=str.split("?")[0]
filename = str.replace(/^.*[\/]/, '')

answered Oct 04 '15 at 15:46

ProfFan

178
1
8

score 1 · Answer 3 · answered Oct 04 '15 at 15:45

1

Try:

var str = "/foo/bar/image.jpg?x=1&y=2";
var fileName = str.split('/').slice(-1)[0].split('?')[0];

or, for a regex method:

var fileName = str.split('/').slice(-1)[0].match(/[^?]+/)[0];

answered Oct 04 '15 at 15:45

hjpotter92

75,209
33
136
171

anubhava · Answer 4 · 2015-10-04T15:48:16.823

1

You can use this regex:

/\/([^?\/]+(?=\?|$))/

and use captured grpup #1.

RegEx Demo

/        # matches a literal /
[^?\/]+  # matches 1 or more of any char that is not ? or /
(?=\?|$) # is a lookahead to assert that next position is ? or end of line

edited Oct 04 '15 at 15:48

answered Oct 04 '15 at 15:45

anubhava

713,503
59
514
593

Includes a leading forward-slash. Thanks for the explanation,however! – user1032531 Oct 04 '15 at 15:58
NO it doesn't include `/` in captured group. I wrote clearly `use captured grpup #1` in my answer. – anubhava Oct 04 '15 at 16:12

Get the file name without GET parameters from a full path using JavaScript?

4 Answers4