functions called from browser execute twice

[stocksp]

Although curl will only call the function once.
Chrome load or refresh calls the function twice.
A bit confusing when debugging something more complex than HelloWorld.

Very easy to see:

exports.helloWorld = (req, res) => {
    console.log('running HelloWorld'); // <-- oh no not again
    res.send('Hello, World');
  };

Is there a way to stop this?

[stew-r]

Very interesting. I can confirm that I'm also encountering this issue.

@swalkowski any idea what might be causing this?

[stew-r]

OK so we think this is happening because browser requests also send a request for a favicon. This means that hitting the function in the browser results in two invocations of the function.

I think we can fix this by changing our logic to only invoke the function in response to requests on /${function_name} instead of /*.

Thanks for the report.

[grant]

Looks like the fix would be:
https://github.com/dougiefresh49/functions-framework-nodejs/commit/d15f1d24d1d45e809a019fb02cb1c56c797ecf72

[grant]

I've created a PR to fix this.

[grant]

Fixed in master. Please re-open if you still see this issue when testing on master.
Should be fixed on npm in next release.

[dobromyslov]

Why have you reverted this without any explanation? 1.3.2 still executes twice.

[hdp617]

I reverted this because it was not compatible with GCF. Requests to a deployed function to GCF would return an error. We are working on solving this issue.

[grant]

Looks like internal bug is b/133880441

[dobromyslov]

Thank you for clarification, Grant. For development as a workaround I use Express and bind my functions to URIs there. In index.js I check if production Cloud Functions environment is not available and then configure Express itself with all project functions as a main function. This approach makes possible to run several functions simultaneously and the problem with double execution disappears.

[chiefjester]

I'm glad I stumbled on this thread. @stew-r is correct, when accessed by a browser, it requests an additional payload for favicon.ico. I'm just putting this up for future me and people get annoyed by this extra invocation.

You can wrap your statements via:

  if (req.originalUrl !== "/favicon.ico") {
    console.log("running HelloWorld");
  }

Or just use express as @dobromyslov suggest and use a middleware that ignores the favicon.

function noFavicon(req, res, next) {
  req.originalUrl === "/favicon.ico" ? res.status(204).json({}) : next();
}
app.use(noFavicon)

or just add a new route

app.get("/favicon.ico", (req, res) => res.status(204).json({}));

[kirbdee]

👍

When running

functions-framework --target=sampleFunction

the logs show

Serving function...
Function: sampleFunction
URL: http://localhost:8080/

Didn't realize that if you just run that, it will also request the fav icon. but explicitly setting the path as the function in your call it will avoid the favicon call.

[Didier68]

Hello, I have the same problem, but I do not understand the answers speaking the link with favicon: in the second call, I find in "req.url" the same path as in the first call.
This bug becomes annoying as soon as I dedug the Node server, because I'm juggling between 2 threads which do the same things in parallel.

Does anyone know how to block this in Chrome?

[leviross]

Im running into the same behavior that @Didier68 is. Chome and apparently Edge are requesting the same route 2 times in a row. The 2nd time, the request has a 'Referer' header that is the value of the route itself. So it looks like its just sending 2 requests one right after the other.

[leviross]

Try looking for an '' tag in your Html that is like malformed or something. That was the culprit in my case!! I had this: <img src="#" id="productImage" width="100" height="100" alt="adding cart image">. I commented this out and now Chrome makes only the 1 request!