worker-request-message v0.0.5

WorkerMessage

使用Promise为Worker，iframe，New tab Window 的 postMessage包装。 使postMessage变得容易；

demo 请查看 Console 输出

install

npm install worker-request-message

WebWorker

index.html

<script type="module">
    import WorkerMessage from "../index.js";

    const worker = new Worker("./worker.js");//,{type:'module'}

    const message = new WorkerMessage(worker);
    message.onRequestMessage = function (message, resolve, reject) {
        resolve(message + "; main response")
    }

    message.requestMessage("to worker").then((e) => {
        console.log(e)
    }).catch((e) => {
        console.error(e)
    })
</script>

worker.js

//WebWorker
importScripts("../index.inworker.js")
const message = new WorkerMessage(self);

message.onRequestMessage = function (message, resolve, reject) {
    resolve(message + "; worker response")
}

message.requestMessage("to main").then((e) => {
    console.log(e)
}).catch((e) => {
    console.error(e)
})

iframe

index.html

<iframe src="./inner.html" id="innerIframe"></iframe>
<script type="module">
    import WorkerMessage from "../index.js";

    innerIframe.addEventListener("load", (e) => {
        const message = new WorkerMessage(innerIframe.contentWindow);
        message.onRequestMessage = function (message, resolve, reject) {
            resolve(message + "; parent response")
        }

        message.requestMessage("to iframe").then((e) => {
            console.log(e)
        }).catch((e) => {
            console.error(e)
        })
    }, false)
</script>

inner.html

<script type="module">
    import WorkerMessage from "../index.js";

    const message = new WorkerMessage(self);
    message.onRequestMessage = function (message, resolve, reject) {
        resolve(message + "; iframe response")
    }

    message.requestMessage("to parent").then((e) => {
        console.log(e)
    }).catch((e) => {
        console.error(e)
    })
</script>

API

methods

events