We Keep Coding

How to redirect user to home page after login (JS, HTML)

i tried to create (my first) login page, i did communication between client and server with WebSocket in JS, it check credentials of user (Token that makes you login to page). Only thing that i can't figure out is how to redirect user to other page, with sure that, he will be logged into this account and to protect from not authorized users. (server -> (JS) nodemon, client -> JS, HTML, CSS)
I expect that someone will make this topic clear to me, and explain how to code it :)

I'm also new to js. but I thing the way you can do this
by using window.location.href = "homepage.html"
steps
create a homepage.html file
on successful login attempt redirect user to hompage.html file by window.location.href = "homepage.html"
on homepage load you will check if user's valid token is saved or not( or by whatever method you are authenticating a user)
if user is authenticated user then show him homepage's content otherwise redirect him ho login.html page.( will be used to prevent if user trys to access homepage.html directly by entering url in search bar)
I hope this answers your question. :)

window.location.href = "/";

Redirect to specific page after refreshing (oidc.js)

I am using .NET Core (+IdentityServer) backend along with the SPA React application.
Whenever I change the page inside my SPA application the url updates. (for example: / to /users).
The issue:
Whenever I refresh the page with F5 or want to go to the specific component connected to route using url only I get the following action inside my browser:
Basic state when pressing enter in the url: localhost:3000/users
After pressing enter: http://localhost:3000/signin-oidc#id_token=...
When the user is logged in the page redirects to the main url: localhost:3000/
So, basically I am always redirected from the current url to the main one.
How can I make the application redirect back to the localhost:3000/users on the refresh or url change using oidc-client in react?
What is the best practice to allow user to be able to refresh the page (or go to the specific url) keeping in mind that the user is already authorized?

If I understand you right and you are using the oidc-client-js library to implement Open Id Connect then my NodeJS Code Sample may be useful to you, and the Authenticator class in particular.
RESTORING THE PRE-REDIRECT LOCATION / DEEP LINKING
This is managed via code like this, which is also useful if the user has bookmarked a location within your app and needs to login first:
// Store the state when redirecting the page
await this._userManager.signinRedirect({
state: location.hash,
});
// Restore it afterwards - and remove tokens from the URL
const user = await this._userManager.signinRedirectCallback();
history.replaceState({}, document.title, user.state.hash);
RELOADING THE PAGE OR OPENING A NEW TAB
This is best managed via silent token renewal using the Authorization Server session cookie, so that there is no top level redirect.
await this._userManager.signinSilent();
RUNNING MY SAMPLE AGAINST YOUR SYSTEM
It may help you to have something to compare against, by running the sample against your own system, by changing the details in the SPA and API config files to point to Identity Server.

Firebase auth - Login and then redirect to app - How to fetch user

I have a react app that has login built into it, but have begun to break out the login/signup pages for architectural reasons.
The login is performed in a separate react app in a subdomain (https://login.mysite.com). After successful login the user gets redirected to the app (https://app.mysite.com). On logout the user gets redirected back to https://login.mysite.com again.
The redirect works as expected, but I cannot fetch the logged in user in my app (https://app.mysite.com). This causes an eternal redirect loop since the user is logged in at the login page, but not recognized as logged in at the app page.
Code from https://app.mysite.com
// app.mysite.com code
console.log(firebase.auth().currentUser) // This logs 'null'
firebase.auth().onAuthStateChanged((user) => {
console.log('user', user) // This logs 'null' - causing an eternal redirect loop
if(user){
// Render app here
}else{
const loginURI = 'https://login.mysite.com'
window.location.replace(loginURI)
}
})
Code from https://login.mysite.com
// login.mysite.com code
firebase.auth().onAuthStateChanged((user) => {
if (user) {
const appURI = 'https://app.mysite.com'
window.location.replace(appURI)
}
})
I guess the problem is that the logged in user cannot get fetched by the app?
The user is clearly logged in at https://login.mysite.com, but not at https://app.mysite.com.
How can I pass the logged in user from the login page to the app?
Kind regards /K

You can not use multiple domain for same authentication.
Each domain/subdomain have their own cookies and localstorage and those can't be shared with another domain.
For your case login subdomain can't able to share credentials (auth token) with your app domain.
I highly suggest you to move from subdomain to path
Like app.domain.com/login
If you still want this with subdomain look for this medium blog

How to authorise user for a web page in FB messenger, without logging in?

I am building a chat bot in FB messenger that saves user profile data, food and calorie consumption. I am using Node/Express/MongoDB for the backend and want the user to be able to open a personal dashboard page inside the chat with a link. So that URL would be something like www.myapp.com/:id where :id is a personal key.
The problem I have is how can only the user belonging to this page and data open this without having to login? Normally you would go to a website, login and be able to see the page, but this not a step I want in a chat bot. I want the user just to open the page in the chat, whether that is results in opening a browser tab or a native webview. Any advice on how I can achieve this?

To verify if the user on the page is the facebook user you intend the page to be for, add FB Messenger Extensions to the page.
When clicking a webview in your bot, Messenger extensions will be able to tell who they are logged in as, and allow you to do whatever you want with that info. In your case, checking if the userid matches the one passed by your bot in the url. There are many ways to check this, like splitting query strings, but I stuck with the example route in your question.
Use the following on your dashboard page. The below will check with FB who the logged in user is, and if it doesn't match the ID of the link they followed, deny them access with a redirect.
<script>
MessengerExtensions.getContext(<YOUR-APP-ID>,
function success(thread_context){
// User ID was successfully obtained.
var psid = thread_context.psid;
// Grab the user id from your url (assumes your url is /<USER_ID>)
var loc = window.location.pathname.replace(/^\/|\/$/g, '');
if (psid !=== loc) {
window.location.replace("http://YOUR_DOMAIN.com/error")
}
}, function error(err, errorMessage) {
// Error handling code
});
</script>
Docs on getting user id with Messenger Extensions

Try this:
Open Messenger, then open DevsConsole and go to Network tab. Now paste your link and click it. In the Network tab open the request details issued by the click. Under "Form Data" you should see this:
q:[{"user":<your_fb_id>,...
You can use this id to authenticate the user in your app - just couple it somehow with the authorized user in your app. This is just the first idea off the top of my head, it should be quite safe if you mix it e.g. with CORS security headers.

Make Facebook permission window modal

I'm using the standard code from Facebook JS SDK in order to get the permissions for an application (this is an example with email permission):
FB.login(function(response) {
if (!response.authResponse) {
//user refused to grant permissions, redirect to the 'index' page
window.location = "/";
}
}, {scope:"email"});
When the user tries to get into the application's page (the function above is on page load), the permission request window pops-up, but it can be moved or even put in icon, while the user can still view the page. Is there any mean that I can assign the permission request window as a modal one?

You can get the user to login using the getLoginUrl() function in the PHP SDK. This redirects the user to a complete Facebook Login page and then have it redirect back to your app once complete.
E.g. https://www.facebook.com/dialog/oauth?client_id={app_id}&redirect_uri={redirect_url}