10

เป้าหมาย:ขยายการใช้งานของฉันไปแล้วlocalStorageในแอปของฉันให้ดีไม่ใช่ในท้องถิ่นฉันเดา

ฉันชอบการนำไปใช้ในการบันทึกการตั้งค่าผู้ใช้อย่างง่ายด้วย API การจัดเก็บข้อมูลในตัวเครื่อง ฉันใช้งานได้ตามความต้องการของฉันในเว็บแอพ แต่ปัญหาเดียวคือมันอยู่ในเครื่อง / เบราว์เซอร์ที่ใช้ / บันทึก ฉันไม่สามารถเข้าถึงตารางสไตล์ MySQL ดั้งเดิมได้ ฉันต้องการขยายหรือปรับที่เก็บข้อมูลในเครื่องของฉันเพื่อพกพาไปยังเบราว์เซอร์อื่น หรือเก็บการตั้งค่าผู้ใช้ของฉันในวัตถุ JS ผู้ใช้และคุณสมบัติวัตถุ JS

ฉันชอบความคิดในการสร้างวัตถุ JSON หรือ JavaScript กับผู้ใช้แต่ละคนเมื่อใดก็ตามที่มีผู้ใช้ใหม่ใช้ชื่อสร้างวัตถุหรือobject[key]ด้วยชื่อและมีตัวแปรเริ่มต้นของคุณสมบัติเขตข้อมูลในตอนแรกและตัวแปรกลายเป็นประชากรและหรือ แทนที่เมื่อผู้ใช้บันทึก
หรือถ้าข้างต้นเป็นขมวดคิ้วเมื่อ; ต้องการให้การใช้งาน localstorage ของฉันทำงานได้เป็นอย่างดีและค้นหาปลั๊กอิน / ไลบรารี / ส่วนขยายของการเรียงลำดับบางอย่างที่ช่วยให้ฉันสามารถบันทึกสิ่งนี้และแสดงอีกครั้งในสถานที่ที่แตกต่างกัน สิ่งนี้ได้รับการคาดคิดมาก่อน แม้ว่าฉันจะชอบที่จะทำให้ลูกค้าด้าน; ฉันเปิดให้โซลูชัน node.js เช่นเดียวกับโซลูชั่นหลาม, dataframe ง่าย ๆ ควรจะทำงานได้ดีพอ
แล้วการสร้างไฟล์ด้วยlocalStorageข้อมูลของฉันล่ะ? อาจเป็นไฟล์. csv (นี่ไม่ใช่ข้อมูลที่ละเอียดอ่อน)และมีการอัปเดตตามที่ฉันlocalStorageทำหรือไม่

— วันหยุดเอกสาร
แหล่งที่มา

2

คุณไม่สามารถทำลูกค้าฝั่งนี้เท่านั้น ในการคงข้อมูลผู้ใช้ในเบราว์เซอร์คุณต้องมีเซิร์ฟเวอร์สาธารณะและเก็บข้อมูลไว้ โดยทั่วไปจะทำโดยใช้ฐานข้อมูล หากคุณไม่ต้องการใช้ mySQL มีที่เก็บข้อมูลประเภทอื่น Firebase นั้นใกล้เคียงกับที่คุณจินตนาการเอาไว้มันช่วยให้คุณเก็บวัตถุที่มีโครงสร้างตามอำเภอใจ (เช่นเดียวกับ JSON เป็นรูปแบบข้อความไม่มีสิ่งเช่นวัตถุ JSON)

— Chris G

ค่อนข้างคล้ายกับที่: stackoverflow.com/a/60279503/4845566 ?

— deblocker

3

แล้วการใช้ sqlite ล่ะ?

เพียงไฟล์เดียวบนเซิร์ฟเวอร์ของคุณเช่น csv การส่งคำขอ http เพื่ออัปเดตโดยใช้คำสั่ง SQL โดย knex หรืออะไรทำนองนั้นหลังจากอัพเดต localstorage บนฝั่งไคลเอ็นต์

