I have some code written in Jade, with a link in it. The destination of the link is generated by Jade. When the link is clicked, I notice from my console that the GET-request is being executed twice.

Why is this? How can I fix this?

Here is my code:

Jade file:

ul.media-list
    each paper in paperList
        div.panel.panel-default
            div.panel-body
                li.media
                    div.media-left.media-middle
                        a(href='/publication/view/#{paper.id}')
                            | Some image
                    div.media-body
                        div.btn-group(role='group')
                            //!!! When this link is being clicked, GET is executed twice !!!
                            a.btn.btn-default(href='/publication/view/#{paper.id}')
                                | View

Console:

GET /publication/view/123 200 490ms - 5623
GET /publication/view/123 304 458ms - -

app.js:

var publication = require('./routes/publication');
app.use('/publication', publication);

publication.js:

var express = require('express');
var router = express.Router();

router.get('/view/:id', function (req, res) {
    var data;
    //Some database functions here
    //Just an example
    res.render('publication', {someData: data});
});

I have some code written in Jade, with a link in it. The destination of the link is generated by Jade. When the link is clicked, I notice from my console that the GET-request is being executed twice.

Why is this? How can I fix this?

Here is my code:

Jade file:

ul.media-list
    each paper in paperList
        div.panel.panel-default
            div.panel-body
                li.media
                    div.media-left.media-middle
                        a(href='/publication/view/#{paper.id}')
                            | Some image
                    div.media-body
                        div.btn-group(role='group')
                            //!!! When this link is being clicked, GET is executed twice !!!
                            a.btn.btn-default(href='/publication/view/#{paper.id}')
                                | View

Console:

GET /publication/view/123 200 490ms - 5623
GET /publication/view/123 304 458ms - -

app.js:

var publication = require('./routes/publication');
app.use('/publication', publication);

publication.js:

var express = require('express');
var router = express.Router();

router.get('/view/:id', function (req, res) {
    var data;
    //Some database functions here
    //Just an example
    res.render('publication', {someData: data});
});

• javascript
• node.js
• http
• express
• pug

• Are media-left and media-body overlapping somehow? A click event might fire for both of the links in that case. – orbitbot Commented Mar 14, 2015 at 13:46
• No, media-left and media-body are 2 separate divs. I just checked in the generated HTML. – JNevens Commented Mar 14, 2015 at 13:48
• Where is router defined? – Explosion Pills Commented Mar 14, 2015 at 13:54
• @ExplosionPills See my edit to publication.js – JNevens Commented Mar 14, 2015 at 13:55
• 1 @JNevens You can do a curl request curl {baseURL}/publication/view/#{paper.id} with some dummy paper.id to narrow down problem to either front end or backend. Also try logging request.url, there are some instances where one extra request is made to get favicon. – Anurag Peshne Commented Mar 17, 2015 at 7:50

3 Answers 3

It's just a hypothesis, but it looks like your browser is using some kind of prediction algorithm to pre-load your links even before you click them. Google Chrome do such things.

Express.js answered the second response with 304 Not Modified response, which indicates that it was sent with valid ETag value to validate previously cached response.

Try to disable network actions prediction in your browser. Here is how it looks in Google Chrome settings (Settings -> Show advanced settings...):

Or you may try to verify that the first request is being sent before you're actually clicking on a link by hovering your mouse over it, but not clicking it.

Its issue of Chrome not happening in Firefox or explorer

I had the same issue.

The html page I am sending contains... -image width="50" height="50" src='doesnt exist'-

cause -> get resource will be called twice.

if src="" is empty or src="image exists"

get resource will be called only once... so a missing image url cause in my case this issue...