https://github.com/kumavis/iframe-stream/blob/master/test/rebundle.js

iframe-stream-其实就是将iframe打包成流

Create a stream around an iframe via post-message-stream

const IframeStream = require('iframe-stream').IframeStream

var iframe = createIframe()
var iframeStream = IframeStream(iframe)

Note

  • Setup the stream immediately, so we don't miss the iframe's load event.
  • The IframeStream will buffer all input until the childstream is ready.
  • This is an object stream, and buffers will not be handled gracefully.

Example

Here is an example using dnode to create a callback based API with a javascript context inside an iframe.

Parent:

const IframeStream = require('iframe-stream').IframeStream
const Dnode = require('dnode') var iframe = createIframe()
var iframeStream = IframeStream(iframe)
var dnode = Dnode()
dnode.on('remote', function(child){
child.doAsyncSomething(function(){
console.log('child finished doing the thing!')
})
}) dnode.pipe(iframeStream).pipe(dnode)

Child:

const ParentStream = require('iframe-stream').ParentStream
const Dnode = require('dnode') var parentStream = ParentStream(iframe)
var dnode = Dnode({
doAsyncSomething: function (cb) {
console.log('doing something async...')
cb()
}
}) dnode.pipe(parentStream).pipe(dnode)
 
源码实现:
var PostMessageStream = require('post-message-stream')

/*
IframeStream starts corked until it gets a message from the iframe
ParentStream starts uncorked
*/ module.exports = {
IframeStream: IframeStream,
ParentStream: ParentStream,
} function IframeStream(iframe) {
if (this instanceof IframeStream) throw Error('IframeStream - Dont construct via the "new" keyword.')
return new PostMessageStream({
name: 'iframe-parent',
target: 'iframe-child',
targetWindow: iframe.contentWindow,
})
} //
// Parent Stream
// function ParentStream() {
if (this instanceof ParentStream) throw Error('ParentStream - Dont construct via the "new" keyword.')
return new PostMessageStream({
name: 'iframe-child',
target: 'iframe-parent',
targetWindow: frames.parent,
})
}
 
下面实例实现:
先将插件安装下来:
npm install iframe --save
npm install iframe-stream --save
npm install dnode --save
 
index.js
const test = require('tape')
const Iframe = require('iframe')
const from = require('from')
const pipe = require('mississippi').pipe
const IframeStream = require('../').IframeStream
const rebundle = require('./rebundle')
const htmlWrap = require('./htmlWrap')
const iframeContent = htmlWrap(rebundle(require('./frame'))) // setup iframe
var iframe = Iframe({
body: iframeContent,
container: document.body,
}).iframe
var iframeStream = IframeStream(iframe) test(function(t) {
var data = [, , , , , , , , ] t.plan(data.length) pipe(
from(data),
iframeStream
) // create a test for each datum
// this is because these streams never close
eachOutput(iframeStream, data.map(function(datum){
return function onResult(result){ t.equal(result, datum * , 'datum was doubled correctly') }
}), function onDone(){
t.end()
}) }) function eachOutput(stream, handlers, cb) {
var index =
if (!handlers.length) return cb()
stream.once('data', handleChunk)
function handleChunk(data){
var fn = handlers[index]
fn(data)
index++
if (!handlers[index]) return cb()
stream.once('data', handleChunk)
}
}

htmlWrap.js

module.exports = htmlWrap

function htmlWrap(src){
return '<'+'script type="text/javascript"'+'>'+src+'<'+'/script'+'>'
}

rebundle.js

//
// Extraced from WebWorkify
// https://github.com/substack/webworkify/blob/master/index.js
// var bundleFn = arguments[];
var sources = arguments[];
var cache = arguments[]; var stringify = JSON.stringify; module.exports = function (fn, options) {
var wkey;
var cacheKeys = Object.keys(cache); for (var i = , l = cacheKeys.length; i < l; i++) {
var key = cacheKeys[i];
var exp = cache[key].exports;
// Using babel as a transpiler to use esmodule, the export will always
// be an object with the default export as a property of it. To ensure
// the existing api and babel esmodule exports are both supported we
// check for both
if (exp === fn || exp && exp.default === fn) {
wkey = key;
break;
}
} if (!wkey) {
wkey = Math.floor(Math.pow(, ) * Math.random()).toString();
var wcache = {};
for (var i = , l = cacheKeys.length; i < l; i++) {
var key = cacheKeys[i];
wcache[key] = key;
}
sources[wkey] = [
Function(['require','module','exports'], '(' + fn + ')(self)'),
wcache
];
}
var skey = Math.floor(Math.pow(, ) * Math.random()).toString(); var scache = {}; scache[wkey] = wkey;
sources[skey] = [
Function(['require'], (
// try to call default if defined to also support babel esmodule
// exports
'var f = require(' + stringify(wkey) + ');' +
'(f.default ? f.default : f)(self);'
)),
scache
]; var workerSources = {};
resolveSources(skey); function resolveSources(key) {
workerSources[key] = true; for (var depPath in sources[key][]) {
var depKey = sources[key][][depPath];
if (!workerSources[depKey]) {
resolveSources(depKey);
}
}
} var src = '(' + bundleFn + ')({'
+ Object.keys(workerSources).map(function (key) {
return stringify(key) + ':['
+ sources[key][]
+ ',' + stringify(sources[key][]) + ']'
;
}).join(',')
+ '},{},[' + stringify(skey) + '])'
; return src
}

frame.js