อย่างน้อยก็ดีกว่า cvs ฉันคิดว่าเพราะคุณสามารถกำหนดหลายตารางซึ่งสามารถปรับขนาดได้และมีประสิทธิภาพมากขึ้นคุณรู้ว่ามันเป็นฐานข้อมูล

— kobako
แหล่งที่มา

2

ฉันเพิ่มสองเซ็นต์ของฉันที่นี่

ส่งออก / นำเข้าไฟล์ (JSON, XML, CSV, TSV, ฯลฯ )

ส่งออก:

ทำให้การตั้งค่าเป็นอนุกรมและดาวน์โหลดเป็นไฟล์

นำเข้า:

เปิดไฟล์การตั้งค่าแบบอนุกรมที่ส่งออก / ดาวน์โหลด

รหัสตัวอย่าง:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Settings Export/Import Demo</title>
</head>

<body>
    <div id="display"></div> <br>
    <button onclick="exportSettings();">Export</button>

    <button onclick="resetSettings();">Reset</button> <br><br>
    File to import: <input id="file-input" type="file" accept="application/json"> <br>
    <button onclick="importSettings();">Import</button>
    <script>

        function exportSettings() {
            var json = getSettingsAsJSON();
            var blob = new Blob([json], { type: "application/json" });
            var linkElement = document.createElement("a");

            linkElement.href = URL.createObjectURL(blob);
            linkElement.download = "ThisIsMySettings";

            document.body.appendChild(linkElement);

            linkElement.click();

            document.body.removeChild(linkElement);
        }

        function importSettings() {
            var fileInput = document.getElementById("file-input");

            if (fileInput.files.length > 0) {
                var jsonFile = fileInput.files[0];

                var fileReader = new FileReader();

                fileReader.onload = function (e) {
                    var json = e.target.result;

                    try {
                        var settings = JSON.parse(json);

                        if (settings.hasOwnProperty("userId")) {
                            localStorage["myapp_user_id"] = settings.userId;
                        }

                        if (settings.hasOwnProperty("hello")) {
                            localStorage["myapp_hello"] = settings.hello;
                        }

                        if (settings.hasOwnProperty("data")) {
                            localStorage["myapp_data"] = settings.data;
                        }

                        displaySettings();
                    } catch (ex) {
                        console.error(ex);

                        alert("Error occured while importing settings!");
                    }
                };

                fileReader.readAsText(jsonFile);
            }
        }

        function resetSettings() {
            localStorage["myapp_user_id"] = Math.floor(Math.random() * 100000) + 1;
            localStorage["myapp_hello"] = "Hello World!";
            localStorage["myapp_data"] = JSON.stringify([1, 3, 3, 7]);

            displaySettings();
        }

        function displaySettings() {
            var json = getSettingsAsJSON();

            document.getElementById("display").innerText = json;
        }

        function getSettingsAsJSON() {
            return JSON.stringify({
                userId: localStorage["myapp_user_id"],
                hello: localStorage["myapp_hello"],
                data: localStorage["myapp_data"]
            });
        }

        resetSettings();
    </script>
</body>

</html>

URL (สตริงการสืบค้น)

ส่งออก:

เข้ารหัสการตั้งค่าลงในสตริงแบบสอบถามและรวมกับ URL ปัจจุบันเป็นการเชื่อมโยงหลายมิติ

นำเข้า:

ไปที่ไฮเปอร์ลิงก์ที่มีสตริงข้อความค้นหาพร้อมการตั้งค่าที่เข้ารหัสแล้วตรวจจับ JavaScript และโหลดการตั้งค่าจากสตริงข้อความค้นหา

ข้อมูลที่เข้ารหัส Base64

ส่งออก:

การตั้งค่าที่เป็นอันดับแล้วเข้ารหัสเป็นสตริง Base64 แล้วคัดลอกไปยังคลิปบอร์ด

นำเข้า:

วางสตริง Base64 จากคลิปบอร์ดลงในกล่องข้อความเพื่อถอดรหัส, เลิกทำการปรับขนาดและโหลดการตั้งค่า

คิวอาร์โค้ด

ส่งออก:

