Terjemahan disediakan oleh mesin penerjemah. Jika konten terjemahan yang diberikan bertentangan dengan versi bahasa Inggris aslinya, utamakan versi bahasa Inggris.
# Login terkelola kumpulan pengguna
Anda dapat memilih domain web untuk meng-host layanan untuk kumpulan pengguna Anda. *Kumpulan pengguna Amazon Cognito mendapatkan fungsi berikut saat Anda menambahkan domain, yang secara kolektif disebut sebagai login terkelola.*
+ [Server otorisasi](https://datatracker.ietf.org/doc/html/rfc6749#section-1.1) yang bertindak sebagai penyedia identitas (IDP) untuk aplikasi yang bekerja OAuth dengan 2.0 dan OpenID Connect (OIDC). Server otorisasi [merutekan permintaan](authorization-endpoint.md), [masalah, dan mengelola token web JSON (JWTs)](token-endpoint.md), dan [memberikan informasi atribut pengguna](userinfo-endpoint.md).
+ Antarmuka ready-to-use pengguna (UI) untuk operasi otentikasi seperti login, keluar, dan manajemen kata sandi. *Halaman login terkelola* bertindak sebagai front end web untuk layanan otentikasi.
+ Penyedia layanan (SP), atau pihak yang mengandalkan (RP), ke SAMP 2.0 IdPs, OIDC, Facebook IdPs, Login with Amazon, Masuk dengan Apple, dan Google.
Opsi tambahan yang berbagi beberapa fitur dengan login terkelola adalah *UI host* klasik. UI yang dihosting klasik adalah versi generasi pertama dari layanan login terkelola. Layanan IDP dan RP UI yang di-host umumnya memiliki karakteristik yang sama dengan login terkelola, tetapi halaman login memiliki desain yang lebih sederhana dan fitur yang lebih sedikit. Misalnya, login kunci sandi tidak tersedia di UI klasik yang dihosting. Dalam [paket fitur](cognito-sign-in-feature-plans.md) Lite, UI yang dihosting klasik adalah satu-satunya pilihan Anda untuk layanan domain kumpulan pengguna.
Halaman login terkelola adalah kumpulan antarmuka web untuk pendaftaran dasar, masuk, otentikasi multi-faktor, dan aktivitas pengaturan ulang kata sandi di kumpulan pengguna Anda. Mereka juga menghubungkan pengguna ke satu atau beberapa penyedia identitas pihak ketiga (IdPs) saat Anda ingin memberi pengguna pilihan opsi masuk. Aplikasi Anda dapat memanggil halaman login terkelola di browser pengguna saat Anda ingin mengautentikasi dan mengotorisasi pengguna.
Anda dapat membuat pengalaman pengguna login terkelola sesuai dengan merek Anda dengan logo, latar belakang, dan gaya khusus. Anda memiliki dua opsi untuk branding yang mungkin Anda terapkan ke UI login terkelola: *editor branding* untuk login terkelola, dan pencitraan *merek UI (klasik) yang dihosting* untuk UI yang dihosting.
**Editor branding**
Pengalaman pengguna yang diperbarui dengan opsi up-to-date otentikasi terbanyak dan editor visual di konsol Amazon Cognito.
**Pencitraan merek UI yang di-host**
Pengalaman pengguna yang akrab bagi pengadopsi kumpulan pengguna Amazon Cognito sebelumnya. Branding untuk UI yang dihosting adalah sistem berbasis file. Untuk menerapkan branding ke halaman UI yang dihosting, Anda mengunggah file gambar logo dan file yang menetapkan nilai untuk beberapa opsi gaya CSS yang telah ditentukan sebelumnya.
Editor branding tidak tersedia di semua paket fitur untuk kumpulan pengguna. Untuk informasi selengkapnya, lihat [Paket fitur kumpulan pengguna](cognito-sign-in-feature-plans.md).
Untuk informasi selengkapnya tentang membuat permintaan untuk login terkelola dan layanan UI yang dihosting, lihat[Titik akhir kumpulan pengguna dan referensi login terkelola](cognito-userpools-server-contract-reference.md).
**catatan**
Login terkelola Amazon Cognito tidak mendukung otentikasi khusus dengan [tantangan otentikasi khusus](user-pool-lambda-challenge.md) yang memicu Lambda.
**Topics**
+ [Pelokalan proses masuk terkelola](#managed-login-localization)
+ [Dokumen persyaratan](#managed-login-terms-documents)
+ [Menyiapkan login terkelola dengan AWS Amplify](#cognito-user-pools-app-integration-amplify)
+ [Menyiapkan login terkelola dengan konsol Amazon Cognito](#set-up-managed-login)
+ [Melihat halaman masuk](#view-login-pages)
+ [Menyesuaikan halaman otentikasi](#cognito-user-pools-app-integration-customize-hosted-ui)
+ [Hal-hal yang perlu diketahui tentang login terkelola dan UI yang dihosting](#managed-login-things-to-know)
+ [Mengkonfigurasi domain kumpulan pengguna](cognito-user-pools-assign-domain.md)
+ [Terapkan branding ke halaman login terkelola](managed-login-branding.md)
## Pelokalan proses masuk terkelola
Login terkelola default ke bahasa Inggris di halaman interaktif pengguna. Anda dapat menampilkan halaman login terkelola yang dilokalkan untuk bahasa pilihan Anda. Bahasa yang tersedia adalah yang tersedia di Konsol Manajemen AWS. Di tautan yang Anda distribusikan ke pengguna, tambahkan parameter `lang` kueri, seperti yang ditunjukkan pada contoh berikut.
```
https:///oauth2/authorize?lang=es&response_type=code&client_id=&redirect_uri=
```
Amazon Cognito menetapkan cookie di browser pengguna dengan preferensi bahasa mereka setelah permintaan awal dengan parameter. `lang` Setelah cookie diatur, pemilihan bahasa tetap ada tanpa menampilkan atau mengharuskan Anda untuk memasukkan parameter dalam permintaan. Misalnya, setelah pengguna membuat permintaan masuk dengan `lang=de` parameter, halaman login terkelola akan ditampilkan dalam bahasa Jerman hingga mereka menghapus cookie mereka atau membuat permintaan baru dengan parameter pelokalan baru seperti. `lang=en`
Lokalisasi hanya tersedia untuk login terkelola. Anda harus berada di [paket fitur](cognito-sign-in-feature-plans.md) Essentials atau Plus dan telah menetapkan domain Anda untuk menggunakan branding [login terkelola](managed-login-branding.md).
Pilihan yang dibuat pengguna Anda dalam login terkelola tidak tersedia untuk [email kustom atau pemicu pengirim SMS](user-pool-lambda-custom-sender-triggers.md). Saat Anda menerapkan pemicu ini, Anda harus menggunakan mekanisme lain untuk menentukan bahasa pilihan pengguna. Dalam alur masuk, `locale` atribut mungkin menunjukkan bahasa pilihan pengguna berdasarkan lokasi. Dalam alur pendaftaran, ID klien wilayah atau aplikasi dari kumpulan pengguna Anda mungkin menunjukkan preferensi bahasa.
Bahasa-bahasa berikut tersedia.
**Bahasa login terkelola**
| Bahasa | Kode |
| --- | --- |
| Bahasa Jerman | de |
| Bahasa Inggris | id |
| Bahasa Spanyol | es |
| Prancis | fr |
| Bahasa Indonesia | id |
| Bahasa Italia | ia |
| Bahasa Jepang | ya |
| Bahasa Korea | ko |
| Bahasa Portugis (Brasil) | Pt-BR |
| Mandarin (Sederhana) | Zh-CN |
| Mandarin (Tradisional) | Zh-TW |
## Dokumen persyaratan
Anda dapat mengonfigurasi halaman login terkelola untuk menampilkan tautan ke **Syarat Penggunaan** dan dokumen **kebijakan privasi** Anda saat pengguna mendaftar. Saat Anda menyiapkan kedua dokumen persyaratan di klien aplikasi Anda, pengguna melihat teks berikut saat mendaftar: **Dengan mendaftar, Anda menyetujui Ketentuan Penggunaan dan Kebijakan Privasi kami**. Frasa **Ketentuan penggunaan** dan **Kebijakan privasi** muncul di halaman login terkelola Anda, hyperlink ke dokumen Anda.
Dokumen persyaratan mendukung bahasa khusus URLs yang selaras dengan lokalisasi login terkelola. Saat pengguna memilih bahasa dengan parameter `lang` kueri, Amazon Cognito menampilkan tautan ke dokumen istilah Anda dalam bahasa tersebut. Jika Anda belum mengonfigurasi URL untuk bahasa tertentu, Amazon Cognito menggunakan URL default yang dikonfigurasi untuk klien aplikasi.
Untuk mengonfigurasi dokumen istilah untuk klien aplikasi Anda, navigasikan ke menu **Login terkelola** di kumpulan pengguna Anda. Di bawah **dokumen Ketentuan**, pilih **Buat dokumen persyaratan**.
------
#### [ Amazon Cognito console ]
**Untuk membuat dokumen istilah**
1. Arahkan ke kumpulan pengguna Anda dan pilih menu **Login terkelola**. Temukan **dokumen Ketentuan**.
1. Pilih **Buat dokumen istilah**.
1. Pilih klien aplikasi yang ingin Anda tetapkan dokumen persyaratan.
1. Masukkan **nama Ketentuan**. Ini mengidentifikasi dokumen Anda di konsol.
1. Di bawah **Tautan**, pilih **Bahasa** dan masukkan **URL** tempat Anda meng-host dokumen istilah Anda dalam bahasa tersebut.
1. URLs Untuk menambahkan bahasa tambahan, pilih **Tambahkan yang lain**.
1. Pilih **Buat**.
------
#### [ Amazon Cognito user pools API ]
Berikut ini adalah contoh badan [CreateTerms](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_CreateTerms.html)permintaan. Ini menyebabkan halaman pendaftaran untuk klien aplikasi merender tautan `1example23456789` untuk bahasa Prancis dan versi bahasa Portugis (Brasil) dari kebijakan privasi ketika login terkelola dilokalkan ke bahasa itu. Permintaan terpisah diperlukan URLs untuk disetel `terms-of-use` sebelum login terkelola akan membuat tautan di halaman pendaftaran.
```
{
"ClientId": "1example23456789",
"Enforcement": "NONE",
"Links": {
"cognito:default" : "https://example.com/privacy/",
"cognito:french" : "https://example.com/fr/privacy/",
"cognito:portuguese-brazil" : "https://example.com/pt/privacy/"
},
"TermsName": "privacy-policy",
"TermsSource": "LINK",
"UserPoolId": "us-east-1_EXAMPLE"
}
```
------
**catatan**
Anda harus membuat persyaratan penggunaan dan dokumen kebijakan privasi untuk klien aplikasi Anda sebelum Amazon Cognito akan menampilkan dokumen persyaratan di halaman login terkelola Anda.
## Menyiapkan login terkelola dengan AWS Amplify
Jika Anda menggunakan AWS Amplify untuk menambahkan otentikasi ke web atau aplikasi seluler, Anda dapat mengatur halaman login terkelola di antarmuka baris perintah Amplify (CLI) dan pustaka dalam kerangka Amplify. Untuk menambahkan autentikasi ke aplikasi Anda, tambahkan `Auth` kategori ke project Anda. Kemudian, di aplikasi Anda, autentikasi pengguna pool pengguna dengan pustaka klien Amplify.
Anda dapat memanggil halaman login terkelola untuk otentikasi atau Anda dapat menggabungkan pengguna melalui titik akhir otorisasi yang mengalihkan ke IDP. Setelah pengguna berhasil melakukan autentikasi dengan penyedia, Amplify membuat pengguna baru di kumpulan pengguna Anda dan meneruskan token pengguna ke aplikasi Anda.
Contoh berikut menunjukkan cara menggunakan AWS Amplify untuk menyiapkan login terkelola dengan penyedia sosial di aplikasi Anda.
+ [Bereaksi](https://docs.amplify.aws/react/build-a-backend/auth/concepts/external-identity-providers/)
+ [Swift](https://docs.amplify.aws/swift/build-a-backend/auth/concepts/external-identity-providers/)
+ [Bergetar](https://docs.amplify.aws/flutter/build-a-backend/auth/concepts/external-identity-providers/)
+ [Android](https://docs.amplify.aws/android/build-a-backend/auth/concepts/external-identity-providers/)
## Menyiapkan login terkelola dengan konsol Amazon Cognito
Persyaratan pertama untuk login terkelola dan UI yang dihosting adalah domain kumpulan pengguna. Di konsol kumpulan pengguna, navigasikan ke tab **Domain** dari kumpulan pengguna Anda dan tambahkan domain **Cognito atau domain** **khusus**. Anda juga dapat memilih domain selama proses pembuatan kumpulan pengguna baru. Untuk informasi selengkapnya, lihat [Mengkonfigurasi domain kumpulan pengguna](cognito-user-pools-assign-domain.md). Saat domain aktif di kumpulan pengguna Anda, semua klien aplikasi menyajikan halaman autentikasi publik di domain tersebut.
Saat membuat atau memodifikasi domain kumpulan pengguna, Anda menetapkan **versi Branding** untuk domain Anda. Versi branding ini adalah pilihan **Login Terkelola** atau **UI yang Dihosting (klasik)**. Versi branding pilihan Anda berlaku untuk semua klien aplikasi yang menggunakan layanan login di domain Anda.
Langkah selanjutnya adalah membuat [klien aplikasi dari tab Klien](user-pool-settings-client-apps.md) **aplikasi** di kumpulan pengguna Anda. Dalam proses membuat klien aplikasi, Amazon Cognito akan menanyakan informasi tentang aplikasi Anda, lalu meminta Anda untuk memilih URL **Pengembalian**. URL pengembalian juga disebut URL relying party (RP), URI redirect, dan URL callback. Ini adalah URL tempat aplikasi Anda berjalan dari, misalnya `https://www.example.com` atau`myapp://example`.
Setelah Anda mengonfigurasi klien domain dan aplikasi dengan gaya branding di kumpulan pengguna Anda, halaman login terkelola Anda akan tersedia di internet.
## Melihat halaman masuk
Di konsol Amazon Cognito, pilih tombol **Lihat halaman login** di tab **Halaman login** untuk klien aplikasi Anda di bawah menu Klien **aplikasi**. Tombol ini membawa Anda ke halaman login di domain kumpulan pengguna Anda dengan parameter dasar berikut.
+ Id klien aplikasi
+ Permintaan hibah kode otorisasi
+ Permintaan untuk semua cakupan yang telah Anda aktifkan untuk klien aplikasi saat ini
+ URL callback pertama dalam daftar untuk klien aplikasi saat ini
Tombol **Lihat halaman login** berguna ketika Anda ingin menguji fungsi dasar halaman login terkelola Anda. Halaman login Anda akan cocok dengan **versi Branding** yang Anda tetapkan ke [domain kumpulan pengguna](cognito-user-pools-assign-domain.md) Anda. Anda dapat menyesuaikan URL masuk Anda dengan parameter tambahan dan modifikasi. Dalam kebanyakan kasus, parameter yang dibuat secara otomatis dari link **halaman login View** tidak sepenuhnya sesuai dengan kebutuhan aplikasi Anda. Dalam kasus ini, Anda harus menyesuaikan URL yang dipanggil aplikasi saat masuk ke pengguna. Untuk informasi selengkapnya tentang kunci dan nilai parameter masuk, lihat[Titik akhir kumpulan pengguna dan referensi login terkelola](cognito-userpools-server-contract-reference.md).
Halaman web login menggunakan format URL berikut. Contoh ini meminta hibah kode otorisasi dengan `response_type=code` parameter.
```
https:///oauth2/authorize?response_type=code&client_id=&redirect_uri=
```
Anda dapat mencari string domain pool pengguna Anda dari menu **Domain** di kolam pengguna Anda. Di menu **Klien aplikasi**, Anda dapat mengidentifikasi klien aplikasi IDs, panggilan balik mereka URLs, cakupan yang diizinkan, dan konfigurasi lainnya.
Saat Anda menavigasi ke `/oauth2/authorize` titik akhir dengan parameter kustom Anda, Amazon Cognito mengarahkan Anda ke `/oauth2/login` titik akhir atau, jika Anda memiliki `identity_provider` parameter `idp_identifier` atau, secara diam-diam mengarahkan Anda ke halaman masuk IDP Anda.
**Contoh permintaan untuk hibah implisit**
Anda dapat melihat halaman web login Anda dengan URL berikut untuk pemberian kode implisit di mana. `response_type=token` Setelah berhasil masuk, Amazon Cognito mengembalikan token kolam pengguna ke bilah alamat browser web Anda.
```
https://mydomain.auth.us-east-1.amazoncognito.com/authorize?response_type=token&client_id=1example23456789&redirect_uri=https://mydomain.example.com
```
Identitas dan token akses muncul sebagai parameter yang ditambahkan ke URL pengalihan Anda.
Berikut ini adalah contoh respons dari permintaan hibah implisit.
```
https://auth.example.com/#id_token=eyJraaBcDeF1234567890&access_token=eyJraGhIjKlM1112131415&expires_in=3600&token_type=Bearer
```
## Menyesuaikan halaman otentikasi
Di masa lalu, Amazon Cognito hanya meng-host halaman login dengan *UI host* klasik, desain sederhana yang memberikan tampilan universal ke halaman web otentikasi. Anda dapat menyesuaikan kumpulan pengguna Amazon Cognito dengan gambar logo dan mengubah beberapa gaya dengan file yang menentukan beberapa nilai gaya CSS. Kemudian, Amazon Cognito memperkenalkan *login terkelola*, layanan otentikasi host yang diperbarui. Login terkelola diperbarui look-and-feel dengan *editor branding*. Editor branding adalah editor visual tanpa kode dan rangkaian opsi yang lebih besar daripada pengalaman kustomisasi UI yang dihosting. Login terkelola juga memperkenalkan gambar latar belakang kustom dan tema mode gelap.
Anda dapat beralih antara login terkelola dan pengalaman pencitraan merek UI yang dihosting di kumpulan pengguna. Untuk mempelajari lebih lanjut tentang menyesuaikan halaman login terkelola Anda, lihat[Terapkan branding ke halaman login terkelola](managed-login-branding.md).
## Hal-hal yang perlu diketahui tentang login terkelola dan UI yang dihosting
**Login terkelola satu jam dan cookie sesi UI yang dihosting**
Saat pengguna masuk dengan halaman login Anda atau penyedia pihak ketiga, Amazon Cognito menetapkan cookie di browser mereka. Dengan cookie ini, pengguna dapat masuk lagi dengan metode otentikasi yang sama selama satu jam. Ketika mereka masuk dengan cookie browser mereka, mereka mendapatkan token baru yang bertahan selama durasi yang ditentukan dalam konfigurasi klien aplikasi Anda. Perubahan pada atribut pengguna atau faktor otentikasi tidak berpengaruh pada kemampuan mereka untuk masuk lagi dengan cookie browser mereka.
Otentikasi dengan cookie sesi tidak mengatur ulang durasi cookie ke jam tambahan. Pengguna harus masuk lagi jika mereka mencoba mengakses halaman login Anda lebih dari satu jam setelah otentikasi interaktif terbaru mereka berhasil.
**Mengonfirmasi akun pengguna dan memverifikasi atribut pengguna**
Untuk pengguna [lokal kumpulan pengguna](cognito-terms.md#terms-localuser), login terkelola dan UI yang dihosting berfungsi paling baik saat Anda mengonfigurasi kumpulan pengguna agar **Izinkan Cognito mengirim pesan secara otomatis untuk memverifikasi dan** mengonfirmasi. Saat Anda mengaktifkan pengaturan ini, Amazon Cognito mengirimkan pesan dengan kode konfirmasi kepada pengguna yang mendaftar. Saat Anda mengonfirmasi pengguna sebagai administrator kumpulan pengguna, halaman login Anda menampilkan pesan kesalahan setelah mendaftar. Dalam keadaan ini, Amazon Cognito telah membuat pengguna baru, tetapi belum dapat mengirim pesan verifikasi. Anda masih dapat mengonfirmasi pengguna sebagai administrator, tetapi mereka mungkin menghubungi meja dukungan Anda setelah mereka menemukan kesalahan. Untuk informasi selengkapnya tentang konfirmasi administratif, lihat[Memungkinkan pengguna untuk mendaftar di aplikasi Anda tetapi mengonfirmasinya sebagai administrator kumpulan pengguna](signing-up-users-in-your-app.md#signing-up-users-in-your-app-and-confirming-them-as-admin).
**Lingkup operasi login terkelola**
Login terkelola dan UI yang dihosting klasik mendukung pendaftaran, masuk, dan manajemen kata sandi. Ini termasuk menyelesaikan proses masuk dengan otentikasi multi-faktor (MFA) dan pendaftaran autentikator WebAuthn. Login terkelola tidak mendukung manajemen profil layanan mandiri pengguna seperti perubahan atribut dan pengaturan preferensi MFA. Anda harus menerapkan manajemen profil dalam kode aplikasi Anda sendiri. Login terkelola juga tidak menyediakan kapasitas untuk mengonfirmasi perubahan atribut saat Anda memperbarui alamat email dan nomor telepon sebagai administrator dengan operasi [AdminUpdateUserAttributes](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_AdminUpdateUserAttributes.html)API.
**Melihat perubahan Anda pada konfigurasi**
Jika Anda membuat perubahan gaya pada halaman Anda dan mereka tidak segera muncul, tunggu beberapa menit dan kemudian refresh halaman.
**Menguraikan token kumpulan pengguna**
Token kumpulan pengguna Amazon Cognito ditandatangani menggunakan RS256 algoritme. Anda dapat memecahkan kode dan memverifikasi token kumpulan pengguna menggunakan AWS Lambda. Lihat [Mendekode dan memverifikasi token Amazon Cognito JWT](https://github.com/awslabs/aws-support-tools/tree/master/Cognito/decode-verify-jwt) pada. GitHub
**Versi TLS**
Login terkelola dan halaman UI yang dihosting memerlukan enkripsi saat transit. Domain kumpulan pengguna yang disediakan oleh Amazon Cognito mengharuskan browser pengguna menegosiasikan versi TLS minimum 1.2. Domain khusus mendukung koneksi browser dengan TLS versi 1.2. UI yang dihosting (klasik) **tidak memerlukan** TLS 1.2 untuk domain khusus, tetapi login terkelola yang lebih baru **memerlukan** TLS versi 1.2 baik untuk domain kustom maupun awalan. Karena Amazon Cognito mengelola konfigurasi layanan domain Anda, Anda tidak dapat mengubah persyaratan TLS domain kumpulan pengguna Anda.
**Kebijakan CORS**
Baik login terkelola maupun UI yang dihosting tidak mendukung kebijakan asal berbagi sumber daya lintas asal (CORS) kustom. Kebijakan CORS akan mencegah pengguna meneruskan parameter otentikasi dalam permintaan mereka. Sebagai gantinya, terapkan kebijakan CORS di front end aplikasi Anda. Amazon Cognito mengembalikan header `Access-Control-Allow-Origin: *` respons ke permintaan ke titik akhir berikut.
1. [Titik akhir token](token-endpoint.md)
1. [Cabut titik akhir](revocation-endpoint.md)
1. [Titik akhir UserInfo](userinfo-endpoint.md)
**Cookie**
Login terkelola dan UI yang dihosting mengatur cookie di browser pengguna. Cookie sesuai dengan persyaratan beberapa browser bahwa situs tidak menetapkan cookie pihak ketiga. Mereka hanya dicakup ke titik akhir kumpulan pengguna Anda dan termasuk yang berikut ini:
+ `XSRF-TOKEN`Cookie untuk setiap permintaan.
+ `csrf-state`Cookie untuk konsistensi sesi saat pengguna dialihkan.
+ `csrf-state-legacy`Cookie untuk konsistensi sesi, dibaca oleh Amazon Cognito sebagai fallback ketika browser Anda tidak memiliki dukungan untuk atribut tersebut. `SameSite`
+ Cookie `cognito` sesi yang mempertahankan upaya masuk yang berhasil selama satu jam.
+ `lang`Cookie yang mempertahankan pilihan [pelokalan bahasa](#managed-login-localization) pengguna dalam login terkelola.
+ `page-data`Cookie yang mempertahankan data yang diperlukan saat pengguna menavigasi di antara halaman login terkelola.
Di iOS, Anda dapat [memblokir semua cookie](https://support.apple.com/en-us/105082). Pengaturan ini tidak kompatibel dengan login terkelola atau UI yang dihosting. Untuk bekerja dengan pengguna yang mungkin mengaktifkan setelan ini, buat autentikasi kumpulan pengguna ke dalam aplikasi iOS asli dengan AWS SDK. Dalam skenario ini, Anda dapat membangun penyimpanan sesi Anda sendiri yang tidak berbasis cookie.
**Efek perubahan versi login terkelola**
Pertimbangkan efek berikut dari penambahan domain dan pengaturan versi login terkelola.
+ Saat Anda menambahkan domain awalan, baik dengan login terkelola atau pencitraan merek UI (klasik) yang dihosting, diperlukan waktu hingga 60 detik sebelum halaman login Anda tersedia.
+ Saat Anda menambahkan domain khusus, baik dengan login terkelola atau branding UI (klasik) yang dihosting, diperlukan waktu hingga lima menit sebelum halaman login Anda tersedia.
+ Ketika Anda mengubah versi branding untuk domain Anda, itu bisa memakan waktu hingga empat menit sebelum halaman login Anda tersedia dalam versi branding baru.
+ Saat Anda beralih antara login terkelola dan pencitraan merek UI (klasik) yang dihosting, Amazon Cognito tidak mempertahankan sesi pengguna. Mereka harus masuk lagi dengan antarmuka baru.
**Gaya default**
Saat Anda membuat klien aplikasi di Konsol Manajemen AWS, Amazon Cognito secara otomatis menetapkan gaya branding ke klien aplikasi Anda. Saat Anda membuat klien aplikasi secara terprogram dengan [CreateUserPoolClient](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_CreateUserPoolClient.html)operasi, tidak ada gaya branding yang dibuat. Login terkelola tidak tersedia untuk klien aplikasi yang dibuat dengan AWS SDK hingga Anda membuatnya dengan [CreateManagedLoginBranding](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_CreateManagedLoginBranding.html)permintaan.
**Waktu prompt otentikasi login terkelola habis**
Amazon Cognito membatalkan permintaan otentikasi yang tidak selesai dalam waktu lima menit, dan mengarahkan pengguna ke login terkelola. Halaman menampilkan pesan `Something went wrong` kesalahan.
# Mengkonfigurasi domain kumpulan pengguna
Mengkonfigurasi domain adalah bagian opsional dari pengaturan kumpulan pengguna. Domain kumpulan pengguna menghosting fitur untuk otentikasi pengguna, federasi dengan penyedia pihak ketiga, dan aliran OpenID Connect (OIDC). Ini telah *mengelola login*, antarmuka bawaan untuk operasi utama seperti mendaftar, masuk, dan pemulihan kata sandi. Ini juga menjadi tuan rumah titik akhir OpenID Connect (OIDC) standar seperti otorisasi[, [UserInfo](userinfo-endpoint.md), dan [token](token-endpoint.md),](authorization-endpoint.md) untuk otorisasi machine-to-machine (M2M) dan aliran otentikasi dan otorisasi OIDC dan 2.0 lainnya. OAuth
Pengguna mengautentikasi dengan halaman login terkelola di domain yang terkait dengan kumpulan pengguna Anda. Anda memiliki dua opsi untuk mengonfigurasi domain ini: Anda dapat menggunakan domain host Amazon Cognito default, atau Anda dapat mengonfigurasi domain khusus yang Anda miliki.
Opsi domain khusus memiliki lebih banyak opsi untuk fleksibilitas, keamanan, dan kontrol. Misalnya, domain milik organisasi yang akrab dapat mendorong kepercayaan pengguna dan membuat proses masuk lebih intuitif. Namun, pendekatan domain kustom memerlukan beberapa overhead tambahan, seperti mengelola sertifikat SSL dan konfigurasi DNS.
Titik akhir penemuan OIDC, `/.well-known/openid-configuration` untuk titik akhir URLs dan `/.well-known/jwks.json` untuk kunci penandatanganan token, tidak di-host di domain Anda. Untuk informasi selengkapnya, lihat [Penyedia identitas dan titik akhir pihak yang mengandalkan](federation-endpoints.md).
Memahami cara mengonfigurasi dan mengelola domain untuk kumpulan pengguna Anda merupakan langkah penting dalam mengintegrasikan otentikasi ke dalam aplikasi Anda. Masuk dengan API kumpulan pengguna dan AWS SDK dapat menjadi alternatif untuk mengonfigurasi domain. Model berbasis API memberikan token secara langsung dalam respons API, tetapi untuk implementasi yang menggunakan kemampuan kumpulan pengguna yang diperluas sebagai IDP OIDC, Anda harus mengonfigurasi domain. Untuk informasi selengkapnya tentang model otentikasi yang tersedia di kumpulan pengguna, lihat[Memahami API, OIDC, dan otentikasi halaman login terkelola](authentication-flows-public-server-side.md#user-pools-API-operations).
**Topics**
+ [Hal-hal yang perlu diketahui tentang domain kumpulan pengguna](#cognito-user-pools-assign-domain-things-to-know)
+ [Menggunakan domain awalan Amazon Cognito untuk login terkelola](cognito-user-pools-assign-domain-prefix.md)
+ [Menggunakan domain Anda sendiri untuk login terkelola](cognito-user-pools-add-custom-domain.md)
## Hal-hal yang perlu diketahui tentang domain kumpulan pengguna
Domain kumpulan pengguna adalah titik layanan untuk pihak yang mengandalkan OIDC dalam aplikasi Anda dan untuk elemen UI. Pertimbangkan detail berikut saat merencanakan implementasi domain untuk kumpulan pengguna.
**Ketentuan yang dipesan**
Anda tidak dapat menggunakan teks`aws`,`amazon`, atau `cognito` atas nama domain awalan Amazon Cognito.
**Endpoint Discovery berada di domain yang berbeda**
[Titik akhir penemuan](federation-endpoints.md) kumpulan pengguna `.well-known/openid-configuration` dan `.well-known/jwks.json` tidak ada di domain kustom atau awalan kumpulan pengguna Anda. Jalan menuju titik akhir ini adalah sebagai berikut.
+ `https://cognito-idp.Region.amazonaws.com/your user pool ID/.well-known/openid-configuration`
+ `https://cognito-idp.Region.amazonaws.com/your user pool ID/.well-known/jwks.json`
**Waktu efektif perubahan domain**
Amazon Cognito membutuhkan waktu hingga satu menit untuk meluncurkan atau memperbarui versi branding domain awalan. Perubahan pada domain kustom dapat memakan waktu hingga lima menit untuk disebarkan. Domain kustom baru dapat memakan waktu hingga satu jam untuk disebarkan.
**Domain kustom dan awalan pada saat yang sama**
Anda dapat mengatur kumpulan pengguna dengan domain kustom dan domain awalan yang dimiliki oleh AWS. Karena [titik akhir penemuan](federation-endpoints.md) kumpulan pengguna di-host di domain yang berbeda, mereka hanya melayani *domain khusus*. Misalnya, Anda `openid-configuration` akan memberikan nilai tunggal untuk `"authorization_endpoint"` of`"https://auth.example.com/oauth2/authorize"`.
Jika Anda memiliki domain kustom dan awalan di kumpulan pengguna, Anda dapat menggunakan domain kustom dengan fitur lengkap penyedia OIDC. Domain awalan dalam kumpulan pengguna dengan konfigurasi ini tidak memiliki penemuan atau token-signing-key titik akhir dan harus digunakan sesuai dengan itu.
**Domain kustom lebih disukai sebagai ID pihak yang mengandalkan untuk kunci sandi**
Saat Anda mengatur otentikasi kumpulan pengguna dengan [kunci sandi](amazon-cognito-user-pools-authentication-flow-methods.md#amazon-cognito-user-pools-authentication-flow-methods-passkey), Anda harus menetapkan ID pihak yang bergantung (RP). Bila Anda memiliki domain kustom dan domain awalan, Anda dapat mengatur ID RP hanya sebagai domain kustom Anda. **Untuk menetapkan domain awalan sebagai ID RP di konsol Amazon Cognito, hapus domain kustom Anda atau masukkan nama domain yang sepenuhnya memenuhi syarat (FQDN) dari domain awalan sebagai domain Pihak Ketiga.**
**Jangan gunakan domain khusus pada tingkat hierarki domain yang berbeda**
*Anda dapat mengonfigurasi kumpulan pengguna terpisah agar memiliki domain khusus di domain tingkat atas (TLD) yang sama, misalnya *auth.example.com dan auth2.example.com*.* *Cookie sesi login terkelola berlaku untuk domain khusus dan semua subdomain, misalnya \$1.auth.example.com.* Karena itu, tidak ada pengguna aplikasi Anda yang boleh mengakses login terkelola untuk domain *dan* subdomain induk apa pun. Jika domain kustom menggunakan TLD yang sama, pertahankan pada tingkat subdomain yang sama.
Katakanlah Anda memiliki kumpulan pengguna dengan domain kustom *auth.example.com*. Kemudian Anda membuat kumpulan pengguna lain dan menetapkan domain kustom *uk.auth.example.com*. . Pengguna masuk dengan *auth.example.com*. dan mendapatkan cookie yang disajikan browser mereka ke situs web mana pun di jalur wildcard *\$1.auth.example.com*. Mereka kemudian mencoba masuk ke *uk.auth.example.com*. . Mereka meneruskan cookie yang tidak valid ke domain kumpulan pengguna Anda dan menerima kesalahan alih-alih prompt masuk. *Sebaliknya, pengguna dengan cookie untuk *\$1.auth.example.com tidak memiliki masalah dalam memulai sesi masuk di auth2.example.com*.*
**Versi branding**
Saat membuat domain, Anda menetapkan **versi Branding**. Pilihan Anda adalah pengalaman login terkelola yang lebih baru dan pengalaman UI yang dihosting klasik. Pilihan ini berlaku untuk semua klien aplikasi yang meng-host layanan di domain Anda.
# Menggunakan domain awalan Amazon Cognito untuk login terkelola
Pengalaman default untuk login terkelola dihosting di domain yang AWS dimiliki. Pendekatan ini memiliki hambatan rendah untuk masuk — pilih nama awalan dan aktif — tetapi tidak memiliki fitur yang menginspirasi kepercayaan dari domain khusus. Tidak ada perbedaan biaya antara opsi domain Amazon Cognito dan opsi domain khusus. Satu-satunya perbedaan adalah domain di alamat web tempat Anda mengarahkan pengguna Anda. Untuk kasus pengalihan iDP pihak ketiga dan alur kredensional klien, domain yang dihosting memiliki sedikit efek yang terlihat. Domain kustom lebih baik untuk kasus di mana pengguna Anda masuk dengan login terkelola dan akan berinteraksi dengan domain otentikasi yang tidak cocok dengan domain aplikasi.
Domain Amazon Cognito yang dihosting memiliki awalan pilihan Anda, tetapi di-host di domain root. `amazoncognito.com` Berikut ini adalah contohnya:
```
https://cognitoexample.auth.ap-south-1.amazoncognito.com
```
Semua domain awalan mengikuti format ini:. `prefix` `auth`. *`Wilayah AWS code`*. `amazoncognito`. `com`. Kumpulan pengguna [domain khusus](cognito-user-pools-add-custom-domain.md) dapat meng-host login terkelola atau halaman UI yang dihosting di domain apa pun yang Anda miliki.
**catatan**
Untuk meningkatkan keamanan aplikasi Amazon Cognito Anda, domain induk dari titik akhir kumpulan pengguna terdaftar di Daftar [Akhiran Publik](https://publicsuffix.org/) (PSL). PSL membantu browser web pengguna Anda membangun pemahaman yang konsisten tentang titik akhir kumpulan pengguna Anda dan cookie yang mereka tetapkan.
Domain induk kumpulan pengguna mengambil format berikut.
```
auth.Region.amazoncognito.com
auth-fips.Region.amazoncognito.com
```
Untuk menambahkan klien aplikasi dan domain kumpulan pengguna dengan domain Konsol Manajemen AWS, lihat[Membuat klien aplikasi](user-pool-settings-client-apps.md#cognito-user-pools-app-idp-settings-console-create).
**Topics**
+ [Prasyarat](#cognito-user-pools-assign-domain-prefix-prereq)
+ [Konfigurasikan awalan domain Amazon Cognito](#cognito-user-pools-assign-domain-prefix-step-1)
+ [Verifikasi halaman login](#cognito-user-pools-assign-domain-prefix-verify)
## Prasyarat
Sebelum memulai, Anda memerlukan:
+ Kolam pengguna dengan klien aplikasi. Untuk informasi selengkapnya, lihat [Memulai dengan kumpulan pengguna](getting-started-user-pools.md).
## Konfigurasikan awalan domain Amazon Cognito
Anda dapat menggunakan salah satu Konsol Manajemen AWS atau AWS CLI atau API untuk mengonfigurasi domain kumpulan pengguna.
------
#### [ Amazon Cognito console ]
**Mengkonfigurasi domain**
1. Arahkan ke menu **Domain** di bawah **Branding**.
1. Di sebelah **Domain**, pilih **Tindakan** dan pilih **Buat domain Cognito**. Jika Anda telah mengonfigurasi domain awalan kumpulan pengguna, pilih **Hapus domain Cognito** sebelum membuat domain kustom baru Anda.
1. Masukkan awalan domain yang tersedia untuk digunakan dengan domain **Amazon Cognito**. Untuk informasi tentang cara menyiapkan **domain Kustom**, lihat[Menggunakan domain Anda sendiri untuk login terkelola](cognito-user-pools-add-custom-domain.md).
1. Pilih **versi Branding**. Versi branding Anda berlaku untuk semua halaman interaktif pengguna di domain tersebut. Kumpulan pengguna Anda dapat meng-host login terkelola atau pencitraan merek UI yang dihosting untuk semua klien aplikasi.
**catatan**
*Anda dapat memiliki domain khusus dan domain awalan, tetapi Amazon Cognito hanya melayani titik akhir untuk domain `/.well-known/openid-configuration` kustom.*
1. Pilih **Buat**.
------
#### [ CLI/API ]
Gunakan perintah berikut untuk membuat prefiks domain dan menetapkannya ke kolam pengguna Anda.
**Cara mengkonfigurasi domain kolam pengguna**
+ AWS CLI: `aws cognito-idp create-user-pool-domain`
**Contoh:** `aws cognito-idp create-user-pool-domain --user-pool-id --domain --managed-login-version 2`
+ Operasi API kumpulan pengguna: [CreateUserPoolDomain](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_CreateUserPoolDomain.html)
**Cara mendapatkan informasi tentang domain**
+ AWS CLI: `aws cognito-idp describe-user-pool-domain`
**Contoh:** `aws cognito-idp describe-user-pool-domain --domain `
+ Operasi API kumpulan pengguna: [DescribeUserPoolDomain](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_DescribeUserPoolDomain.html)
**Cara menghapus domain**
+ AWS CLI: `aws cognito-idp delete-user-pool-domain`
**Contoh:** `aws cognito-idp delete-user-pool-domain --domain `
+ Operasi API kumpulan pengguna: [DeleteUserPoolDomain](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_DeleteUserPoolDomain.html)
------
## Verifikasi halaman login
+ Verifikasi bahwa halaman masuk tersedia dari domain yang di-hosting Amazon Cognito Anda.
```
https:///login?response_type=code&client_id=&redirect_uri=
```
Domain Anda ditampilkan di halaman **Nama Domain** pada konsol Amazon Cognito. ID klien aplikasi dan URL callback Anda ditampilkan di halaman **Pengaturan klien aplikasi**.
# Menggunakan domain Anda sendiri untuk login terkelola
Setelah menyiapkan klien aplikasi, Anda dapat mengonfigurasi kumpulan pengguna dengan domain khusus untuk layanan domain [login terkelola](cognito-user-pools-managed-login.md). Dengan domain kustom, pengguna dapat masuk ke aplikasi Anda menggunakan alamat web Anda sendiri, bukan [domain `amazoncognito.com` awalan](cognito-user-pools-assign-domain-prefix.md) default. Domain khusus meningkatkan kepercayaan pengguna pada aplikasi Anda dengan nama domain yang sudah dikenal, terutama ketika domain root cocok dengan domain yang menghosting aplikasi Anda. Domain khusus dapat meningkatkan kepatuhan terhadap persyaratan keamanan organisasi.
Domain kustom memiliki beberapa prasyarat, termasuk kumpulan pengguna, klien aplikasi, dan domain web yang Anda miliki. Domain kustom juga memerlukan sertifikat SSL untuk domain kustom, dikelola dengan AWS Certificate Manager (ACM) di AS Timur (Virginia N.). Amazon Cognito membuat CloudFront distribusi Amazon, diamankan saat transit dengan sertifikat ACM Anda. Karena Anda memiliki domain, Anda harus membuat catatan DNS yang mengarahkan lalu lintas ke CloudFront distribusi untuk domain kustom Anda.
Setelah elemen-elemen ini siap, Anda dapat menambahkan domain kustom ke kumpulan pengguna Anda melalui konsol Amazon Cognito atau API. Ini melibatkan menentukan nama domain dan sertifikat SSL, dan kemudian memperbarui konfigurasi DNS Anda dengan target alias yang disediakan. Setelah melakukan perubahan ini, Anda dapat memverifikasi bahwa halaman masuk dapat diakses di domain khusus Anda.
Cara paling rendah untuk membuat domain kustom adalah dengan zona yang dihosting publik di Amazon Route 53. Konsol Amazon Cognito dapat membuat catatan DNS yang tepat dalam beberapa langkah. Sebelum memulai, pertimbangkan untuk [membuat zona host Route 53](https://docs.aws.amazon.com/Route53/latest/DeveloperGuide/CreatingHostedZone.html) untuk domain atau subdomain yang Anda miliki.
**Topics**
+ [Menambahkan domain kustom ke kumpulan pengguna](#cognito-user-pools-add-custom-domain-adding)
+ [Prasyarat](#cognito-user-pools-add-custom-domain-prereq)
+ [Langkah 1: Masukkan nama domain kustom Anda](#cognito-user-pools-add-custom-domain-console-step-1)
+ [Langkah 2: Tambahkan target alias dan subdomain](#cognito-user-pools-add-custom-domain-console-step-2)
+ [Langkah 3: Verifikasi halaman masuk Anda](#cognito-user-pools-add-custom-domain-console-step-3)
+ [Mengubah sertifikat SSL untuk domain kustom Anda](#cognito-user-pools-add-custom-domain-changing-certificate)
## Menambahkan domain kustom ke kumpulan pengguna
Untuk menambahkan domain kustom ke kolam pengguna, tentukan nama domain di konsol Amazon Cognito, dan berikan sertifikat yang dikelola dengan [AWS Certificate Manager](https://docs.aws.amazon.com/acm/latest/userguide/) (ACM). Setelah menambahkan domain, Amazon Cognito menyediakan target alias, yang ditambahkan ke konfigurasi DNS.
## Prasyarat
Sebelum memulai, Anda memerlukan:
+ Kolam pengguna dengan klien aplikasi. Untuk informasi selengkapnya, lihat [Memulai dengan kumpulan pengguna](getting-started-user-pools.md).
+ Domain web yang Anda miliki. *Domain induknya* harus memiliki **catatan DNS A yang** valid. Anda dapat menetapkan nilai apa pun ke catatan ini. Induk mungkin akar domain, atau domain anak yang merupakan satu langkah ke atas dalam hierarki domain. *Misalnya, jika domain kustom Anda adalah *auth.xyz.example.com*, Amazon Cognito harus dapat menyelesaikan xyz.example.com ke alamat IP.* Untuk mencegah dampak tidak disengaja pada infrastruktur pelanggan, Amazon Cognito tidak mendukung penggunaan domain tingkat atas TLDs () untuk domain kustom. Untuk informasi selengkapnya lihat [Nama Domain](https://tools.ietf.org/html/rfc1035).
+ Kemampuan untuk membuat subdomain untuk domain kustom Anda. Kami merekomendasikan **auth** untuk nama subdomain Anda. Sebagai contoh: *auth.example.com*.
**catatan**
Jika Anda tidak memiliki [sertifikat wildcard](https://en.wikipedia.org/wiki/Wildcard_certificate), Anda harus mendapatkan sertifikat baru untuk subdomain domain kustom Anda.
+ SSL/TLS Sertifikat publik yang dikelola oleh ACM di US East (Virginia N.) Sertifikat harus di us-east-1 karena sertifikat akan dikaitkan dengan distribusi CloudFront di, layanan global.
+ Klien browser yang mendukung Server Name Indication (SNI). CloudFrontDistribusi yang ditetapkan Amazon Cognito ke domain khusus memerlukan SNI. Anda dapat mengubah pengaturan ini. Untuk informasi selengkapnya tentang SNI dalam CloudFront distribusi, lihat [Menggunakan SNI untuk menayangkan permintaan HTTPS di Panduan](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/cnames-https-dedicated-ip-or-sni.html#cnames-https-sni) Pengembang *Amazon CloudFront *.
+ Aplikasi yang memungkinkan server otorisasi kumpulan pengguna Anda untuk menambahkan cookie ke sesi pengguna. Amazon Cognito menetapkan beberapa cookie yang diperlukan untuk halaman login terkelola. Ini termasuk`cognito`,`cognito-fl`, dan`XSRF-TOKEN`. Meskipun setiap cookie individu sesuai dengan batas ukuran browser, perubahan pada konfigurasi kumpulan pengguna Anda dapat menyebabkan cookie login terkelola bertambah besar. Layanan perantara seperti Application Load Balancer (ALB) di depan domain kustom Anda dapat menerapkan ukuran header maksimum atau ukuran cookie total. Jika aplikasi Anda juga menetapkan cookie sendiri, sesi pengguna Anda mungkin melebihi batas ini. Kami menyarankan agar, untuk menghindari konflik batas ukuran, aplikasi Anda tidak menetapkan cookie pada subdomain yang menghosting layanan domain kumpulan pengguna Anda.
+ Izin untuk memperbarui CloudFront distribusi Amazon. Anda dapat melakukannya dengan melampirkan pernyataan kebijakan IAM berikut kepada pengguna di: Akun AWS
------
#### [ JSON ]
****
```
{
"Version":"2012-10-17",
"Statement": [
{
"Sid": "AllowCloudFrontUpdateDistribution",
"Effect": "Allow",
"Action": [
"cloudfront:updateDistribution"
],
"Resource": [
"*"
]
}
]
}
```
------
Untuk informasi selengkapnya tentang otorisasi tindakan CloudFront, lihat [Menggunakan Kebijakan Berbasis Identitas (Kebijakan IAM](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/access-control-managing-permissions.html)) untuk. CloudFront
Amazon Cognito awalnya menggunakan izin IAM Anda untuk mengonfigurasi CloudFront distribusi, tetapi distribusi dikelola oleh. AWS Anda tidak dapat mengubah konfigurasi CloudFront distribusi yang dikaitkan Amazon Cognito dengan kumpulan pengguna Anda. Misalnya, Anda tidak dapat memperbarui versi TLS yang didukung dalam kebijakan keamanan.
## Langkah 1: Masukkan nama domain kustom Anda
Anda dapat menambahkan domain ke kolam pengguna dengan menggunakan konsol Amazon Cognito atau API.
------
#### [ Amazon Cognito console ]
**Untuk menambahkan domain ke kumpulan pengguna dari konsol Amazon Cognito:**
1. Arahkan ke menu **Domain** di bawah **Branding**.
1. Di samping **Domain**, pilih **Tindakan** dan pilih **Buat domain khusus** atau **Buat domain Amazon Cognito**. Jika Anda telah mengonfigurasi domain kustom kumpulan pengguna, pilih **Hapus domain kustom** sebelum membuat domain kustom baru Anda.
1. Di sebelah **Domain**, pilih **Tindakan** dan pilih **Buat domain khusus**. Jika Anda telah mengonfigurasi domain kustom, pilih **Hapus domain khusus** untuk menghapus domain yang ada sebelum membuat domain kustom baru Anda.
1. Untuk **Domain kustom**, masukkan URL domain yang ingin Anda gunakan dengan Amazon Cognito. Nama domain Anda hanya dapat menyertakan huruf kecil, angka, dan tanda hubung. Jangan gunakan tanda hubung untuk karakter pertama atau terakhir. Gunakan titik untuk memisahkan nama subdomain.
1. Untuk **sertifikat ACM**, pilih sertifikat SSL yang ingin Anda gunakan untuk domain Anda. Hanya sertifikat ACM di US East (Virginia N.) yang memenuhi syarat untuk digunakan dengan domain khusus Amazon Cognito, terlepas dari kumpulan pengguna Wilayah AWS Anda.
Jika Anda tidak memiliki sertifikat yang tersedia, Anda dapat menggunakan ACM untuk menyediakannya di AS Timur (Virginia N.). Untuk informasi lebih lanjut, lihat [Memulai](https://docs.aws.amazon.com/acm/latest/userguide/gs.html) di *AWS Certificate Manager Panduan Pengguna*.
1. Pilih **versi Branding**. Versi branding Anda berlaku untuk semua halaman interaktif pengguna di domain tersebut. Kumpulan pengguna Anda dapat meng-host login terkelola atau pencitraan merek UI yang dihosting untuk semua klien aplikasi.
**catatan**
*Anda dapat memiliki domain khusus dan domain awalan, tetapi Amazon Cognito hanya melayani titik akhir untuk domain `/.well-known/openid-configuration` kustom.*
1. Pilih **Buat**.
1. Amazon Cognito mengembalikan Anda ke menu **Domain**. Pesan berjudul **Buat catatan alias di DNS domain Anda** ditampilkan. Catat **target **Domain** dan Alias** yang ditampilkan di konsol. Mereka akan digunakan pada langkah berikutnya untuk mengarahkan lalu lintas ke domain kustom Anda.
------
#### [ API ]
Badan [CreateUserPoolDomain](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_CreateUserPoolDomain.html)permintaan berikut membuat domain kustom.
```
{
"Domain": "auth.example.com",
"UserPoolId": "us-east-1_EXAMPLE",
"ManagedLoginVersion": 2,
"CustomDomainConfig": {
"CertificateArn": "arn:aws:acm:us-east-1:111122223333:certificate/a1b2c3d4-5678-90ab-cdef-EXAMPLE11111"
}
}
```
------
## Langkah 2: Tambahkan target alias dan subdomain
Pada langkah ini, Anda mengatur alias melalui penyedia layanan Domain Name Server (DNS) yang menunjuk kembali ke target alias dari langkah sebelumnya. Jika Anda menggunakan Amazon Route 53 untuk resolusi alamat DNS, pilih bagian **Untuk menambahkan target alias dan subdomain dengan menggunakan Route 53.**
### Cara menambahkan target alias dan subdomain ke konfigurasi DNS Anda saat ini
+ Jika Anda tidak menggunakan Route 53 untuk resolusi alamat DNS, maka Anda harus menggunakan alat konfigurasi penyedia layanan DNS Anda untuk menambahkan target alias dari langkah sebelumnya ke catatan DNS domain Anda. Penyedia DNS Anda juga perlu mengatur subdomain untuk domain kustom Anda.
### Cara menambahkan target alias dan subdomain yang menggunakan Route 53
1. Masuk ke [Konsol Route 53](https://console.aws.amazon.com/route53/). Jika diminta, masukkan AWS kredensyal Anda.
1. Jika Anda tidak memiliki zona yang dihosting publik di Route 53, buat zona dengan root yang merupakan induk dari domain khusus Anda. Untuk informasi selengkapnya, lihat [Membuat zona yang dihosting publik](https://docs.aws.amazon.com/Route53/latest/DeveloperGuide/CreatingHostedZone.html) di *Panduan Pengembang Amazon Route 53*.
1. Pilih **Buat Zona yang Di-hosting**.
1. Masukkan domain induk, misalnya*auth.example.com*, dari domain kustom Anda, misalnya*myapp.auth.example.com*, dari daftar **Nama Domain**.
1. Masukkan **Deskripsi** untuk zona host Anda.
1. Pilih zona yang dihosting **Jenis** zona yang **dihosting publik** untuk memungkinkan klien publik menyelesaikan domain kustom Anda. Memilih **Zona yang dihosting pribadi** tidak didukung.
1. Terapkan **Tag** sesuai keinginan.
1. Pilih **Buat zona yang di-hosting**.
**catatan**
Anda juga dapat membuat zona host baru untuk domain kustom Anda dengan set delegasi di zona host induk yang mengarahkan kueri ke zona host subdomain. Jika tidak, buat catatan A. Metode ini menawarkan lebih banyak fleksibilitas dan keamanan dengan zona yang dihosting Anda.Untuk informasi selengkapnya, lihat [Membuat subdomain untuk domain yang dihosting melalui Amazon](https://aws.amazon.com/premiumsupport/knowledge-center/create-subdomain-route-53/) Route 53.
1. Pada halaman **Zona yang Di-Hosting**, pilih nama zona yang di-hosting.
1. Tambahkan catatan DNS untuk domain induk domain kustom Anda, jika Anda belum memilikinya. Buat catatan DNS untuk domain induk dengan properti berikut:
+ **Rekam nama**: Biarkan kosong.
+ **Jenis rekaman**:`A`.
+ **Alias**: Jangan aktifkan.
+ **Nilai**: Masukkan target yang Anda pilih. Catatan ini harus menyelesaikan *sesuatu*, tetapi nilai catatan tidak masalah bagi Amazon Cognito.
+ **TTL**: Setel ke TTL pilihan Anda atau biarkan sebagai default.
+ **Kebijakan perutean**: Pilih **Perutean sederhana**.
1. Pilih **Create records** (Buat catatan). Berikut ini adalah contoh catatan untuk domain*example.com*:
`example.com. 60 IN A 198.51.100.1`
**catatan**
Amazon Cognito memverifikasi bahwa ada catatan DNS untuk domain induk domain kustom Anda untuk melindungi dari pembajakan domain produksi yang tidak disengaja. Jika Anda tidak memiliki catatan DNS untuk domain induk, Amazon Cognito akan menampilkan kesalahan saat Anda mencoba menyetel domain kustom. Catatan Start of Authority (SOA) bukanlah catatan DNS yang cukup untuk tujuan verifikasi domain induk.
1. Tambahkan catatan DNS lain untuk domain kustom Anda dengan properti berikut:
+ **Nama rekaman**: Awalan domain kustom Anda, misalnya `auth` untuk membuat catatan untuk`auth.example.com`.
+ **Jenis rekaman**:`A`.
+ **Alias**: Aktifkan.
+ **Rutekan lalu lintas ke**: Pilih **Alias ke distribusi Cloudfront**. Masukkan **target Alias** yang Anda rekam sebelumnya, misalnya`123example.cloudfront.net`.
+ **Kebijakan perutean**: Pilih **Perutean sederhana**.
1. Pilih **Create records** (Buat catatan).
**catatan**
Catatan baru Anda dapat memakan waktu sekitar 60 detik untuk disebarkan ke semua server DNS Route 53. Anda dapat menggunakan metode Route 53 [GetChange](https://docs.aws.amazon.com/Route53/latest/APIReference/API_GetChange.html)API untuk memverifikasi bahwa perubahan Anda telah disebarkan.
## Langkah 3: Verifikasi halaman masuk Anda
+ Verifikasi bahwa halaman masuk tersedia dari domain kustom Anda.
Masuk dengan domain dan subdomain kustom Anda dengan memasukkan alamat ini ke browser Anda. Ini adalah contoh URL domain kustom *example.com* dengan subdomain*auth*:
```
https://myapp.auth.example.com/login?response_type=code&client_id=&redirect_uri=
```
## Mengubah sertifikat SSL untuk domain kustom Anda
Bila diperlukan, Anda dapat menggunakan Amazon Cognito untuk mengubah sertifikat yang Anda terapkan ke domain kustom Anda.
Biasanya, ini tidak diperlukan setelah pembaruan sertifikat rutin dilakukan dengan ACM. Ketika Anda memperbarui sertifikat yang ada di ACM, ARN untuk sertifikat Anda tetap sama, dan domain kustom Anda menggunakan sertifikat baru secara otomatis.
Namun, jika Anda mengganti sertifikat yang sudah ada dengan yang baru, ACM memberikan ARN baru ke sertifikat baru. Untuk menerapkan sertifikat baru ke domain kustom Anda, Anda harus memberikan ARN ini ke Amazon Cognito.
Setelah Anda memberikan sertifikat baru, Amazon Cognito memerlukan waktu hingga 1 jam untuk mendistribusikannya ke domain kustom Anda.
**Sebelum Anda memulai**
Sebelum Anda dapat mengubah sertifikat Anda di Amazon Cognito, Anda harus menambahkan sertifikat Anda ke ACM. Untuk informasi lebih lanjut, lihat [Memulai](https://docs.aws.amazon.com/acm/latest/userguide/gs.html) di *AWS Certificate Manager Panduan Pengguna*.
Ketika Anda menambahkan sertifikat ke ACM, Anda harus memilih US East (N. Virginia) sebagai Wilayah AWS .
Anda dapat mengubah sertifikat dengan menggunakan konsol Amazon Cognito atau API.
------
#### [ Konsol Manajemen AWS ]
**Untuk memperbarui sertifikat dari konsol Amazon Cognito:**
1. Masuk ke Konsol Manajemen AWS dan buka konsol Amazon Cognito di. [https://console.aws.amazon.com/cognito/home](https://console.aws.amazon.com/cognito/home)
1. Pilih **Kolam Pengguna**.
1. Pilih kumpulan pengguna yang ingin Anda perbarui sertifikatnya.
1. Pilih menu **Domain**.
1. Pilih **Tindakan**, **Edit sertifikat ACM**.
1. Pilih sertifikat baru yang ingin Anda kaitkan dengan domain kustom Anda.
1. Pilih **Simpan perubahan**.
------
#### [ API ]
**Cara memperbarui sertifikat (API Amazon Cognito)**
+ Gunakan [UpdateUserPoolDomain](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_UpdateUserPoolDomain.html)tindakan.
------
# Terapkan branding ke halaman login terkelola
Anda mungkin ingin memberikan pengalaman pengguna yang konsisten antara layanan otentikasi dan aplikasi Anda. Anda dapat mencapai tujuan ini baik dengan formulir kustom dan operasi API back-end di AWS SDK, atau dengan login terkelola. Login terkelola dan UI host klasik adalah ujung depan web untuk komponen aplikasi Anda yang menyajikan otentikasi dengan kumpulan pengguna. Untuk menyinkronkan layanan otentikasi terkelola dengan UX aplikasi, Anda memiliki dua opsi penyesuaian: editor branding dan pencitraan merek UI yang dihosting. Anda dapat memilih pengalaman yang Anda inginkan di konsol Amazon Cognito dan dengan operasi API kumpulan pengguna.
**Editor branding**
[Editor branding](managed-login-brandingeditor.md) adalah opsi penyesuaian terbaru untuk pengalaman UI kumpulan pengguna terbaru, [login terkelola](cognito-user-pools-managed-login.md). Editor branding adalah editor visual tanpa kode untuk aset dan gaya login terkelola, dan satu set operasi API untuk konfigurasi terprogram dari sejumlah besar opsi konfigurasi. Kumpulan pengguna yang Anda konfigurasikan dengan [domain](cognito-user-pools-assign-domain.md) dan login terkelola secara otomatis membuat versi perancang merek dari halaman login Anda.
**Pencitraan merek UI (klasik) yang dihosting**
[Pengalaman pencitraan merek UI (klasik) yang dihosting](hosted-ui-classic-branding.md) memiliki dua opsi: untuk memodifikasi file stylesheet (CSS) cascading dengan serangkaian opsi gaya tetap, dan untuk menambahkan gambar logo khusus. Anda dapat mengatur opsi ini di konsol Amazon Cognito atau dengan operasi [Set UICustomization](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_SetUICustomization.html) API. Pada saat layanan diluncurkan, Amazon Cognito hanya memiliki opsi ini. Kumpulan pengguna yang Anda konfigurasikan dengan [domain](cognito-user-pools-assign-domain.md) dan versi pencitraan merek UI yang dihosting secara otomatis merender versi klasik halaman login Anda. [Paket fitur](cognito-sign-in-feature-plans.md) Anda mungkin juga hanya mendukung UI yang dihosting.
**catatan**
Editor branding dan pengalaman branding klasik memodifikasi properti visual dari layanan otentikasi host Anda. Saat ini, Anda tidak dapat mengubah teks yang ditampilkan di halaman login terkelola, kecuali untuk menerapkan pelokalan ke salah satu dari beberapa bahasa. Untuk informasi selengkapnya tentang lokalisasi, lihat[Pelokalan proses masuk terkelola](cognito-user-pools-managed-login.md#managed-login-localization).
## Pilih pengalaman branding dan tetapkan gaya
Di konsol Amazon Cognito, pengguna baru menggabungkan default ke pengalaman branding **login Terkelola**. Kumpulan pengguna yang Anda siapkan sebelum login terkelola tersedia akan memiliki branding **UI Hosted (klasik)**. Anda dapat beralih antara login terkelola dan pencitraan merek UI yang dihosting. Saat Anda mengubah **versi Branding**, Amazon Cognito segera menerapkan perubahan tersebut ke halaman interaktif pengguna domain kumpulan pengguna Anda. Dengan login terkelola dan UI yang dihosting, kumpulan pengguna Anda dapat memiliki gaya untuk setiap klien aplikasi.
Setiap klien aplikasi dapat memiliki *gaya* branding yang berbeda, tetapi domain kumpulan pengguna menyajikan login terkelola atau UI yang dihosting. Gaya adalah seperangkat pengaturan penyesuaian yang diterapkan ke klien aplikasi. Anda dapat mengatur satu [domain kustom](cognito-user-pools-add-custom-domain.md) dan satu [domain awalan](cognito-user-pools-assign-domain-prefix.md) per kumpulan pengguna. Anda dapat menetapkan versi branding yang berbeda ke domain kustom dan awalan Anda. *Namun, domain awalan tidak berfungsi penuh jika Anda juga memiliki domain kustom—titik akhir penemuan `.well-known` OIDC hanya menampilkan jalur domain khusus.* Anda hanya dapat menggunakan domain awalan untuk operasi yang tidak memerlukan endpoint discovery (`openid-configuration`) dalam kumpulan pengguna dengan konfigurasi ini. Karena properti kumpulan pengguna ini, Anda dapat secara efektif memilih satu versi branding per kumpulan pengguna.
Anda dapat menetapkan gaya ke klien aplikasi di kumpulan pengguna tempat domain disetel ke versi branding login terkelola. Gaya adalah seperangkat pengaturan visual yang terdiri dari file gambar, opsi tampilan, nilai CSS. Saat Anda menetapkan gaya ke klien aplikasi, Amazon Cognito segera mendorong pembaruan Anda ke halaman login interaktif pengguna Anda. Amazon Cognito membuat halaman interaktif pengguna Anda dengan versi branding pilihan Anda dan penyesuaian yang telah Anda terapkan padanya.
### Perbarui dan hapus gaya
Saat Anda membuat gaya, Anda menautkannya ke klien aplikasi. Untuk mengubah penetapan gaya klien aplikasi, Anda harus menghapus gaya aslinya terlebih dahulu. Saat ini, Anda tidak dapat menyalin pengaturan antar gaya. Anda harus melakukan ini secara terprogram. Untuk mereplikasi setelan antara gaya dan klien aplikasi, dapatkan pengaturan untuk gaya dengan operasi [DescribeManagedLoginBranding](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_DescribeManagedLoginBranding.html)API dan terapkan dengan [CreateManagedLoginBranding](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_CreateManagedLoginBranding.html)atau [UpdateManagedLoginBranding](https://docs.aws.amazon.com/). Anda tidak dapat mengubah gaya yang ditetapkan klien aplikasi—Anda hanya dapat menghapus yang asli dan menetapkan yang baru. Untuk informasi selengkapnya tentang mengelola gaya dengan operasi API dan SDK, lihat[Operasi API dan SDK untuk branding login terkelola](managed-login-brandingeditor.md#branding-designer-api).
**catatan**
Permintaan terprogram yang membuat atau memperbarui gaya branding harus memiliki ukuran permintaan tidak lebih dari 2 MB. Jika permintaan Anda lebih besar dari batas ini, pisahkan permintaan Anda menjadi beberapa `UpdateManagedLoginBranding` permintaan untuk grup parameter yang tidak melebihi ukuran permintaan maksimum. Permintaan ini tidak menghasilkan parameter yang tidak ditentukan disetel ke default, sehingga Anda dapat mengirim permintaan sebagian tanpa efek apa pun pada pengaturan yang ada.
Anda menghapus gaya di konsol Amazon Cognito dari menu **login Terkelola**. Di bawah **Gaya**, pilih gaya yang ingin Anda hapus dan pilih **Hapus gaya**.
Pada tingkat tinggi, proses penetapan merek ke domain terdiri dari langkah-langkah berikut.
1. [Buat domain dan atur versi branding](cognito-user-pools-assign-domain.md).
1. Buat gaya branding dan tetapkan ke klien aplikasi.
**Untuk menetapkan gaya ke klien aplikasi**
1. Di menu **Domain** kumpulan pengguna Anda, buat domain dan atur **versi Branding** ke **Login terkelola**.
1. Arahkan ke menu **Login Terkelola**. Di bawah **Gaya**, pilih **Buat gaya**.
1. Pilih klien aplikasi yang ingin Anda tetapkan gaya, atau buat [klien aplikasi](user-pool-settings-client-apps.md) baru.
1. Untuk mulai mengonfigurasi setelan branding Anda, pilih **Luncurkan editor branding**.
**Topics**
+ [Pilih pengalaman branding dan tetapkan gaya](#managed-login-branding-choose)
+ [Editor branding dan menyesuaikan login terkelola](managed-login-brandingeditor.md)
+ [Menyesuaikan pencitraan merek UI (klasik) yang dihosting](hosted-ui-classic-branding.md)
# Editor branding dan menyesuaikan login terkelola
Editor branding adalah desain visual dan alat pengeditan untuk halaman web login terkelola Anda. Itu dibangun ke konsol Amazon Cognito. Di editor branding, Anda mulai dengan pratinjau halaman login Anda dan dapat melanjutkan ke opsi pengaturan cepat atau tampilan terperinci dengan opsi lanjutan. Anda dapat memodifikasi dan melihat pratinjau parameter gaya atau menambahkan gambar latar belakang kustom dan logo. Anda dapat mengkonfigurasi mode terang dan mode gelap.
![\[Pratinjau editor visual editor merek untuk kumpulan pengguna Amazon Cognito.\]](http://docs.aws.amazon.com/id_id/cognito/latest/developerguide/images/hosted-ui-customization-editor-preview.png)
Untuk memulai, buat gaya yang dapat Anda terapkan ke kumpulan pengguna atau klien aplikasi.
**Untuk memulai dengan editor branding**
1. [Buat domain](cognito-user-pools-assign-domain.md) dari tab **Domain**, atau perbarui domain yang ada. Di bawah **versi Branding**, setel domain Anda untuk menggunakan **Login terkelola**.
1. Hapus gaya klien aplikasi yang ada, jika ada.
1. Di menu **Klien aplikasi**, pilih klien aplikasi Anda.
1. Di bawah **Gaya login terkelola**, pilih syle yang ditetapkan ke klien aplikasi Anda.
1. Pilih **Hapus gaya**. Konfirmasikan pilihan Anda.
1. Arahkan ke menu **Login terkelola** di kumpulan pengguna Anda. Jika Anda belum melakukannya, ikuti prompt untuk memilih [paket fitur](cognito-sign-in-feature-plans.md) yang menyertakan login terkelola. Anda juga dapat memilih **Pratinjau fitur ini** jika Anda ingin memeriksa editor merek tanpa membuat perubahan.
1. Di bawah **Gaya**, pilih **Buat gaya**.
1. Pilih klien aplikasi yang ingin Anda tetapkan gaya Anda dan pilih **Buat**. Anda juga dapat membuat klien aplikasi baru.
1. Konsol Amazon Cognito meluncurkan editor branding.
1. Pilih tab tempat Anda ingin mulai mengedit, atau pilih **Luncurkan editor** dan masukkan [pengaturan cepat](#branding-designer-quick-setup). Tab berikut tersedia:
**Pratinjau**
Lihat bagaimana pilihan Anda saat ini terlihat di halaman login terkelola Anda.
**Dasar**
Tetapkan tema keseluruhan, konfigurasikan tautan ke penyedia identitas eksternal, dan bidang formulir gaya.
**Komponen-komponen**
Konfigurasikan gaya untuk header, footer, dan elemen UI individual.
1. Untuk membuat pilihan tentang pengaturan awal, masukkan pengaturan cepat. Pilih **Ubah kategori pengaturan** dan pilih **Pengaturan cepat**. Saat Anda memilih **Lanjutkan**, editor branding akan diluncurkan dengan serangkaian opsi dasar untuk Anda konfigurasikan.
## Teks dan lokalisasi
Anda tidak dapat memodifikasi atau melokalkan teks di editor branding. Sebagai gantinya, tambahkan parameter `lang` kueri ke URL yang Anda distribusikan ke pengguna. Parameter ini menyebabkan halaman login terkelola Anda dilokalkan ke salah satu dari beberapa bahasa yang tersedia. Untuk informasi selengkapnya, lihat [Pelokalan proses masuk terkelola](cognito-user-pools-managed-login.md#managed-login-localization).
## Pengaturan cepat
Tombol **Launch branding editor** memuat editor visual untuk konfigurasi login terkelola Anda di mana Anda dapat memilih dari berbagai opsi penyesuaian utama. Saat Anda membuat pilihan, Amazon Cognito membuat perubahan login terkelola Anda di jendela pratinjau. Untuk kembali ke menu pengaturan terperinci, pilih tombol **Ubah kategori pengaturan**.
**Apa yang seharusnya menjadi tampilan dan nuansa keseluruhan?**
Konfigurasikan pengaturan tema dasar untuk login terkelola.
**Mode tampilan**
Pilih mode terang, mode gelap, atau pengalaman adaptif untuk login terkelola Anda. Pengaturan adaptif tergantung pada preferensi browser pengguna saat Amazon Cognito membuat login terkelola. Saat Anda memilih mode adaptif browser, Anda dapat memilih warna dan gambar logo yang berbeda untuk mode terang dan gelap.
**Jarak**
Atur spasi default antar elemen di halaman.
**Radius perbatasan**
Atur kedalaman pembulatan batas luar elemen.
**Bagaimana seharusnya tampilan latar belakang halaman?**
**Jenis latar belakang**
Kotak centang **Tampilkan gambar** menunjukkan apakah Anda menginginkan gambar latar belakang atau mengatur warna latar belakang yang solid.
1. Untuk menggunakan gambar, pilih **Tampilkan gambar** dan pilih gambar latar belakang untuk mode terang dan gelap. Anda juga dapat mengatur **warna latar belakang Halaman mode gelap dan mode terang untuk area latar belakang** yang tidak tercakup oleh gambar.
1. **Untuk hanya menggunakan warna untuk latar belakang, batal pilih **Tampilkan gambar** dan pilih mode terang dan warna latar belakang halaman mode gelap.**
**Bagaimana seharusnya bentuk terlihat?**
Konfigurasikan pengaturan untuk elemen formulir login terkelola. Contoh item formulir adalah login dan prompt kode.
**Penjajaran horisontal**
Atur keselarasan horizontal bidang formulir.
**Logo formulir**
Atur posisi gambar logo Anda.
**Gambar logo**
Pilih file gambar logo untuk disertakan dalam elemen formulir untuk mode terang dan gelap. Untuk mengunggah gambar, pilih dropdown **gambar Logo**, pilih **Tambahkan aset baru**, dan tambahkan file logo.
**Warna branding primer**
Atur warna tema untuk mode terang dan gelap. Warna ini akan diterapkan sebagai warna latar belakang untuk semua elemen yang diklasifikasikan sebagai primer.
**Bagaimana seharusnya header terlihat?**
Pilih apakah Anda ingin menyertakan header di halaman login terkelola Anda. Header dapat berisi gambar logo.
**Logo header**
Atur posisi gambar logo di header Anda.
**Gambar logo**
Pilih posisi logo dan file gambar logo untuk disertakan dalam header. Untuk mengunggah gambar, pilih dropdown **gambar Logo**, pilih **Tambahkan aset baru**, dan tambahkan file logo.
**Warna latar belakang header**
Atur warna mode terang dan gelap untuk latar belakang header.
## Pengaturan terperinci
Dalam tampilan pengaturan terperinci, Anda dapat memodifikasi komponen individual di **Foundation** dan **Components**. Tab **Pratinjau** menampilkan pratinjau login terkelola dalam konteks saat ini dengan penyesuaian Anda.
![\[Konsol Manajemen AWS Tangkapan layar konfigurasi terperinci komponen login terkelola.\]](http://docs.aws.amazon.com/id_id/cognito/latest/developerguide/images/hosted-ui-customization-console-preview.png)
Untuk memasukkan editor visual untuk komponen, pilih ikon edit di ubin untuk komponen. Dari editor studio tema, Anda dapat beralih antar komponen dengan tombol **Ubah kategori pengaturan**.
### Dasar
**Gaya aplikasi**
Konfigurasikan dasar-dasar konfigurasi login terkelola Anda. Kategori ini memiliki pengaturan untuk tema keseluruhan, spasi teks, dan header dan footer halaman.
**Mode tampilan**
Pilih mode terang, mode gelap, atau pengalaman adaptif untuk halaman login terkelola Anda. Saat Anda memilih mode adaptif browser, Anda dapat memilih warna dan gambar logo yang berbeda untuk mode terang dan gelap.
**Jarak**
Atur spasi default antar elemen di halaman.
**Perilaku otentikasi**
Konfigurasikan gaya untuk tombol yang menghubungkan pengguna Anda ke penyedia identitas eksternal (IdPs). Bagian ini mencakup opsi **Input pencarian domain** untuk mengelola pengguna prompt login untuk alamat email dan mencocokkannya dengan [pengenal penyedia identitas SALL](cognito-user-pools-managing-saml-idp-naming.md) mereka.
**Bentuk perilaku**
Konfigurasikan gaya untuk formulir input: pemosisian input, warna, dan penyelarasan elemen.
### Komponen-komponen
**Tombol**
Gaya untuk tombol yang dirender Amazon Cognito pada halaman login terkelola.
**Pembagi**
Gaya untuk garis pembagi dan batas antara elemen login terkelola seperti formulir input dan pemilih masuk penyedia eksternal.
**Dropdown**
Gaya untuk menu dropdown.
**Favicon**
Gaya untuk gambar yang disediakan Amazon Cognito untuk tab dan ikon bookmark.
**Cincin fokus**
Gaya untuk sorotan yang menunjukkan input yang dipilih saat ini.
**Bentuk wadah**
Gaya untuk elemen yang mengikat formulir.
**Footer global**
Gaya untuk footer yang ditampilkan Amazon Cognito di bagian bawah halaman login terkelola.
**Header global**
Gaya untuk header yang ditampilkan Amazon Cognito di bagian atas halaman login terkelola.
**Indikasi**
Gaya untuk pesan kesalahan dan kesuksesan.
**Kontrol opsi**
Gaya untuk kotak centang, multi-pilihan, dan permintaan input lainnya.
**Latar belakang halaman**
Gaya untuk latar belakang keseluruhan login terkelola.
**Masukan**
Gaya untuk prompt masukan bidang formulir.
**Tautan**
Gaya untuk hyperlink di halaman login terkelola.
**Teks untuk halaman**
Gaya untuk teks dalam halaman.
**Teks untuk bidang**
Gaya untuk teks di sekitar input formulir.
## Operasi API dan SDK untuk branding login terkelola
Anda juga dapat menerapkan branding ke gaya login terkelola dengan operasi API [CreateManagedLoginBranding](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_CreateManagedLoginBranding.html)dan [UpdateManagedLoginBranding](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_UpdateManagedLoginBranding.html). Operasi ini ideal untuk membuat versi gaya branding yang identik atau sedikit dimodifikasi untuk klien aplikasi atau kumpulan pengguna lain. Kueri branding login terkelola dari gaya yang ada dengan operasi API [DescribeManagedLoginBranding](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_DescribeManagedLoginBranding.html), lalu modifikasi output sesuai kebutuhan dan terapkan ke sumber daya lain.
`UpdateManagedLoginBranding`Operasi tidak mengubah klien aplikasi tempat gaya Anda diterapkan. Ini hanya memperbarui gaya yang ada yang ditetapkan ke klien aplikasi. Untuk sepenuhnya mengganti gaya untuk klien aplikasi, hapus gaya yang ada dengan [DeleteManagedLoginBranding](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_DeleteManagedLoginBranding.html)dan tetapkan gaya baru dengan`CreateManagedLoginBranding`. Di konsol Amazon Cognito, hal yang sama berlaku: Anda harus menghapus gaya yang ada dan membuat yang baru.
Menyiapkan branding login terkelola dalam permintaan API atau SDK mengharuskan pengaturan Anda disematkan dalam file JSON yang dikonversi ke tipe data. `Document` Berikut ini adalah panduan untuk gambar yang dapat Anda tambahkan dan untuk menghasilkan permintaan terprogram untuk mengonfigurasi gaya branding.
### Aset gambar
[CreateManagedLoginBranding](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_CreateManagedLoginBranding.html)dan [UpdateManagedLoginBranding](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_UpdateManagedLoginBranding.html)sertakan `Assets` parameter. Parameter ini adalah array file gambar dalam format biner berenkode base64.
**catatan**
Permintaan terprogram yang membuat atau memperbarui gaya branding harus memiliki ukuran permintaan tidak lebih dari 2 MB. Aset dalam permintaan Anda mungkin membuatnya melebihi batas ini. Jika demikian, pisahkan permintaan Anda menjadi beberapa `UpdateManagedLoginBranding` permintaan untuk grup parameter yang tidak melebihi ukuran permintaan maksimum. Permintaan ini tidak menghasilkan parameter yang tidak ditentukan disetel ke default, sehingga Anda dapat mengirim permintaan sebagian tanpa efek apa pun pada pengaturan yang ada.
Beberapa aset memiliki batasan pada tipe file yang dapat Anda kirimkan.
****
| Aset | Ekstensi file yang diterima |
| --- | --- |
| FAVICON\$1ICO | ico |
| FAVICON\$1SVG | svg |
| EMAIL\$1GRAFIS | png, svg, jpeg |
| SMS\$1GRAFIK | png, svg, jpeg |
| AUTH\$1APP\$1GRAPHIC | png, svg, jpeg |
| PASSWORD\$1GRAPHIC | png, svg, jpeg |
| PASSKEY\$1GRAFIK | png, svg, jpeg |
| PAGE\$1HEADER\$1LOGO | png, svg, jpeg |
| PAGE\$1HEADER\$1LATAR BELAKANG | png, svg, jpeg |
| PAGE\$1FOOTER\$1LOGO | png, svg, jpeg |
| PAGE\$1FOOTER\$1LATAR BELAKANG | png, svg, jpeg |
| PAGE\$1LATAR BELAKANG | png, svg, jpeg |
| FORM\$1LATAR BELAKANG | png, svg, jpeg |
| BENTUK\$1LOGO | png, svg, jpeg |
| IDP\$1BUTTON\$1ICON | ico, svg |
File tipe SVG mendukung atribut dan elemen berikut.
------
#### [ Attributes ]
```
accent-height, accumulate, additivive, alignment-baseline, ascent, attributename, attributetype, azimuth, basefrequency, baseline-shift, begin, bias, by, class, clip, clip-path, clip-rule, color, color-interpolation, color-interpolation-filters, color-profile, color-rendering, cx, cy, d, dx, dy, diffuseconstant, direction, display, divisor, dur, edgemode, elevation, end, fill, fill-opacity, fill-rule, filter, filterunits, flood-color, flood-opacity, font-family, font-size, font-size-adjust, font-stretch, font-style, font-variant, font-weight, fx, fy, g1, g2, glyph-name, glyphref, gradientunits, gradienttransform, height, href, id, image-rendering, in, in2, k, k1, k2, k3, k4, kerning, keypoints, keysplines, keytimes, lang, lengthadjust, letter-spacing, kernelmatrix, kernelunitlength, lighting-color, local, marker-end, marker-mid, marker-start, markerheight, markerunits, markerwidth, maskcontentunits, maskunits, max, mask, media, method, mode, min, name, numoctaves, offset, operator, opacity, order, orient, orientation, origin, overflow, paint-order, path, pathlength, patterncontentunits, patterntransform, patternunits, points, preservealpha, preserveaspectratio, r, rx, ry, radius, refx, refy, repeatcount, repeatdur, restart, result, rotate, scale, seed, shape-rendering, specularconstant, specularexponent, spreadmethod, stddeviation, stitchtiles, stop-color, stop-opacity, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke, stroke-width, style, surfacescale, tabindex, targetx, targety, transform, text-anchor, text-decoration, text-rendering, textlength, type, u1, u2, unicode, values, viewbox, visibility, vert-adv-y, vert-origin-x, vert-origin-y, width, word-spacing, wrap, writing-mode, xchannelselector, ychannelselector, x, x1, x2, xmlns, y, y1, y2, z, zoomandpan
```
------
#### [ Elements ]
```
svg, a, altglyph, altglyphdef, altglyphitem, animatecolor, animatemotion, animatetransform, audio, canvas, circle, clippath, defs, desc, ellipse, filter, font, g, glyph, glyphref, hkern, image, line, lineargradient, marker, mask, metadata, mpath, path, pattern, polygon, polyline, radialgradient, rect, stop, style, switch, symbol, text, textpath, title, tref, tspan, video, view, vkern, feBlend, feColorMatrix, feComponentTransfer, feComposite, feConvolveMatrix, feDiffuseLighting, feDisplacementMap, feDistantLight, feFlood, feFuncA, feFuncB, feFuncG, feFuncR, feGaussianBlur, feMerge, feMergeNode, feMorphology, feOffset, fePointLight, feSpecularLighting, feSpotLight, feTile, feTurbulence
```
------
### Alat untuk operasi branding login terkelola
Amazon Cognito mengelola file dalam [format skema JSON untuk objek pengaturan](https://json-schema.org/docs) branding login terkelola. Berikut ini adalah cara memperbarui gaya branding Anda secara terprogram.
**Untuk memperbarui branding di API kumpulan pengguna**
1. Di konsol Amazon Cognito, buat gaya branding login terkelola default dari menu **Login terkelola kumpulan** pengguna Anda. Tetapkan ke klien aplikasi.
1. Catat ID klien aplikasi yang Anda buat gayanya, misalnya`1example23456789`.
1. Ambil pengaturan untuk gaya branding dengan permintaan [DescribeManagedLoginBrandingByClient](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_DescribeManagedLoginBrandingByClient.html)API dengan `ReturnMergedResources` set ke. `true` Berikut ini adalah contoh badan permintaan.
```
{
"ClientId": "1example23456789",
"ReturnMergedResources": true,
"UserPoolId": "us-east-1_EXAMPLE"
}
```
1. Ubah output `DescribeManagedLoginBrandingByClient` dengan kustomisasi Anda.
1. Badan respons dibungkus dalam `ManagedLoginBranding` elemen yang bukan bagian dari sintaks untuk membuat dan memperbarui operasi. Hapus level atas objek JSON ini.
1. Untuk mengganti gambar, ganti `Bytes` nilainya dengan data biner yang dikodekan Base64 dari setiap file gambar.
1. Untuk memperbarui pengaturan, ubah output `Settings` objek dan sertakan dalam permintaan Anda berikutnya. Amazon Cognito mengabaikan nilai apa pun di `Settings` objek Anda yang tidak ada dalam skema yang Anda terima dalam respons API Anda.
1. Gunakan badan respons yang diperbarui dalam [UpdateManagedLoginBranding](https://docs.aws.amazon.com/)permintaan [CreateManagedLoginBranding](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_CreateManagedLoginBranding.html)atau. Jika permintaan ini melebihi ukuran 2 MB, pisahkan menjadi beberapa permintaan. Operasi ini bekerja dalam `PATCH` model di mana pengaturan asli tetap tidak berubah kecuali Anda menentukan sebaliknya.
# Menyesuaikan pencitraan merek UI (klasik) yang dihosting
Anda dapat menggunakan Konsol Manajemen AWS, atau API AWS CLI atau, untuk menentukan pengaturan kustomisasi klasik untuk UI yang dihosting. Anda dapat mengunggah gambar logo kustom yang akan ditampilkan di aplikasi. Anda juga dapat menerapkan beberapa opsi cascading style sheet (CSS) pada tampilan dan nuansa UI.
Anda dapat menyesuaikan default UI dan mengganti [klien aplikasi](cognito-terms.md#term-appclient) individual dengan setelan tertentu. Amazon Cognito menerapkan konfigurasi default ke setiap klien aplikasi yang tidak memiliki pengaturan tingkat klien.
Di konsol Amazon Cognito dan dalam permintaan API, permintaan yang menyetel kustomisasi UI Anda tidak boleh melebihi ukuran 135 KB. Dalam kasus yang jarang terjadi, jumlah header permintaan, file CSS Anda, dan logo Anda mungkin melebihi 135KB. Amazon Cognito mengkodekan file gambar ke Base64. Ini meningkatkan ukuran gambar 100 KB menjadi 130 KB, menjaga lima KB untuk header permintaan dan CSS Anda. Jika permintaan terlalu besar, permintaan `SetUICustomization` API Konsol Manajemen AWS atau Anda mengembalikan `request parameters too large` kesalahan. Sesuaikan gambar logo Anda agar tidak lebih dari 100KB dan file CSS Anda tidak lebih besar dari 3 KB. Anda tidak dapat mengatur kustomisasi CSS dan logo secara terpisah.
**catatan**
Untuk menyesuaikan UI, Anda harus menyiapkan domain untuk kumpulan pengguna.
## Menentukan logo kustom dalam branding klasik
Amazon Cognito memusatkan logo kustom Anda di atas bidang input di. [Titik akhir masuk](login-endpoint.md)
Pilih file PNG, JPG, atau JPEG yang dapat menskalakan hingga 350 kali 178 piksel untuk logo UI yang dihosting khusus Anda. File logo Anda dapat berukuran tidak lebih dari 100 KB, atau 130 KB setelah Amazon Cognito mengkodekan ke Base64. Untuk menyetel `ImageFile` in [https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_SetUICustomization.html](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_SetUICustomization.html)di API, konversikan file Anda ke string teks yang dikodekan Base64 atau, di AWS CLI, berikan jalur file dan biarkan Amazon Cognito menyandikannya untuk Anda.
## Menentukan kustomisasi CSS dalam branding klasik
Anda dapat mengkustomisasi CSS untuk halaman aplikasi yang di-hosting, dengan pembatasan berikut:
+ Anda dapat menggunakan salah satu nama kelas CSS berikut:
+ `background-customizable`
+ `banner-customizable`
+ `errorMessage-customizable`
+ `idpButton-customizable`
+ `idpButton-customizable:hover`
+ `idpDescription-customizable`
+ `inputField-customizable`
+ `inputField-customizable:focus`
+ `label-customizable`
+ `legalText-customizable`
+ `logo-customizable`
+ `passwordCheck-valid-customizable`
+ `passwordCheck-notValid-customizable`
+ `redirect-customizable`
+ `socialButton-customizable`
+ `submitButton-customizable`
+ `submitButton-customizable:hover`
+ `textDescription-customizable`
+ Nilai properti dapat berisi HTML, kecuali untuk nilai-nilai berikut:`@import`,, `@supports``@page`, atau `@media` pernyataan, atau Javascript.
Anda dapat mengkustomisasi properti CSS berikut.
**Label**
+ **bobot huruf** adalah kelipatan 100 dari 100 sampai 900.
+ **warna** adalah warna teks. Harus berupa [nilai warna CSS yang legal](https://www.w3schools.com/cssref/css_colors_legal.php).
**Bidang input**
+ **lebar** adalah lebar blok yang mengandung sebagai persentase.
+ **tinggi** adalah tinggi bidang input dalam piksel (px).
+ **warna** adalah warna teks. Ini bisa berupa setiap nilai warna CSS standar.
+ **warna latar belakang** adalah warna latar belakang bidang input. Ini bisa berupa setiap nilai warna CSS standar.
+ **perbatasan** adalah nilai batas CSS standar yang menentukan lebar, transparansi, dan warna perbatasan jendela aplikasi Anda. Lebar dapat berupa nilai dari 1px hingga 100px. Transparansi bisa jadi padat atau tidak ada. Warna bisa berupa setiap nilai warna standar.
**Deskripsi teks**
+ **padding-top** adalah jumlah padding di atas deskripsi teks.
+ **padding-bottom** adalah jumlah padding di bawah deskripsi teks.
+ **tampilan** dapat berupa `block` atau `inline`.
+ **ukuran huruf** adalah ukuran huruf untuk deskripsi teks.
+ **warna** adalah warna teks. Harus berupa [nilai warna CSS yang legal](https://www.w3schools.com/cssref/css_colors_legal.php).
**Tombol kirim**
+ **ukuran huruf** adalah ukuran huruf pada teks tombol.
+ **bobot huruf** adalah bobot huruf pada teks tombol: `bold`, `italic`, atau `normal`.
+ **margin** adalah string dari empat nilai yang menunjukkan ukuran margin atas, kanan, bawah, dan kiri untuk tombol.
+ **ukuran huruf** adalah ukuran huruf untuk deskripsi teks.
+ **lebar** adalah lebar teks tombol dalam persentase pada blok yang menampungnya.
+ **tinggi** adalah tinggi tombol dalam piksel (px).
+ **warna** adalah warna teks tombol. Ini bisa berupa setiap nilai warna CSS standar.
+ **warna latar belakang** adalah warna latar belakang tombol. Ini bisa berupa setiap nilai warna standar.
**Banner**
+ **padding** adalah string dari empat nilai yang menunjukkan ukuran padding atas, kanan, bawah, dan kiri untuk spanduk.
+ **warna latar belakang** adalah warna latar belakang banner. Ini bisa berupa setiap nilai warna CSS standar.
**Pengarahan tombol kirim**
+ **warna** adalah warna latar depan tombol saat Anda mengarahkan kursor ke atasnya. Ini bisa berupa setiap nilai warna CSS standar.
+ **warna latar belakang** adalah warna latar belakang tombol saat Anda mengarahkan kursor ke atasnya. Ini bisa berupa setiap nilai warna CSS standar.
**Pengarahan tombol penyedia identitas**
+ **warna** adalah warna latar depan tombol saat Anda mengarahkan kursor ke atasnya. Ini bisa berupa setiap nilai warna CSS standar.
+ **warna latar belakang** adalah warna latar belakang tombol saat Anda mengarahkan kursor ke atasnya. Ini bisa berupa setiap nilai warna CSS standar.
**Cek kata sandi tidak valid**
+ **warna** adalah warna teks pesan `"Password check not valid"`. Ini bisa berupa setiap nilai warna CSS standar.
**Latar Belakang**
+ **warna latar belakang** adalah warna latar belakang pada jendela aplikasi. Ini bisa berupa setiap nilai warna CSS standar.
**Pesan kesalahan**
+ **margin** adalah string dari empat nilai yang menunjukkan ukuran margin atas, kanan, bawah, dan kiri.
+ **padding** adalah ukuran padding.
+ **Ukuran huruf** adalah ukuran huruf.
+ **lebar** adalah lebar pesan kesalahan dalam persentase pada blok yang menampungnya.
+ **latar belakang** adalah warna latar belakang pada pesan kesalahan. Ini bisa berupa setiap nilai warna CSS standar.
+ **border** adalah string dari tiga nilai yang menentukan lebar, transparansi, dan warna perbatasan.
+ **warna** adalah warna teks pesan kesalahan. Ini bisa berupa setiap nilai warna CSS standar.
+ **ukuran kotak** digunakan untuk menunjukkan kepada browser apa yang harus disertakan oleh properti ukuran (lebar dan tinggi).
**Tombol penyedia identitas**
+ **tinggi** adalah tinggi tombol dalam piksel (px).
+ **lebar** adalah lebar teks tombol dalam bentuk persentase dari blok yang menampungnya.
+ **rata-teks** adalah pengaturan perataan teks. Status tersebut dapat berupa `left`, `right`, atau `center`.
+ **margin-bawah** adalah pengaturan margin bawah.
+ **warna** adalah warna teks tombol. Ini bisa berupa setiap nilai warna CSS standar.
+ **warna latar belakang** adalah warna latar belakang tombol. Ini bisa berupa setiap nilai warna CSS standar.
+ **warna batas** adalah warna batas tombol. Ini bisa berupa setiap nilai warna CSS standar.
**Deskripsi penyedia identitas**
+ **padding-top** adalah jumlah padding di atas deskripsi.
+ **padding-bottom** adalah jumlah padding di bawah deskripsi.
+ **tampilan** dapat berupa `block` atau `inline`.
+ **ukuran huruf** adalah ukuran huruf untuk deskripsi.
+ **color** adalah warna teks untuk header bagian IDP misalnya **Masuk dengan ID perusahaan Anda**. Harus berupa [nilai warna CSS yang legal](https://www.w3schools.com/cssref/css_colors_legal.php).
**Teks legal**
+ **warna** adalah warna teks. Ini bisa berupa setiap nilai warna CSS standar.
+ **Ukuran huruf** adalah ukuran huruf.
Saat Anda menyesuaikan **teks Hukum**, Anda menyesuaikan pesan **Kami tidak akan memposting ke akun Anda tanpa meminta terlebih dahulu** yang ditampilkan di bawah penyedia identitas sosial di halaman masuk.
**Logo**
+ **lebar maksimal** adalah lebar maksimal dalam persentase pada blok yang menampungnya.
+ **tinggi maksimal** adalah tinggi maksimal dalam persentase pada blok yang menampungnya.
+ **background-color** adalah warna latar belakang untuk log dengan bagian transparan. Harus berupa [nilai warna CSS yang legal](https://www.w3schools.com/cssref/css_colors_legal.php).
**Fokus bidang input**
+ **warna batas** adalah warna dari bidang input. Ini bisa berupa setiap nilai warna CSS standar.
+ **garis batas** adalah lebar perbatasan bidang input, dalam piksel.
**Tombol sosial**
+ **tinggi** adalah tinggi tombol dalam piksel (px).
+ **rata-teks** adalah pengaturan perataan teks. Status tersebut dapat berupa `left`, `right`, atau `center`.
+ **lebar** adalah lebar teks tombol dalam bentuk persentase dari blok yang menampungnya.
+ **margin-bawah** adalah pengaturan margin bawah.
**Pemeriksaan kata sandi valid**
+ **warna** adalah warna teks pesan `"Password check valid"`. Ini bisa berupa setiap nilai warna CSS standar.
## Menyesuaikan UI yang dihosting dengan branding klasik di Konsol Manajemen AWS
Anda dapat menggunakan Konsol Manajemen AWS untuk menentukan pengaturan penyesuaian UI untuk aplikasi Anda.
**catatan**
Anda dapat melihat UI yang dihosting dengan penyesuaian Anda dengan membangun URL berikut, dengan spesifik untuk kolam pengguna Anda, dan mengetikkannya ke peramban: ` https:///login?response_type=code&client_id=&redirect_uri=` Anda mungkin harus menunggu hingga satu menit untuk menyegarkan peramban Anda sebelum perubahan yang dibuat di konsol muncul.
Domain Anda ditampilkan di tab **Integrasi aplikasi** di bawah **Domain**. ID klien aplikasi dan URL callback ditampilkan di bawah **Klien aplikasi**.
**Cara menentukan pengaturan kustomisasi UI aplikasi**
1. Masuk ke [konsol Amazon Cognito](https://console.aws.amazon.com/cognito/home).
1. Di panel navigasi, pilih **Kumpulan Pengguna**, dan pilih kumpulan pengguna yang ingin Anda edit.
1. [Buat domain](cognito-user-pools-assign-domain.md) dari tab **Domain**, atau perbarui domain yang ada. Dalam **versi Branding**, atur domain Anda untuk menggunakan **Hosted UI (klasik)**.
1. Pilih menu **Login Terkelola**.
1. Untuk menyesuaikan setelan UI untuk semua klien aplikasi, cari **Style** di bawah **Setelan UI Hosted** dan pilih **Edit**.
1. Untuk menyesuaikan pengaturan UI untuk satu klien aplikasi, buka menu Klien **aplikasi dan pilih klien** aplikasi yang ingin Anda ubah, lalu cari **gaya UI Hosted (klasik)** dan pilih **Override**. Pilih **Edit**.
1. Untuk mengunggah file gambar logo Anda sendiri, pilih **Pilih file** atau **Ganti file saat ini**.
1. Untuk menyesuaikan CSS UI yang dihosting, unduh **CSS template.css** dan modifikasi template dengan nilai yang ingin Anda sesuaikan. Hanya kunci yang disertakan dalam template yang dapat digunakan dengan UI yang dihosting. Tombol CSS yang ditambahkan tidak akan tercermin di UI Anda. Setelah Anda menyesuaikan file CSS, pilih **Pilih file atau Ganti file** **saat ini untuk mengunggah file** CSS kustom Anda.
## Menyesuaikan UI yang dihosting dengan pencitraan merek klasik di API kumpulan pengguna dan dengan AWS CLI
Gunakan perintah berikut agar dapat menentukan pengaturan kustomisasi UI aplikasi untuk kolam pengguna Anda.
**Untuk mendapatkan pengaturan penyesuaian UI untuk UI aplikasi bawaan kumpulan pengguna, gunakan operasi API berikut.**
+ AWS CLI: `aws cognito-idp get-ui-customization`
+ AWS API: [https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_GetUICustomization.html](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_GetUICustomization.html)
**Untuk menyetel setelan kustomisasi UI untuk UI aplikasi bawaan kumpulan pengguna, gunakan operasi API berikut.**
+ AWS CLI dari file gambar: `aws cognito-idp set-ui-customization --user-pool-id --client-id --image-file fileb://"" --css ".label-customizable{ color: ;}"`
+ AWS CLI dengan gambar yang dikodekan sebagai teks biner Base64: `aws cognito-idp set-ui-customization --user-pool-id --client-id --image-file --css ".label-customizable{ color: ;}"`
+ AWS API: [https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_SetUICustomization.html](https://docs.aws.amazon.com/cognito-user-identity-pools/latest/APIReference/API_SetUICustomization.html)