Coder Social home page Coder Social logo

cross-domain-cookie-sharing's Introduction

Cross Domain Cookie/LocalStorage Sharing using JavaScript

This will help to cross domain sharing resources like login cookies data or local storage data between two subdomain or domain.

pub-sub-pattern

Installation

Not required

Usage

Just fork code or copy reference code block and use in your html or Javascript files.

Consider we have two domain example.com and example2.com.

Step1 : Add postCrossDomainMessage function in landing page like index.html www.example.com/index.html

function postCrossDomainMessage(msg) {
  var win = document.getElementById('ifr').contentWindow;
  win.postMessage(msg, "http://example.com/");
}
var postMsg = {"login": "user"}; // this is just example
postCrossDomainMessage(postMsg);

Step2: Add iframe tag in landing page where everywhere reflected. For Angular/React you can add it in index.html

<iframe style="display:none;" src="http://example.com/getlocalstorage.html" id="ifr"></iframe>

Step3: On recipient domain www.example2.com create getlocalstorage.html file and put this code ๐Ÿ‘‡๐Ÿป in file getlocalstorage.html

var PERMITTED_DOMAIN = "http://example.com";
/**
 * Receiving message from other domain
 */
window.addEventListener('message', function(event) {
    if (event.origin === PERMITTED_DOMAIN) {
        //var msg = JSON.parse(event.data);
        // var msgKey = Object.keys(msg)[0];
        if (event.data) {
            localStorage.setItem("localstorage", event.data);
        } else {
            localStorage.removeItem("localstorage");
        }
    }

}); 

Examples

Session delivered so far

https://www.youtube.com/watch?v=4zfDyGD1Brk https://www.youtube.com/watch?v=5pJd0apGHTk

Reference Blog

https://www.internetkatta.com/share-cookies-or-local-storage-data-between-cross-domain

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

License

MIT

cross-domain-cookie-sharing's People

Contributors

avinashdalvi89 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.