เข้ารหัสการตั้งค่าลงในสตริงแบบสอบถามและรวมกับ URL ปัจจุบันเป็นการเชื่อมโยงหลายมิติ จากนั้นสร้างภาพรหัส QR และแสดงผล

นำเข้า:

สแกนภาพรหัส QR ที่สร้างขึ้นแล้วไปที่ไฮเปอร์ลิงก์โดยอัตโนมัติ

เซิร์ฟเวอร์ HTTP (Node.js) / ที่เก็บข้อมูลบนคลาวด์ (AWS S3)

ส่งออก:

HTTP POST ไปยังปลายทางโดยอัตโนมัติเมื่ออัปเดตค่าตามรหัสผู้ใช้

นำเข้า:

HTTP GET จากปลายทางโดยรหัสผู้ใช้

พิเศษ: PouchDB

ฐานข้อมูลที่ซิงค์!

PouchDB เป็นฐานข้อมูล JavaScript แบบโอเพ่นซอร์สซึ่งได้รับแรงบันดาลใจจากApache CouchDBที่ออกแบบมาเพื่อให้ทำงานได้ดีภายในเบราว์เซอร์

PouchDB ถูกสร้างขึ้นเพื่อช่วยให้นักพัฒนาเว็บสร้างแอปพลิเคชันที่ทำงานเช่นเดียวกับออฟไลน์เช่นเดียวกับที่พวกเขาทำออนไลน์ ช่วยให้แอปพลิเคชันสามารถจัดเก็บข้อมูลในเครื่องขณะออฟไลน์จากนั้นซิงโครไนซ์กับ CouchDB และเซิร์ฟเวอร์ที่ใช้งานร่วมกันได้เมื่อแอปพลิเคชันกลับมาออนไลน์อีกครั้งทำให้ข้อมูลของผู้ใช้ตรงกัน

— DK Dhilip
แหล่งที่มา

ขอบคุณสำหรับคำตอบ หนึ่งที่ดีที่สุดยัง; ด้วยการนำเข้า / ส่งออกครั้งแรก - ฉันสามารถทำได้เพื่อให้ผู้ใช้สามารถเปิดไฟล์เพื่อให้การตั้งค่าโหลดได้หรือไม่ มันทำงานอย่างไร

— วันหยุดเอกสาร

1

เพิ่มรหัสตัวอย่างสำหรับการส่งออก / นำเข้าไฟล์ JSON

— DK Dhilip

อ่าฉันเข้าใจแล้ว ขอบคุณ. ฉันแค่คิดว่ามันเป็นเรื่องเล็กน้อยที่จะถามจากผู้ใช้ หากมีวิธีฉันสามารถสร้างไฮเปอร์ลิงก์และส่งอีเมลถึงพวกเขาได้ ฉันคิดว่าข้อมูลของฉันมีอักขระจำนวนมากเกินกว่าจะใส่ลงในสตริงการสืบค้น URL ตัวเลือกรหัส QR จะสแกนได้อย่างไร

— วันหยุดเอกสาร

หากข้อมูลของคุณมีขนาดใหญ่เกินไปที่จะใส่ในสตริงข้อความค้นหาคุณอาจลองทดสอบด้วย gzip / deflate บวก Base64 เพื่อดูว่าสามารถลดขนาดของส่วนข้อมูลและรวมอยู่ในสตริงข้อความค้นหาได้ไหม ฉันไม่รู้ว่ามันจะทำงานได้ดีพอสำหรับกรณีของคุณหรือเปล่า สำหรับตัวเลือกรหัส QR สามารถสแกนได้โดยอุปกรณ์ใด ๆ ที่มีกล้องหรือสแกนไฟล์ภาพโดยตรง (จาก URL ปกติ, URL ข้อมูล, ไฟล์ที่เปิด)

— DK Dhilip

ในการขยายแนวคิดการลดขนาดข้อมูลคุณสามารถลองเรียงลำดับข้อมูลของคุณเป็น ArrayBuffer ด้วยตนเองเพื่อทำให้มันมีขนาดเล็กที่สุดเท่าที่จะเป็นไปได้จากนั้นใช้การเข้ารหัส Base64 ตามวิธีการส่งผ่าน

