Cómo obtener la extensión y nombre de archivo a partir de una ruta de archivo con Javascript y PHP

Obtener nombre de archivo con extensión

Javascript

Para obtener el nombre de archivo a partir de una ruta, reemplazaremos el contenido de la cadena de texto que no cumpla con la expresión regular  /^.*[\\\/]/

// Cualquier ruta de archivo, incluso con slash invertido
// var filepath = "\\direccion\\hacia-archivo\\nombre-archivo.png";
var filepath = "/direccion/hacia-archivo/filename.png";

// Usar la expresion regular para reemplazar el contenido extra con un espacio en blanco
var filenameWithExtension = filepath.replace(/^.*[\\\/]/, '');

// Expone nombre-archivo.png
console.log(filenameWithExtension);

La expresión regular va a retornar el texto a partir del ultimo slash. Como no todas las rutas de archivos contienen el slash normal / sino tambien \, esta función es la más recomendada y funcionará en la mayoria de los casos.

En caso de que no quieras usar una expresión regular porque estás seguro que la ruta de archivo proporcionado usará un solo tipo definido de slash, puedes dividir la cadena de texto por el caracter especifico y obtener el ultimo elemento:

var filepath = "/myfilepath/extensions/filename.png";

// With a normal slash
var group = filepath.split("/");
// or a path with an inverted slash
// var group = filepath.split("\\");

// Use the regular expression to replace the non-matching content with a blank space
var filenameWithExtension = group.pop();
// Or if you can't use pop()
// var filenameWithExtension = group[group.length - 1];

// outputs filename.png
console.log(filenameWithExtension);

PHP

Con PHP, puedes usar la función basename que está disponible en todas las versiones de PHP:

$filepath = "/ruta-de-archivo/carpeta/filename.jpg";
$filename = basename($filepath); // filename.jpg

Note: basename tiene un bug conocido al procesar caractéres asiaticos, para evitar esto puedes usar una expresión regular y preg_replace.

$filepath = "/myfilepath/extensions/filename.jpg";
$filename = preg_replace('/^.+[\\\\\\/]/', '', $filepath);  // filename.jpg

Obtener la extensión de archivo

Javascript

Para obtener la extensión de una ruta de archivo (o solamente de un nombre de archivo) con Javascript, necesitaremos dividir la cadena de texto por el caractér . y a partir del array generado, usaremos el ultimo item del array.

var path = "path/a-long/path/to-my/file.jpg";
var path_splitted = path.split('.');
var extension = path_splitted.pop();

// Si la cadena dada no tiene extensión ...
if(extension === path){
  // Si el archivo no tiene el caracter . ,significa que no hay una extensión disponible
  // si intentas con : path/to/my/file/thisisafile
  // extension == path/to/my/file/thisisafile
}

// Mostrar extensión
console.log(extension);

PHP

Para obtener la extensión de una ruta de archivo con PHP, puedes usar la función integrada de PHP pathinfo.

$path = "this-is-my/long/filepath/to/file.txt";
$ext = pathinfo($path, PATHINFO_EXTENSION);// PATHINFO_EXTENSION es una constante
echo $ext; // imprime : txt

Note: si pathinfo no está disponible en tu entorno, usa la función end.

$path = "this-is-another-long-path/to/my/file.txt";
$array_ofpath = explode('.', $path);//explode retorna un array
$extension = end($array);

Esto podría ser de tu interes

Conviertete en un programador más sociable