diff --git a/packages/console/src/assets/docs/fragments/_redirect_uris.mdx b/packages/console/src/assets/docs/fragments/_experience-overview.md similarity index 60% rename from packages/console/src/assets/docs/fragments/_redirect_uris.mdx rename to packages/console/src/assets/docs/fragments/_experience-overview.md index 24847fd39..df8616a98 100644 --- a/packages/console/src/assets/docs/fragments/_redirect_uris.mdx +++ b/packages/console/src/assets/docs/fragments/_experience-overview.md @@ -1,6 +1,3 @@ -import InlineNotification from '@/ds-components/InlineNotification'; -import UriInputField from '@/mdx-components/UriInputField'; - Before we dive into the details, here's a quick overview of the end-user experience. The sign-in process can be simplified as follows: ```mermaid @@ -21,15 +18,3 @@ Regarding redirect-based sign-in: To learn more about the rationale and benefits of redirect-based sign-in, see [Logto sign-in experience explained](https://docs.logto.io/docs/tutorials/get-started/sign-in-experience). --- - - - In the following steps, we assume your app is running on http://localhost:3000. - - -Now, let's enter your redirect URI. E.g. {`${props.callbackUri ?? 'http://localhost:3000/callback'}`}. - - - -Just like signing in, users should be redirected to Logto for signing out of the shared session. Once finished, it would be great to redirect the user back to your website. For example, add `http://localhost:3000` as the post sign-out redirect URI below. - - diff --git a/packages/console/src/assets/docs/fragments/_redirect-uris-native.mdx b/packages/console/src/assets/docs/fragments/_redirect-uris-native.mdx new file mode 100644 index 000000000..92cc9ad50 --- /dev/null +++ b/packages/console/src/assets/docs/fragments/_redirect-uris-native.mdx @@ -0,0 +1,10 @@ +import InlineNotification from '@/ds-components/InlineNotification'; +import UriInputField from '@/mdx-components/UriInputField'; + +import ExperienceOverview from './_experience-overview.md'; + + + +Now, let's configure your redirect URI. E.g. {`${props.defaultUri ?? 'http://localhost:3000/callback'}`}. + + diff --git a/packages/console/src/assets/docs/fragments/_redirect-uris-web.mdx b/packages/console/src/assets/docs/fragments/_redirect-uris-web.mdx new file mode 100644 index 000000000..60f310f2a --- /dev/null +++ b/packages/console/src/assets/docs/fragments/_redirect-uris-web.mdx @@ -0,0 +1,18 @@ +import InlineNotification from '@/ds-components/InlineNotification'; +import UriInputField from '@/mdx-components/UriInputField'; + +import ExperienceOverview from './_experience-overview.md'; + + + + + In the following steps, we assume your app is running on http://localhost:3000. + + +Now, let's configure your redirect URI. E.g. {`${props.defaultUri ?? 'http://localhost:3000/callback'}`}. + + + +Just like signing in, users should be redirected to Logto for signing out of the shared session. Once finished, it would be great to redirect the user back to your website. For example, add `http://localhost:3000` as the post sign-out redirect URI below. + + diff --git a/packages/console/src/assets/docs/guides/native-ios-swift/README.mdx b/packages/console/src/assets/docs/guides/native-ios-swift/README.mdx index 6bdfc3cef..3e1773e1d 100644 --- a/packages/console/src/assets/docs/guides/native-ios-swift/README.mdx +++ b/packages/console/src/assets/docs/guides/native-ios-swift/README.mdx @@ -4,6 +4,8 @@ import TabItem from '@mdx/components/TabItem'; import InlineNotification from '@/ds-components/InlineNotification'; import Steps from '@/mdx-components/Steps'; import Step from '@/mdx-components/Step'; +import Checkpoint from '../../fragments/_checkpoint.md'; +import RedirectUrisNative from '../../fragments/_redirect-uris-native.mdx'; @@ -44,6 +46,8 @@ CocoaPods [does not support local dependency](https://github.com/CocoaPods/Cocoa subtitle="1 step" > +You can initialize `LogtoClient` in a proper place of your app that can be accessed globally: + {`import Logto import LogtoClient @@ -68,50 +72,93 @@ let config = try? LogtoConfig( - + -### Configure Redirect URI - -First, let’s configure your redirect URI scheme. E.g. `io.logto://callback` - - + - The Redirect URI in iOS SDK is only for internal use. There's NO NEED to add a{' '} - - Custom URL Scheme - {' '} - until a connector asks. + The Redirect URI in iOS SDK is only for internal use. There's NO NEED to add a [Custom URL Scheme](https://developer.apple.com/documentation/xcode/defining-a-custom-url-scheme-for-your-app) until a connector asks. -Go back to Xcode, use the following code to implement sign-in: + - - {`do { - try await client.signInWithBrowser(redirectUri: "${ - props.redirectUris[0] ?? 'io.logto://callback' - }") - print(client.isAuthenticated) // true -} catch let error as LogtoClientErrors.SignIn { - // error occured during sign in + + +You can use `client.signInWithBrowser(redirectUri:)` to sign in the user and `client.signOut()` to sign out the user. + +For example, in a SwiftUI app: + + + {`struct ContentView: View { + @State var isAuthenticated: Bool + + init() { + isAuthenticated = client.isAuthenticated + } + + var body: some View { + VStack { + if isAuthenticated { + Button("Sign Out") { + Task { [self] in + await client.signOut() + isAuthenticated = false + } + } + } else { + Button("Sign In") { + Task { [self] in + do { + try await client.signInWithBrowser(redirectUri: "${ + props.redirectUris[0] ?? 'io.logto://callback' + }") + isAuthenticated = true + } catch let error as LogtoClientErrors.SignIn { + // error occured during sign in + } catch { + // other errors + } + } + } + } + } + } }`} - + -Calling `.signOut()` will clean all the Logto data in Keychain, if they exist. + -```swift -await client.signOut() -``` + + + + +To display the user's information, you can use the `client.getIdTokenClaims()` method. For example, in a SwiftUI app: + + + {`struct ContentView: View { + @State var isAuthenticated: Bool + @State var name: String? + + init() { + isAuthenticated = client.isAuthenticated + name = try? client.getIdTokenClaims().name + } + + var body: some View { + VStack { + if isAuthenticated { + Text("Welcome, \(name)") + } else { + Text("Please sign in") + } + } + } +}`} + diff --git a/packages/console/src/assets/docs/guides/native-ios-swift/index.ts b/packages/console/src/assets/docs/guides/native-ios-swift/index.ts index 3ded79500..51b991d59 100644 --- a/packages/console/src/assets/docs/guides/native-ios-swift/index.ts +++ b/packages/console/src/assets/docs/guides/native-ios-swift/index.ts @@ -10,6 +10,7 @@ const metadata: Readonly = Object.freeze({ repo: 'swift', path: 'Demos/SwiftUI%20Demo', }, + fullGuide: 'swift', }); export default metadata; diff --git a/packages/console/src/assets/docs/guides/web-next-app-router/README.mdx b/packages/console/src/assets/docs/guides/web-next-app-router/README.mdx index 2ed05e28e..a304b98b9 100644 --- a/packages/console/src/assets/docs/guides/web-next-app-router/README.mdx +++ b/packages/console/src/assets/docs/guides/web-next-app-router/README.mdx @@ -4,7 +4,7 @@ import { generateStandardSecret } from '@logto/shared/universal'; import Steps from '@/mdx-components/Steps'; import Step from '@/mdx-components/Step'; import Checkpoint from '../../fragments/_checkpoint.md'; -import RedirectUris from '../../fragments/_redirect_uris.mdx'; +import RedirectUrisWeb from '../../fragments/_redirect-uris-web.mdx'; @@ -84,7 +84,7 @@ export async function GET(request: NextRequest) { subtitle="2 URIs" > - + diff --git a/packages/console/src/assets/docs/guides/web-next/README.mdx b/packages/console/src/assets/docs/guides/web-next/README.mdx index e806cf5eb..c2f0a7fef 100644 --- a/packages/console/src/assets/docs/guides/web-next/README.mdx +++ b/packages/console/src/assets/docs/guides/web-next/README.mdx @@ -4,7 +4,7 @@ import { generateStandardSecret } from '@logto/shared/universal'; import Steps from '@/mdx-components/Steps'; import Step from '@/mdx-components/Step'; import Checkpoint from '../../fragments/_checkpoint.md'; -import RedirectUris from '../../fragments/_redirect_uris.mdx'; +import RedirectUrisWeb from '../../fragments/_redirect-uris-web.mdx'; @@ -85,7 +85,7 @@ This will create 4 routes automatically: subtitle="2 URIs" > - + diff --git a/packages/console/src/assets/docs/guides/web-nuxt/README.mdx b/packages/console/src/assets/docs/guides/web-nuxt/README.mdx index 70c8ee3ed..fd94a784f 100644 --- a/packages/console/src/assets/docs/guides/web-nuxt/README.mdx +++ b/packages/console/src/assets/docs/guides/web-nuxt/README.mdx @@ -5,7 +5,7 @@ import InlineNotification from '@/ds-components/InlineNotification'; import Steps from '@/mdx-components/Steps'; import Step from '@/mdx-components/Step'; import Checkpoint from '../../fragments/_checkpoint.md'; -import RedirectUris from '../../fragments/_redirect_uris.mdx'; +import RedirectUrisWeb from '../../fragments/_redirect-uris-web.mdx'; import { generateStandardSecret } from '@logto/shared/universal'; export const cookieEncryptionKey = generateStandardSecret(); @@ -84,7 +84,7 @@ See [runtime config](https://nuxt.com/docs/guide/going-further/runtime-config) f subtitle="2 URIs" > - + When registering `@logto/nuxt` module, it will do the following: diff --git a/packages/console/src/assets/docs/guides/web-ruby/README.mdx b/packages/console/src/assets/docs/guides/web-ruby/README.mdx index 22f9fedd9..63d9e9e54 100644 --- a/packages/console/src/assets/docs/guides/web-ruby/README.mdx +++ b/packages/console/src/assets/docs/guides/web-ruby/README.mdx @@ -1,7 +1,7 @@ import UriInputField from '@/mdx-components/UriInputField'; import InlineNotification from '@/ds-components/InlineNotification'; import { generateStandardSecret } from '@logto/shared/universal'; -import RedirectUris from '../../fragments/_redirect_uris.mdx'; +import RedirectUrisWeb from '../../fragments/_redirect-uris-web.mdx'; import Checkpoint from '../../fragments/_checkpoint.md'; import Steps from '@/mdx-components/Steps'; import Step from '@/mdx-components/Step'; @@ -82,7 +82,7 @@ end`} subtitle="2 URIs" > - + diff --git a/packages/console/src/assets/docs/guides/web-ruby/index.ts b/packages/console/src/assets/docs/guides/web-ruby/index.ts index 37b0f04ef..dbb70b695 100644 --- a/packages/console/src/assets/docs/guides/web-ruby/index.ts +++ b/packages/console/src/assets/docs/guides/web-ruby/index.ts @@ -12,6 +12,7 @@ const metadata: Readonly = Object.freeze({ repo: 'ruby', path: 'logto-sample', }, + fullGuide: 'ruby', }); export default metadata;