— DK Dhilip

2

คุณสามารถใช้ URL เป็นที่เก็บข้อมูลหากคุณซิปพารามิเตอร์ผู้ใช้ของคุณ
รับ params ที่คุณต้องการจัดเก็บ> json> deflate> encode ไปที่ base64> ดันเข้าไปใน URL

const urlParam = btoa(pako.deflate(JSON.stringify(getUser()), { to: 'string' }));

onload: รับ params จาก url> decode จาก base64> inflate> parse json

const user = JSON.parse(pako.inflate(atob(urlParam), { to: 'string' }));

https://jsfiddle.net/chukanov/q4heL8gu/44/

พารามิเตอร์ URL จะค่อนข้างยาว แต่น้อยกว่านั้นมากที่สุด 10 เท่า

— Anton Chukanov
แหล่งที่มา

นี้! อย่างไรก็ตามเมื่อฉันคอนโซลบันทึกข้อมูลการจัดเก็บในพื้นที่ของฉันมันเป็น ~ 20k และ ~ 8k ในตัวละคร ฉันจะทำอะไรแบบนี้ได้ไหม

— วันหยุดเอกสาร

1

ฉันทดสอบด้วยตัวอักษร 160k มันจะเป็น 1600 ตัวอักษรหลังจากยุบแม้ IE จะทำงานได้โดยไม่มีปัญหา (ความยาวสูงสุดของ URL สำหรับ - 2048) เบราว์เซอร์สมัยใหม่ไม่มีข้อ จำกัด สำหรับความยาว URL

— Anton Chukanov

ขอบคุณ! pako ต้องการห้องสมุดหรืออะไร? ฉันได้รับ pako ไม่ได้กำหนด

— วันหยุดหมอ

1

"เบราว์เซอร์ที่ทันสมัยมีข้อ จำกัด สำหรับความยาว URL ที่ไม่มี" เป็นสมมติฐานที่ผิดพลาดโปรดดูที่นี้ นอกจากนี้ pako ยังเป็นไลบรารี JavaScript ซึ่งสามารถพบได้ที่นี่ ( GitHub , cdnjs ) ท้ายนี้โปรดทราบว่าอัตราส่วนการบีบอัดอาจแตกต่างกันไปตามเนื้อหาข้อมูล

— DK Dhilip

2

แทนที่จะใช้ localstorage ให้จัดเก็บการตั้งค่าของผู้ใช้ของคุณในระบบไฟล์อวกาศ (IPFS) https://ipfs.io/

โดยทั่วไปคุณจะตั้งค่าเป็นรูปแบบข้อมูลเช่น JSON แล้วเขียนลงในไฟล์และผลักดันไปยัง IPFS

คุณจะต้องมีวิธีการระบุข้อมูลที่จะไปที่ผู้ใช้คนใด บางทีคุณอาจใช้แฮชของชื่อผู้ใช้และรหัสผ่านเพื่อตั้งชื่อไฟล์ของคุณหรืออะไรทำนองนั้น จากนั้นผู้ใช้ของคุณจะสามารถเข้าถึงเนื้อหาของพวกเขาบนอุปกรณ์ใด ๆ (ตราบใดที่พวกเขาไม่ลืมรหัสผ่าน)

— Michael Babcock
แหล่งที่มา

1

คุณสามารถใช้ห้องสมุดที่เรียกว่าlocalForageซึ่งเป็นพื้นมี API เช่นเดียวlocalStorageยกเว้นว่ามันจะช่วยให้คุณเก็บโครงสร้างข้อมูลที่ซับซ้อนมากขึ้น (อาร์เรย์วัตถุ) และยังสนับสนุนการเรียกกลับสไตล์สัญญาและnodejsasync await

นี่คือลิงค์ไปยังพื้นที่เก็บข้อมูล ที่คุณสามารถหาตัวอย่างประเพณีและวิธีการใช้ในโครงการในแบบที่คุณชอบ

