Defer api calls until client has identifier for analytics
I'm trying to implement a solution to the following problem:
When a user loads my React application, for analytics purposes every request that goes to my api should be made with some identifying data, relating a specific user to each request. Once a user is signed in, this of course is easy. But I need to support non-signed in users.
The challenging part is when a user first loads the app and the initial api requests are made to load data. Even if I immediately do a call to the api to create an anonymous user and send back a token identifying that user, there are still some api calls that will reach the server without an identifier.
How can I ensure that only requests associated with a user are made?
One idea I've considered is
- On app load, send request to backend to get identifier (if user doesn't already have one loaded on client)
- Until identifier is received, defer all other calls. For example, if on home page load, there's a get request made to
https://my_api.com/home_page_items
, this request should be "paused" until the identifier is received on the client. Once identifier is received, any paused requests should be made.
I'm currently using custom middleware to catch and process all api requests made in the React app, so there is a central place I can act on requests. However, I'm not sure about how to and best practices for creating a queue of deferred api calls which should resume once some criterion is met (in this case, that the client has received a token).
Another idea I've thought about is a client-generated UUID that is created immediately on app load and used as an identifier on requests temporarily until the client receives a token from backend. Then later, the client-generated UUID can be associated with the user's account so that all requests made by the user can be associated with them.
This seems like something that other devs have tried to do in other projects. I'm just unsure about how to concretely implement it.
Any direction is appreciated!
reactjs react-redux client-server
add a comment |
I'm trying to implement a solution to the following problem:
When a user loads my React application, for analytics purposes every request that goes to my api should be made with some identifying data, relating a specific user to each request. Once a user is signed in, this of course is easy. But I need to support non-signed in users.
The challenging part is when a user first loads the app and the initial api requests are made to load data. Even if I immediately do a call to the api to create an anonymous user and send back a token identifying that user, there are still some api calls that will reach the server without an identifier.
How can I ensure that only requests associated with a user are made?
One idea I've considered is
- On app load, send request to backend to get identifier (if user doesn't already have one loaded on client)
- Until identifier is received, defer all other calls. For example, if on home page load, there's a get request made to
https://my_api.com/home_page_items
, this request should be "paused" until the identifier is received on the client. Once identifier is received, any paused requests should be made.
I'm currently using custom middleware to catch and process all api requests made in the React app, so there is a central place I can act on requests. However, I'm not sure about how to and best practices for creating a queue of deferred api calls which should resume once some criterion is met (in this case, that the client has received a token).
Another idea I've thought about is a client-generated UUID that is created immediately on app load and used as an identifier on requests temporarily until the client receives a token from backend. Then later, the client-generated UUID can be associated with the user's account so that all requests made by the user can be associated with them.
This seems like something that other devs have tried to do in other projects. I'm just unsure about how to concretely implement it.
Any direction is appreciated!
reactjs react-redux client-server
Client-generated UUID seems overall simpler. On the DB you can have a table associating client UUID with api identifier. You can start adding entries to the other tables with the UUID and then later add that row to the relationship table.
– stone
Nov 22 '18 at 0:30
add a comment |
I'm trying to implement a solution to the following problem:
When a user loads my React application, for analytics purposes every request that goes to my api should be made with some identifying data, relating a specific user to each request. Once a user is signed in, this of course is easy. But I need to support non-signed in users.
The challenging part is when a user first loads the app and the initial api requests are made to load data. Even if I immediately do a call to the api to create an anonymous user and send back a token identifying that user, there are still some api calls that will reach the server without an identifier.
How can I ensure that only requests associated with a user are made?
One idea I've considered is
- On app load, send request to backend to get identifier (if user doesn't already have one loaded on client)
- Until identifier is received, defer all other calls. For example, if on home page load, there's a get request made to
https://my_api.com/home_page_items
, this request should be "paused" until the identifier is received on the client. Once identifier is received, any paused requests should be made.
I'm currently using custom middleware to catch and process all api requests made in the React app, so there is a central place I can act on requests. However, I'm not sure about how to and best practices for creating a queue of deferred api calls which should resume once some criterion is met (in this case, that the client has received a token).
Another idea I've thought about is a client-generated UUID that is created immediately on app load and used as an identifier on requests temporarily until the client receives a token from backend. Then later, the client-generated UUID can be associated with the user's account so that all requests made by the user can be associated with them.
This seems like something that other devs have tried to do in other projects. I'm just unsure about how to concretely implement it.
Any direction is appreciated!
reactjs react-redux client-server
I'm trying to implement a solution to the following problem:
When a user loads my React application, for analytics purposes every request that goes to my api should be made with some identifying data, relating a specific user to each request. Once a user is signed in, this of course is easy. But I need to support non-signed in users.
The challenging part is when a user first loads the app and the initial api requests are made to load data. Even if I immediately do a call to the api to create an anonymous user and send back a token identifying that user, there are still some api calls that will reach the server without an identifier.
How can I ensure that only requests associated with a user are made?
One idea I've considered is
- On app load, send request to backend to get identifier (if user doesn't already have one loaded on client)
- Until identifier is received, defer all other calls. For example, if on home page load, there's a get request made to
https://my_api.com/home_page_items
, this request should be "paused" until the identifier is received on the client. Once identifier is received, any paused requests should be made.
I'm currently using custom middleware to catch and process all api requests made in the React app, so there is a central place I can act on requests. However, I'm not sure about how to and best practices for creating a queue of deferred api calls which should resume once some criterion is met (in this case, that the client has received a token).
Another idea I've thought about is a client-generated UUID that is created immediately on app load and used as an identifier on requests temporarily until the client receives a token from backend. Then later, the client-generated UUID can be associated with the user's account so that all requests made by the user can be associated with them.
This seems like something that other devs have tried to do in other projects. I'm just unsure about how to concretely implement it.
Any direction is appreciated!
reactjs react-redux client-server
reactjs react-redux client-server
asked Nov 22 '18 at 0:04
MurcielagoMurcielago
184111
184111
Client-generated UUID seems overall simpler. On the DB you can have a table associating client UUID with api identifier. You can start adding entries to the other tables with the UUID and then later add that row to the relationship table.
– stone
Nov 22 '18 at 0:30
add a comment |
Client-generated UUID seems overall simpler. On the DB you can have a table associating client UUID with api identifier. You can start adding entries to the other tables with the UUID and then later add that row to the relationship table.
– stone
Nov 22 '18 at 0:30
Client-generated UUID seems overall simpler. On the DB you can have a table associating client UUID with api identifier. You can start adding entries to the other tables with the UUID and then later add that row to the relationship table.
– stone
Nov 22 '18 at 0:30
Client-generated UUID seems overall simpler. On the DB you can have a table associating client UUID with api identifier. You can start adding entries to the other tables with the UUID and then later add that row to the relationship table.
– stone
Nov 22 '18 at 0:30
add a comment |
0
active
oldest
votes
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53422145%2fdefer-api-calls-until-client-has-identifier-for-analytics%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
0
active
oldest
votes
0
active
oldest
votes
active
oldest
votes
active
oldest
votes
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53422145%2fdefer-api-calls-until-client-has-identifier-for-analytics%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Client-generated UUID seems overall simpler. On the DB you can have a table associating client UUID with api identifier. You can start adding entries to the other tables with the UUID and then later add that row to the relationship table.
– stone
Nov 22 '18 at 0:30