Ya, ya - ini disebut "Cross Domain Cookie", tetapi menggunakan localStorage. Pada iterasi pertama, cookie digunakan, tetapi karena perubahan saat ini dan yang akan datang pada kebijakan cookie browser, belum lagi tunjangan hard drive yang lebih besar untuk LS, lebih masuk akal untuk memindahkannya ke penyimpanan lokal. Show
Namun, "Cross Domain Cookie" akan tetap ada RingkasanNilai localStorage adalah potongan data yang kami simpan ke hard drive pengguna untuk digunakan nanti oleh aplikasi kami. Setiap nilai yang kami simpan dicakup ke domain tempat pengguna berada saat penyimpanan dilakukan. Demikian juga, saat mengambil nilai, kami dibatasi untuk hanya mengakses nilai yang disimpan ke domain tempat kode kami dijalankan Ini bagus, karena melarang situs belanja pengguna mengambil data dari, katakanlah, situs media sosial mereka, tanpa persetujuan pengguna atau situs media sosial Di mana hal ini menjadi menyakitkan - terkadang pemilik situs memiliki dua situs dan ingin membiarkan pengguna lewat dengan mudah di antara mereka dengan semua data yang disimpan. Jika, misalnya, Anda memiliki rangkaian situs dengan domain yang berbeda dan pengguna masuk ke salah satu situs, Anda sebaiknya tidak membuat mereka masuk lagi saat berpindah ke yang lain. Ini membuat UX buruk bagi pengguna yang menginginkan pengalaman mulus Masukkan cookie lintas-domain. Paket ini memungkinkan Anda untuk menyimpan semua data pengguna di domain pusat (hub), dan mengatur atau mengaksesnya dari domain (satelit) yang bergantung. Ini juga memungkinkan Anda untuk menggabungkan logika pengambilan data Anda di domain pusat, sehingga semua domain satelit hanya perlu mengambilnya. Ini memungkinkan pendekatan yang lebih KERING Penggunaancross-domain-cookie menyediakan kode untuk iframe yang dihosting di domain hub, serta pengambil dan penyetel data untuk domain satelit Penyiapan minimum hanya melibatkan penerapan kode iframe dengan daftar domain satelit yang terdaftar akses ke domain hub Anda, dan menggunakan fungsi import { set } from "cross-domain-cookie"; const result = await set({ // This is the URL at which you've hosted the output of `createIframe`, above: iframeUrl: 'https://hub.com/cross-domain-cookie.html', dataKey: 'chocolate-chip-oatmeal', data: { c: 'is for localStorage', and: 'that\'s good enough for me.' } });0 di aplikasi pada domain satelit Catatan Anda dapat menemukan contoh lengkap penggunaan di direktori /examples dari repo. Perhatikan bagian "Tes Asap" di bawah untuk cara menjalankan contoh secara lokal Setting dan Mendapatkan Data dari Aplikasi Satelitiframe di hub. com/cross-domain-cookie. html import { createIframe } from "cross-domain-cookie"; // Sites allows to access data on the hub domain: const dependentDomains = ["satellite1.com", "satellite2.com"]; // Sets up the contents of the iframe: createIframe({ dependentDomains }); // That's it! Including this code in an HTML file on your central domain readies you for data sharing across domains._ Di suatu tempat di aplikasi di satellite1. com import { set } from "cross-domain-cookie"; const result = await set({ // This is the URL at which you've hosted the output of `createIframe`, above: iframeUrl: 'https://hub.com/cross-domain-cookie.html', dataKey: 'chocolate-chip-oatmeal', data: { c: 'is for localStorage', and: 'that\'s good enough for me.' } }); Di suatu tempat di aplikasi di satellite2. com import { get } from "cross-domain-cookie"; const result = await get({ iframeUrl: 'https://hub.com/cross-domain-cookie.html', dataKey: 'chocolate-chip-oatmeal', }); console.log(result) /* Logs: { c: 'is for localStorage', and: 'that\'s good enough for me.' } */ Di balik tudung, fungsi import { set } from "cross-domain-cookie"; const result = await set({ // This is the URL at which you've hosted the output of `createIframe`, above: iframeUrl: 'https://hub.com/cross-domain-cookie.html', dataKey: 'chocolate-chip-oatmeal', data: { c: 'is for localStorage', and: 'that\'s good enough for me.' } });0 menyuntikkan skrip iframe ke halaman, lalu mengirimkan permintaan untuk mengakses ruang penyimpanan lokalnya. Iframe berisi kode untuk menginterpretasikan permintaan, dan mendapatkan serta menyetel data seperti yang diinstruksikan Namun, salah satu kekuatan cookie lintas-domain adalah memungkinkan Anda menjadikan iframe sebagai sumber kebenaran, mengurangi potensi kondisi balapan dan perilaku non-KERING di aplikasi satelit Anda. Hal ini dilakukan dengan menggunakan penangan di iframe untuk melakukan pengambilan cookie, sehingga aplikasi satelit dapat menerima begitu saja proses akuisisi data. Baca terus Penangan IframeDengan menyetel import { set } from "cross-domain-cookie"; const result = await set({ // This is the URL at which you've hosted the output of `createIframe`, above: iframeUrl: 'https://hub.com/cross-domain-cookie.html', dataKey: 'chocolate-chip-oatmeal', data: { c: 'is for localStorage', and: 'that\'s good enough for me.' } });_3 untuk import { set } from "cross-domain-cookie"; const result = await set({ // This is the URL at which you've hosted the output of `createIframe`, above: iframeUrl: 'https://hub.com/cross-domain-cookie.html', dataKey: 'chocolate-chip-oatmeal', data: { c: 'is for localStorage', and: 'that\'s good enough for me.' } });4 di iframe, aplikasi satelit Anda dapat meminta data, dan iframe hub akan menangani pengambilan data. Ini berarti tidak ada aplikasi yang harus menyetel data sebelum orang lain dapat mengambilnya iframe di hub. com/cross-domain-cookie. html import { createIframe } from 'cross-domain-cookie' // A function of the user's choosing, which returns a primitive or stringify-able value: import { createUserUuid } from 'my-data-getter' const dependentDomains = ['satellite1.com', 'satellite2.com'] createIframe({ dependentDomains, dataConfigs: [ { dataKey: 'userUuid', handler: createUserUuid } ] }); Dalam kasus di atas, iframe sekarang akan menghosting pengambil data kami, import { set } from "cross-domain-cookie"; const result = await set({ // This is the URL at which you've hosted the output of `createIframe`, above: iframeUrl: 'https://hub.com/cross-domain-cookie.html', dataKey: 'chocolate-chip-oatmeal', data: { c: 'is for localStorage', and: 'that\'s good enough for me.' } });5. Nilai yang dikembalikan oleh fungsi sinkron atau asinkron ini akan disimpan di kunci import { set } from "cross-domain-cookie"; const result = await set({ // This is the URL at which you've hosted the output of `createIframe`, above: iframeUrl: 'https://hub.com/cross-domain-cookie.html', dataKey: 'chocolate-chip-oatmeal', data: { c: 'is for localStorage', and: 'that\'s good enough for me.' } });6 di iframe, dan tersedia untuk semua domain satelit Kami sekarang dapat menambahkan kode berikut ke satellite1. com dan satellite2. com. Satelit pertama yang memanggil iframe akan memicu iframe untuk mengeksekusi import { set } from "cross-domain-cookie"; const result = await set({ // This is the URL at which you've hosted the output of `createIframe`, above: iframeUrl: 'https://hub.com/cross-domain-cookie.html', dataKey: 'chocolate-chip-oatmeal', data: { c: 'is for localStorage', and: 'that\'s good enough for me.' } });5 dan meng-cache respons di hub. Pada panggilan kedua, iframe akan segera membalas dengan nilai yang di-cache Di suatu tempat di aplikasi di satellite1. com import { get } from "cross-domain-cookie"; const result = await get({ iframeUrl: 'https://hub.com/cross-domain-cookie.html', dataKey: 'userUuid', }); console.log(result) // 123e4567-e89b-12d3-a456-426655440000 APIimport { set } from "cross-domain-cookie"; const result = await set({ // This is the URL at which you've hosted the output of `createIframe`, above: iframeUrl: 'https://hub.com/cross-domain-cookie.html', dataKey: 'chocolate-chip-oatmeal', data: { c: 'is for localStorage', and: 'that\'s good enough for me.' } });_8Fungsi untuk menghasilkan kode yang ada di iframe pada domain hub. Sertakan output dalam dokumen HTML, dan terapkan ke domain hub Anda optiondescriptionrequiredtypeexample |