— C.Gochev
แหล่งที่มา

ขอบคุณที่ดูเรียบร้อย แต่ดูเหมือนว่าจะมีข้อ จำกัด เดียวกันกับฐานข้อมูลเช่นเดียวกับ localStorage ปกติ

— วันหยุดหมอ

1

วิธีที่ดีที่สุดในการใช้งานนี้โดยไม่ต้องใช้ฐานข้อมูลสำหรับการแบ่งปันข้อมูลฉันเชื่อว่าเป็นโซลูชันWebRTCฉันคิดว่ามันเป็นวิธีการทำ แต่ฉันไม่มีรหัสสำหรับมัน (อย่างน้อยก็ตอนนี้) ดังนั้นด้วย การค้นหาบางอย่างฉันพบว่ามีคนทำแล้ว (ไม่ถูกต้อง แต่ด้วยการปรับแต่งบางอย่างมันจะพร้อม) ที่นี่เช่นและเป็นส่วนหนึ่งของบทความนี้webrtc โดยไม่มีเซิร์ฟเวอร์การส่งสัญญาณ

นี่คืออีกหนึ่งแหล่งที่มา: การสาธิตตัวอย่างช่องสัญญาณข้อมูลพื้นฐาน

และบน GitHub: ตัวอย่างพื้นฐานช่องข้อมูล

WebRTC ไม่เพียง แต่สำหรับวิดีโอแชท / เสียงเท่านั้น แต่ยังสามารถใช้ในการส่งข้อความและการทำงานร่วมกันในการแก้ไขข้อความ

การแก้ปัญหานี้ได้กล่าวถึงแม้จะอยู่ในหนึ่งในคำตอบที่นี่

— คุณอมร othman
แหล่งที่มา

0

ใช้คุกกี้หรือมีไฟล์ที่สามารถดาวน์โหลดได้ซึ่งผู้ใช้สามารถใช้กับพวกเขาเพื่อโหลดเมื่อพวกเขาเข้าถึงเบราว์เซอร์อื่น คุณสามารถทำได้ด้วยไฟล์ข้อความ JSON หรือ JavaScript พร้อมกับข้อมูลวัตถุ

ฉันเชื่อว่าคุกกี้เป็นเพียงในประเทศเท่านั้นเช่นกัน?

— วันหยุดเอกสาร

หลายเว็บไซต์สามารถใช้คุกกี้ของบุคคลที่สามได้หากพวกเขาใช้ "แหล่ง" เดียวกัน

0

คุณสามารถใช้Redis มันเป็นที่เก็บโครงสร้างข้อมูลในหน่วยความจำใช้เป็นฐานข้อมูล คุณสามารถจัดเก็บข้อมูลของคุณในรูปแบบคู่คีย์ มันทำให้แอปพลิเคชั่นของคุณรวดเร็วและมีประสิทธิภาพ

— Deeksha gupta
แหล่งที่มา

0

เห็นได้ชัดว่าวิธีที่ดีที่สุดคือการใช้ฐานข้อมูล อย่างไรก็ตามหากคุณต้องการใช้ฐานข้อมูลแนวทางที่ดีที่สุดที่เป็นไปได้คือการใช้เทคนิคหลายอย่างที่ฉันเชื่อว่าคุณได้สัมผัสมาแล้วดังนั้นฉันจะช่วยคุณเชื่อมต่อจุดต่างๆที่นี่

ขั้นตอนที่จำเป็น:

LocalStorage API (เนื่องจากมันใช้งานได้บางส่วนแล้ว)
สร้างจุดปลายโหนดหรือ Python (หรือสิ่งที่คุณพอใจ) ไปยังข้อมูลการตั้งค่า GET และ POST
สร้างไฟล์ userSettings.JSON บนเซิร์ฟเวอร์ API ของคุณ

คำแนะนำ:

คุณจะใช้ localStorage ของคุณเช่นเดียวกับที่คุณใช้ตอนนี้ (สถานะการทำงานปัจจุบัน)

