{"id":16231576,"url":"https://github.com/hustcc/post-messenger","last_synced_at":"2025-03-19T14:30:39.507Z","repository":{"id":57327689,"uuid":"117488423","full_name":"hustcc/post-messenger","owner":"hustcc","description":":baby: ~1 Kb wrapper of window.postMessage for cross-document communication.","archived":false,"fork":false,"pushed_at":"2018-10-11T11:52:20.000Z","size":57,"stargazers_count":29,"open_issues_count":0,"forks_count":4,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-02-28T19:12:00.942Z","etag":null,"topics":["communication","cross-document","iframe","post-message","post-messenger","postmessage"],"latest_commit_sha":null,"homepage":"https://github.com/hustcc/post-messenger","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/hustcc.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-01-15T02:38:42.000Z","updated_at":"2024-04-30T06:51:01.000Z","dependencies_parsed_at":"2022-09-16T07:21:33.985Z","dependency_job_id":null,"html_url":"https://github.com/hustcc/post-messenger","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hustcc%2Fpost-messenger","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hustcc%2Fpost-messenger/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hustcc%2Fpost-messenger/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hustcc%2Fpost-messenger/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/hustcc","download_url":"https://codeload.github.com/hustcc/post-messenger/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243997041,"owners_count":20380980,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["communication","cross-document","iframe","post-message","post-messenger","postmessage"],"created_at":"2024-10-10T13:06:09.535Z","updated_at":"2025-03-19T14:30:39.263Z","avatar_url":"https://github.com/hustcc.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# post-messenger\n\n\u003e A simple wrapper of `window.postMessage` for cross-document communication with each other.\n\u003e\n\u003e 一个简单的 `window.postMessage` 封装，用于跨文档的双向数据通信。\n\n[![Build Status](https://travis-ci.org/hustcc/post-messenger.svg?branch=master)](https://travis-ci.org/hustcc/post-messenger)\n[![Coverage Status](https://coveralls.io/repos/github/hustcc/post-messenger/badge.svg?branch=master)](https://coveralls.io/github/hustcc/post-messenger?branch=master)\n[![npm](https://img.shields.io/npm/v/post-messenger.svg)](https://www.npmjs.com/package/post-messenger)\n[![npm](https://img.shields.io/npm/dm/post-messenger.svg)](https://www.npmjs.com/package/post-messenger)\n[![gzip](http://img.badgesize.io/https://unpkg.com/post-messenger/dist/post-messenger.min.js?compression=gzip)](https://unpkg.com/post-messenger/dist/post-messenger.min.js)\n\n\n\n## Feature\n\n - Simple wrapper for `postMessage`.\n - Use it just like `event emitter`.\n - Event channel `namespace` supported.\n\n\n\n## Install\n\n\n\u003e npm i --save post-messenger\n\nor import it by `script` in HTML, then get `PostMessenger` on window.\n\n```html\n\u003cscript src=\"https://unpkg.com/post-messenger/dist/post-messenger.min.js\"\u003e\u003c/script\u003e\n```\n\n\n\n## Usage\n\n\n - In `parent` document.\n\n```js\nimport PostMessenger from 'post-messenger';\n\n// connect to iframe\nconst pm = PostMessenger('chat', window.iframe_name.contentWindow);\n\nconst listener = message =\u003e {\n  console.log(message);\n}\n\n// listen the messages\npm.once('room1.*', listener);\n\npm.on('room1.user1', listener);\n```\n\n\n - In `iframe` document.\n\n```js\nimport PostMessenger from 'post-messenger';\n\n// connect to parent\nconst pm = PostMessenger('chat', window.parent);\n\nconst listener = message =\u003e {\n  console.log(message);\n}\n\n// send messages\npm.send('room1', 'All users of room1 will received.');\n\npm.send('*', 'broadcast message.');\n```\n\nFull example can be found [here](https://git.hust.cc/post-messenger/demo/), and code [here](demo).\n\n\n\n## API\n\n\nThere is only one function named `PostMessenger`, you can get the instance by:\n\n```js\n// projectId: the unique id of communication.\n// targetDocument: the document which you want to connect and communicate.\nconst pm = PostMessenger(projectId, targetContentWindow);\n```\n\nThe instance has 4 apis.\n\n - **pm.once(channel, listener)**\n\nAdd a message listener on channel for once.\n\n - **pm.on(channel, listener)**\n\nAdd a message listener on channel.\n\n - **pm.off([channel, listener])**\n\nRemove listener, if `channel` and `listener` are all `undefined`, remove all.\n\n - **pm.send(channel, message)**\n\nSend a message to the channel.\n\n\n\n# Scenes\n\n\u003e The `window.postMessage()` method safely enables cross-origin communication between Window objects; e.g., between a page and a pop-up that it spawned, or between a page and an iframe embedded within it.\n\nThe communicate target can be:\n\n - Window.open\n - Window.opener\n - HTMLIFrameElement.contentWindow\n - Window.parent\n - Window.frames\n\nReference [here](https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage).\n\n\n# License\n\nMIT@[hustcc](https://github.com/hustcc).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhustcc%2Fpost-messenger","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fhustcc%2Fpost-messenger","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhustcc%2Fpost-messenger/lists"}