const BrowserStdout = require('browser-stdout')
const ParentStream = require('../index.js').ParentStream
const transform = require('mississippi').through
const pipe = require('mississippi').pipe module.exports = setupStream setupStream() function setupStream(opts) {
var iframeStream = ParentStream()
pipe(
iframeStream,
transform({ objectMode: true }, doubleIt),
iframeStream
)
} function doubleIt(chunk, encoding, cb){
cb(null, chunk * )
}

上面的例子是iframe-stream作者写的一个测试test

metamask-iframe-stream,没成功的更多相关文章

  1. LODOP判断没成功发送任务-重打一下

    一般情况下打印执行了PRINT()或PRINTA(),就会加入打印机队列,如果打印机脱机,就会在队列里排队,当打印机连上并取消脱机的时候,正在排队的任务就会打出,所以一般建议用是否加入队列来判断打印成 ...

  2. 宝塔https部署没成功的原因排查

    今天ytkah在迁移一个客户网站的时候出了点问题,网站从旧的服务器(windows)换到新的服务器(阿里云centos 7,已经安装了宝塔面板),网站之前有用comodo的ssl证书,因为快要过期了, ...

  3. Running a Remote Desktop on a Windows Azure Linux VM (远程桌面到Windows Azure Linux )-摘自网络(试了,没成功 - -!)

                              A complete click-by-click, step-by-step video of this article is available ...

  4. [archlinux][plasma][screensaver] plasma5配置屏保程序,没成功(-_-#)

    plamsa用了好久,一直没有屏保.我想要玄酷的屏保! 用xscreensaver, 之前用FVWM2的时候,就用过了,很玄酷. 一,安装 pacman -S xscreensaver 二,配置 xs ...

  5. Ubuntu 16.04安装Mac OS 12虚拟机资源(没成功,但资源还是可以用)

    整理的Mac OS 12虚拟机资源.装虚拟机基本是按这样的套路: 1.先装VM 2.破解VM使其支持Mac OS 12,这个脚本基本是全平台支持,可以看里面的教程文档. 3.用镜像安装系统. 资源: ...

  6. MetaMask/zero-client

    https://github.com/MetaMask/zero-client MetaMask ZeroClient and backing iframe service architecture ...

  7. iframe高度自动随着子页面的高度变化而变化(不止要在iframe标签里加上this.height=this.contentWindow.document.body.scrollHeight)

    最近使用iframe整合页面遇到一些难题,走了很多弯路才解决,借此记录一下: 1 <!-- 页面主体内容 --> 2 <div class="iframe-wrapper& ...

  8. 原生XMLHTTPResponse,jQuery-Ajax 上传文件;iframe上传图片&预览;图片验证码小案例

    原生AJAX Ajax主要就是使用 [XmlHttpRequest]对象来完成请求的操作,该对象在主流浏览器中均存在(除早起的IE),Ajax首次出现IE5.5中存在(ActiveX控件) 1.Xml ...

  9. iframe编程的一些问题

    前几天做一个用iframe显示曲线图的demo,发现对iframe的contentDocument绑定 onclick事件都无效,而在页面中对iframe.contentDocument的onclic ...

随机推荐

  1. [日常] Linux下vim的常用命令总结

    vim按d表示剪切按dd剪切一行vim命令:命令模式 /关键字 n继续向下查找 vim的多行注释:1.按ctrl + v进入 visual block模式2.按上下选中要注释的行3.按大写字母I,再插 ...

  2. [javaSE] 看知乎学习工厂模式

    factory的“本质”就是根据不同的输入创建出不同类型的对象. 引入factory的原因就是你需要根据不同的输入创建不同类型的对象. 简单工厂模式相当于是一个工厂中有各种产品,创建在一个类中,客户无 ...

  3. 在JAVA中封装JSONUtil工具类及使用

    在JAVA中用json-lib-2.3-jdk15.jar包中提供了JSONObject和JSONArray基类,用于JSON的序列化和反序列化的操作.但是我们更习惯将其进一步封装,达到更好的重用. ...

  4. HDU1074(KB12-D 状态压缩dp)

    Doing Homework Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)To ...

  5. 微信小程序 发现之旅(二)—— 自定义组件

    组件化的项目开发中,组件应当划分为三个层次:组件.模块.页面 微信小程序已经为开发者封装好了基础组件,页面文件(pages)也有了详细的规定 而模块就需要自行开发,并且要和页面文件区分开,这就涉及到自 ...

  6. Python os、sys、pickle、json等模块

    1.os 所有和操作系统相关的内容都在os模块,一般用来操作文件系统 import os os.makedirs('dirname1/dirname2') # 可生成多层递归目录 os.removed ...

  7. JavaScript小细节点罗列(2)

    break 语句和 continue 语句 break语句和continue语句都具有跳转作用,可以让代码不按既有的顺序执行. break语句用于跳出代码块或循环. var i = 0; while( ...

  8. css3 之 display 属性

    1.定义 语法:display:none | inline | block | list-item | inline-block | table | inline-table | table-capt ...

  9. iOS设备上出现的click,live,on点击失去效果

    iOS设备上出现的点击事件失效,但是在Android上可以正常使用, 1.iOS设备对标签点击限制,不认为是可点击的标签,需要给要绑定点击事件的标签加上一个样式,cursor:pointer:这样就可 ...

  10. 使用kafka consumer api时,中文乱码问题

    使用Intelli idea调试kafka low consumer时,由于broker存储的message有中文, idea中console端是可以正确显示的 然后mvn package打包到服务器 ...