unable to request userinfo

[Aakashagr]

Hello,

Thank you for this amazing platform for user management. I am following the web application example (in FastAPI) and modified the last part of it in the following way. Briefly, I am redirecting my webpage to localhost:8000/protected, whenever the user clicks the login button and upon authentication, I am redirecting the URL to the welcome page of my app. As I am also interested in getting the user info, I thought of using requests.get function (in python) to get these details. However, data = requests.get(url = 'http://127.0.0.1:8000/userinfo') only returns the HTML code of the fief login page. Can you please let me know a better way to meet my desired objectives

Thanks,
Aakash

async def protected(user: FiefUserInfo = Depends(auth.current_user())):
 	return RedirectResponse('http://localhost:8550/welcome')

    # return HTMLResponse(
    #     f"<h1>You are authenticated. Your user email is {user}</h1>"
    # )

@app.get("/userinfo")
async def userinfo(user: FiefUserInfo = Depends(auth.current_user())):
	return user

[frankie567]

When you call this route:

@app.get("/userinfo")
async def userinfo(user: FiefUserInfo = Depends(auth.current_user())):
	return user

The server will expect you to provide a valid session cookie in the request. Otherwise, it'll automatically redirect you to the Fief auth page.

What is the nature of the app you are serving on localhost:8550? Is it a React app or something like that?

[frankie567]

Hmm, I see 🙂

So to be sure I understand. What is closer to what you're trying to build:

Server/frontend architecture ?

• A server built with FastAPI that'll read/write data and make computations
• A mobile app built with Flet to provider interface to the user. It'll make requests to the server depending on the user asks.

App-only ?

• You'll just have your mobile app and everything will be stored and computed on the user device

[Aakashagr]

I am building a front-end architecture. Since it is python based, I run my algorithms within the same script and display the output (audio/image from s3 bucket) to the user and collect their response (i.e. behaviour tasks)
For now, I store all my data in SQLite and plan to later migrate to Postgres.

[frankie567]

Ok, so I think your best bet is to perform authentication directly inside your application, without the FastAPI server. Fortunately, Flet seems to have a built-in mechanism for OAuth. It's very well explained here, you should read it carefully: https://flet.dev/docs/guides/python/authentication

I tried myself and it works quite well:

import flet as ft
from flet.auth.oauth_provider import OAuthProvider

provider = OAuthProvider(
    client_id="YOUR_CLIENT_ID",
    client_secret="YOUR_CLIENT_SECRET",
    authorization_endpoint="https://example.fief.dev/authorize",
    token_endpoint="https://example.fief.dev/api/token",
    redirect_url="http://localhost:8550/api/oauth/redirect",
    user_endpoint="https://example.fief.dev/api/userinfo",
    user_scopes=["openid", "offline_access"],
    user_id_fn=lambda u: u["sub"],
)


def main(page: ft.Page):
    def login_click(e):
        page.login(provider)

    def on_login(e):
        if e.error:
            raise Exception(e.error)
        print("User ID:", page.auth.user.id)
        print("Access token:", page.auth.token.access_token)
        toggle_login_buttons()

    def toggle_login_buttons():
        if page.auth is None:
            login_button.visible = True
            user_greeting.visible = False
        else:
            login_button.visible = False
            user_greeting.value = f"Hello, {page.auth.user['email']}!"
            user_greeting.visible = True
        page.update()

    page.on_login = on_login

    login_button = ft.ElevatedButton("Login with Fief", on_click=login_click)
    user_greeting = ft.Text("")
    page.add(login_button, user_greeting)


ft.app(target=main, port=8550)

The only drawback is that you manually have to provide Fief's URL, like https://example.fief.dev/authorize. Make sure to replace https://example.fief.dev with your own workspace domain.

[Aakashagr]

Thanks a lot for helping out with this. I was struggling a lot over the weekend to understand the authorization process.
While I went through the flet's authentication documentation, I assumed it is only possible to use this code for authentication with OAuth providers (I should have understood the basics first), as I could not find any option to enter a username and password.

I will add this discussion to Flet's discord channel and hopefully, more people like me could benefit from it

Thanks again,
Aakash

[frankie567]

Yeah, it's key to understand that Fief is a fully-compliant OAuth2/OpenID provider. So even though we do not have an official integration for a given library/framework, it's likely you'll find generic tools for OAuth that will work ;)

[Aakashagr]

Hi @frankie567, just a quick follow-up question. Does Fief automatically saves the auth token on client side?
Because, even if I do not save the auth token on client side as described here, it automatically logs in. Also, even when I sign out and log in again, I don't see the fief page to enter userid and password unless I clear the cookies (or open in incognito mode).

Thanks
Aakash

[frankie567]

Fief does not store token automatically on the client.

However, Fief server stores a user session on its side. It means that even if the token on your application is expired, you can redirect the user to Fief authentication page and they will be automatically redirected to your app with a fresh token without having to input their email/password. That's the experience you describe. This session lasts for 30 days.

If you want to fully logout the user, including the Fief server session, you need to redirect them to the Fief logout page. You can do this by redirecting the user to https://example.fief.dev/logout?redirect_uri=http://myapp.com

[Aakashagr]

Got it. Thanks a lot.