ในการย้ายหรือตั้งค่าผู้ใช้ในอุปกรณ์ต่าง ๆ ไฟล์ userSettings.JSON (ทำหน้าที่เป็นฐานข้อมูลเอกสาร) จะถูกใช้เพื่อจัดเก็บและนำเข้าการตั้งค่าผู้ใช้

จุดสิ้นสุด API ของคุณจะถูกใช้เพื่อตั้งค่าผู้ใช้ GET หากไม่มีอยู่ใน localStorage ในการอัปเดตการตั้งค่าให้อัพเดต localStorage ของคุณจากนั้น POST / UPDATE การตั้งค่าใหม่ในไฟล์ userSettings.JSON ของคุณโดยใช้จุดปลาย

จุดสิ้นสุด API ของคุณจะถูกใช้เพื่อรักษา (อ่านและเขียน) ไฟล์ userSettings.JSON คุณจะต้องมีวิธีการ / ฟังก์ชั่นในการสร้างอัปเดตและอาจจะลบการตั้งค่าในไฟล์ของคุณ อย่างที่คุณทราบอยู่แล้วว่ารูปแบบไฟล์ JSON นั้นไม่แตกต่างจากฐานข้อมูล MongoDB มากนัก ในกรณีนี้คุณเพียงแค่สร้างวิธีที่คุณต้องการจัดการไฟล์ของคุณ

ฉันหวังว่านี่จะช่วยได้!

— mohammedabdulai
แหล่งที่มา

-1

คุณสามารถแก้ไขได้โดยไม่ต้องมีฐานข้อมูล แต่ฉันจะไม่แนะนำ โดยทั่วไปคุณมีคู่ (ผู้ใช้, localStorage) และเมื่อผู้ใช้ที่ระบุระบุตัวตนของเขา / เธอ localStorage ของเขา / เธอควรจะให้ในทาง คุณสามารถบอกให้ผู้ใช้จัดเก็บพื้นที่เก็บข้อมูลในเครื่องของตนเอง แต่จากนั้นพวกเขาจะต้องคัดลอกไปยังเครื่องอื่นซึ่งใช้แรงงานมากและจะไม่ได้รับความนิยม หนึ่งสามารถเรียกใช้ Javascript อันในคอนโซลของเบราว์เซอร์ของพวกเขาด้วยตนเองเพื่อให้แน่ใจว่า localStorage มีข้อมูลของพวกเขาและต้องคัดลอก localStorage Accross เครื่องเพียงง่ายกว่าการทำด้วยตนเองทั้งหมดเล็กน้อย

คุณสามารถใส่ข้อมูล localStorage ที่เข้ารหัสลงใน URL แต่นอกเหนือจากปัญหาความยาว URL ซึ่งอาจกลายเป็นปัญหาและปัญหาการเข้ารหัสที่มีอยู่ในปัจจุบันนั้น LocalStorage ทั้งหมดของคุณสามารถตรวจสอบโดยบุคคลที่สามโดยมีการเข้าถึงเราเตอร์ของคุณ ฉันรู้ว่าคุณได้กล่าวว่าข้อมูลที่ไม่ไว แต่ผมเชื่อว่าคุณว่ามันไม่ไวๆ แต่เมื่อผู้ใช้จะใช้สิ่งนี้หากสะดวกพวกเขาจะเก็บข้อมูลที่สำคัญเช่นกันหรือลูกค้าของคุณอาจมีงานดังกล่าวให้คุณหรือแม้กระทั่งคุณอาจตระหนักว่าคุณต้องจัดเก็บข้อมูลที่ไม่เปิดเผยต่อสาธารณะ 100%

นอกจากนี้ในทางปฏิบัติคุณจะเผชิญกับปัญหาการซิงโครไนซ์ที่ร้ายแรงมากนั่นคือมันเป็นเรื่องดีที่จะทำให้ผู้ไม่เชื่อเรื่องพระเจ้าท้องถิ่นจัดเก็บ แต่แล้วรุ่นที่แท้จริงคืออะไร หากคุณทำงานเป็นประจำใน 10 เซสชันที่แตกต่างกันการซิงโครไนซ์ localStorages จะกลายเป็นปัญหาที่ยาก ซึ่งหมายความว่า localStorage จะต้องมีการประทับเวลา

