Say I've got a few GET routes on my Express application:

// music albums
app.get('/api/albums', routes.albums.getAlbums);
app.get('/api/albums/:id', routes.albums.getAlbum);
app.get('/api/albums/artwork', routes.albums.getAlbumArtwork);

and I attempt to hit them using the follow jQuery AJAX snippet:

$("#retrieveAlbumArtwork").on("click", function() {
    $.ajax({
        url: "api/albums/artwork",
        type: "GET",
        data: {
            artist: $("#albumArtist").val(),
            title: $("#albumTitle").val()
        },
        // ... callbacks and such

For some reason, this call hits the second handler, with the /:id parameter, instead of the explicit /artwork route. Swapping them like so makes them function as expected:

// music albums
app.get('/api/albums', routes.albums.getAlbums);
app.get('/api/albums/artwork', routes.albums.getAlbumArtwork);
app.get('/api/albums/:id', routes.albums.getAlbum);

Can someone explain exactly why this is happening? I would assume Express would be smart enough to identify an id param (/albums/23453243) versus a querystring (/albums/artwork?artist=artistName&title=albumTitle) and route appropriately, but this doesn't seem to be the case?

Edit
Report