在 Chrome 扩展中使用 DDP
Using DDP in a Chrome extension
在我正在构建的 Chrome 扩展中,我想从扩展弹出窗口 window 连接到 Meteor 服务器,用于用户注册、登录和
我从 2014 年的 Meteor Spotting 中找到了一个简短的解释,表明可以使用 ddp.js 来做到这一点,但它描述的项目似乎已经消失了。
ddp.js 的当前版本使用 import
语句,Chrome 反对。我的理解是这些脚本是为 Node.js 设计的。我应该如何编辑这些脚本,以便它们可以在 Chrome 扩展中使用,如 Meteor Spotting 文章中所述?
或者,是否有任何通过 DPP 连接到基本 Meteor 服务器的基本 Chrome 扩展示例,我可以从中获得灵感?
我找到了自己的解决方案。这是从 Chrome 扩展调用 Meteor 服务器的基本实现:
manifest.json
{
"manifest_version": 2
, "name": "DDP Test"
, "version": "0.1"
, "background": {
"scripts": [
"jquery-3.1.0.js"
, "meteor-ddp.js"
, "meteor.js"
, "background.js"
]
}
}
jquery-3.1.0.js可以找到here
eddfirs meteor-ddp.js 可以找到 here
meteor.js(改编自Meteor Spotting)
var Meteor
;(function meteor(){
"use strict"
var endpoint = "ws://localhost:3000/websocket"
// Use your own endpoint ^^^
Meteor = {
call : function(){
var args = [].slice.call(arguments)
var methodName = args.shift()
var callback = args.pop()
var ddp = new MeteorDdp(endpoint)
if (!(callback instanceof Function)) {
args.push(callback)
callback = function (error, data) {
console.log("Result of "+methodName+" call:", error, data)
}
}
ddp.connect().done(MeteorCall)
function MeteorCall() {
console.log('Connected!');
var $deferred = ddp.call(methodName, args)
$deferred.done(function (result) {
callback(null, result)
})
$deferred.fail(function (error) {
callback(error)
})
}
}
};
})()
background.js
;(function background(){
"use strict"
Meteor.call("test", 1, "two", { three: [4]})
Meteor.call("test", "using", "a", "custom", callback)
function callback(error, result) {
console.log("Custom callback error:", error, ", Result:", result)
}
})()
加载扩展时服务器控制台的输出:
I20160917-19:35:19.352(-4)? test 1 two { three: [ 4 ] }
I20160917-19:35:19.377(-4)? test using a custom
Inspector 中背景视图的输出:
Connected!
meteor.js:18 Result of test call: null test method activated with arguments {"0":1,"1":"two","2":{"three":[4]}}
meteor.js:25 Connected!
background.js:8 Custom callback error: null , Result: test method activated with arguments {"0":"using","1":"a","2":"custom"}
在我正在构建的 Chrome 扩展中,我想从扩展弹出窗口 window 连接到 Meteor 服务器,用于用户注册、登录和
我从 2014 年的 Meteor Spotting 中找到了一个简短的解释,表明可以使用 ddp.js 来做到这一点,但它描述的项目似乎已经消失了。
ddp.js 的当前版本使用 import
语句,Chrome 反对。我的理解是这些脚本是为 Node.js 设计的。我应该如何编辑这些脚本,以便它们可以在 Chrome 扩展中使用,如 Meteor Spotting 文章中所述?
或者,是否有任何通过 DPP 连接到基本 Meteor 服务器的基本 Chrome 扩展示例,我可以从中获得灵感?
我找到了自己的解决方案。这是从 Chrome 扩展调用 Meteor 服务器的基本实现:
manifest.json { "manifest_version": 2
, "name": "DDP Test"
, "version": "0.1"
, "background": {
"scripts": [
"jquery-3.1.0.js"
, "meteor-ddp.js"
, "meteor.js"
, "background.js"
]
}
}
jquery-3.1.0.js可以找到here
eddfirs meteor-ddp.js 可以找到 here
meteor.js(改编自Meteor Spotting)
var Meteor
;(function meteor(){
"use strict"
var endpoint = "ws://localhost:3000/websocket"
// Use your own endpoint ^^^
Meteor = {
call : function(){
var args = [].slice.call(arguments)
var methodName = args.shift()
var callback = args.pop()
var ddp = new MeteorDdp(endpoint)
if (!(callback instanceof Function)) {
args.push(callback)
callback = function (error, data) {
console.log("Result of "+methodName+" call:", error, data)
}
}
ddp.connect().done(MeteorCall)
function MeteorCall() {
console.log('Connected!');
var $deferred = ddp.call(methodName, args)
$deferred.done(function (result) {
callback(null, result)
})
$deferred.fail(function (error) {
callback(error)
})
}
}
};
})()
background.js
;(function background(){
"use strict"
Meteor.call("test", 1, "two", { three: [4]})
Meteor.call("test", "using", "a", "custom", callback)
function callback(error, result) {
console.log("Custom callback error:", error, ", Result:", result)
}
})()
加载扩展时服务器控制台的输出:
I20160917-19:35:19.352(-4)? test 1 two { three: [ 4 ] }
I20160917-19:35:19.377(-4)? test using a custom
Inspector 中背景视图的输出:
Connected!
meteor.js:18 Result of test call: null test method activated with arguments {"0":1,"1":"two","2":{"three":[4]}}
meteor.js:25 Connected!
background.js:8 Custom callback error: null , Result: test method activated with arguments {"0":"using","1":"a","2":"custom"}