ดังนั้นคุณจะต้องมีสถานที่กลางเซิร์ฟเวอร์เพื่อจัดเก็บรุ่น localStorage ที่บันทึกไว้ล่าสุด หากคุณถูกเบี่ยงเบนจากฐานข้อมูลด้วยสาเหตุที่ไม่ทราบสาเหตุคุณสามารถจัดเก็บ localStorages ในไฟล์ที่ระบุผู้ใช้เช่น

johndoe.json

จากนั้นคุณจะต้องใช้คุณสมบัติการส่งออกซึ่งจะส่ง JSON ปัจจุบันของผู้ใช้ไปยังเซิร์ฟเวอร์และบันทึกลงในไฟล์และคุณลักษณะการนำเข้าที่จะดาวน์โหลดไฟล์ที่เก็บไว้สำหรับผู้ใช้และให้แน่ใจว่า localStorage ได้รับการปรับปรุง ตาม คุณสามารถทำทั้งสองอย่างร่วมกันได้เช่นกัน

มันง่ายมาก แต่จะเกิดอะไรขึ้นถ้าผู้ใช้มีข้อมูลที่เป็นประโยชน์อยู่แล้วภายในเครื่องของเขา / เธอ localStorage และบนเซิร์ฟเวอร์ด้วย? วิธีที่ง่ายที่สุดคือการแทนที่สิ่งอื่น แต่อย่างใด? หากเรากำลังนำเข้าจากนั้นโลคัลภายในจะถูกลบล้างหากส่งออกจากนั้นโลคัลบนเซิร์ฟเวอร์จะถูกลบล้างหากเราซิงโครไนซ์

อย่างไรก็ตามในบางกรณีคุณต้องการรวมสอง localStorages ของผู้ใช้เดียวกันดังนั้น:

องค์ประกอบใหม่

ฉันเชื่อว่าหากองค์ประกอบเป็นองค์ประกอบใหม่มันควรเป็นที่รู้จักในลักษณะที่สร้างขึ้นในเซสชันนี้ซึ่งมีประโยชน์ที่จะรู้เพราะนั่นหมายความว่าในอีกเซสชันที่เรารวมเข้าด้วยกันรายการใหม่นี้จะไม่ถูกลบออก และดังนั้นจึงเป็นเรื่องง่ายที่จะเพิ่ม

การเปลี่ยนแปลงองค์ประกอบ

หากองค์ประกอบเดียวกันแตกต่างกันในสองกรณีดังนั้นเวอร์ชั่นใหม่ควรเหนือกว่า

องค์ประกอบที่ถูกลบออก

กรณีที่น่าสนใจคือเมื่ออยู่ในเซสชันเดียวจะถูกลบออกและอีกกรณีหนึ่งจะได้รับการอัปเดต ในกรณีนี้ฉันคิดว่าการเปลี่ยนแปลงที่ใหม่กว่าควรเหนือกว่า

อย่างไรก็ตามแม้จะมีความพยายามอย่างเต็มที่ แต่ผู้ใช้อาจทำสิ่งต่าง ๆ (และซอฟต์แวร์ของคุณด้วย) ดังนั้นการสำรองแต่ละเซสชันบนเซิร์ฟเวอร์ของคุณจึงสมเหตุสมผล

— Lajos Arpad
แหล่งที่มา

วิธีการขยาย localStorage ข้ามอุปกรณ์ (ไม่มี DB)

ส่งออก / นำเข้าไฟล์ (JSON, XML, CSV, TSV, ฯลฯ )

URL (สตริงการสืบค้น)

ข้อมูลที่เข้ารหัส Base64

คิวอาร์โค้ด

เซิร์ฟเวอร์ HTTP (Node.js) / ที่เก็บข้อมูลบนคลาวด์ (AWS S3)

พิเศษ: PouchDB

องค์ประกอบใหม่

การเปลี่ยนแปลงองค์ประกอบ

องค์ประกอบที่ถูกลบออก