# Web Server and SSR Frontend

A web server runs the necessary logic to communicate with the sgID server, and generates HTML pages to be sent to the user-agent / browser where it is rendered. The process of generating HTML pages on the server is also known as server-side rendering (SSR).

## Typical Flow

1. End user visits a website (generated by the web server) in their browser
2. Upon clicking on "Login with sgID", the web server generates an authentication URL and sends the authentication URL to the browser
3. The browser then redirects to the sgID authorization URL, where a QR code is rendered
4. The end user authorizes the transaction by scanning the QR code with their Singpass mobile app, and consents to share their data with the web server
5. Upon successful authorization, the sgID server sends the registered redirect / callback URL (associated with the web server) to the browser, which redirects to that URL
6. The web server receives the authorization code in the callback URL and exchanges it for an access token and ID token using its client ID and client secret
7. The web server then uses the access token to obtain the end user's data from the sgID server `userinfo` endpoint
8. The web server will then log the end user in and render the logged-in screen

## Complete Flow Diagram

<figure><img src="https://static.swimlanes.io/de579b3ddd41195dbfc2bf78519d0fc5.png" alt="A line diagram which shows the steps involved for wiring up a backend OIDC relying party to a server-side rendered frontend"><figcaption><p><a href="https://swimlanes.io/u/FNq7GlxD6">Web Server and SSR Frontend Flow Diagram</a></p></figcaption></figure>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.id.gov.sg/learn-the-basics/integration-patterns/web-server-and-ssr-frontend.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.