chrome插件中遇到的坑(一)_weixin_30753873的博客-程序员秘密

技术标签: ui  runtime  

简单说,懂chrome插件开发的人都知道,chrome插件主要有三层(姑且这么称谓)。这三层经纬可谓明确,可以从功能和权限的角度去理解他们:

1、background层,chrome插件底层,控制整个chrome插件的大脑,具有最高权限;

2、content层,content-script脚本工作平台,本质上是chrome插件脚本注入层,权限最低只能影响页面DOM,不能跨域操作,但是可以通过chrome.runtime.sendMessage与background层交互;

3、popup/option层,UI交互层,权限中等,可以直接使用background的实例对象,也可以通过消息与content层交互。

 

实际开发中,经常会遇到在content层获取数据,提交到后台server的情况,后台server与content页面存在跨域问题。

chrome插件中解决跨域问题是比较简单,当然,可以直接在content脚本中使用jsonp的方式跨域,也可以将需要提交的数据发送给background层,由background提交后台服务。

我采取的方式是后者,通过消息与background通信,坑儿也是在发送消息的时候碰到的。

发送消息:

chrome.runtime.sendMessage({data: "hello world!"}, function(response) {
  console.log(response);
});

坑儿:总是报错Uncaught Error: chrome.runtime.connect() called from a webpage must specify an Extension ID (string) for its first argument

后来,通过测试发现是我调用chrome.runtime.sendMessage的时机问题,不要在content脚本注入的时候就调用该函数,换句话说就是:要在页面加载完毕时调用该方法:

$(function(){

  chrome.runtime.sendMessage({data: "hello world!"}, function(response) {
    console.log(response);
  });

});

 

这是搞原型测试时,发现的坑,一些函数的调用(时机)没有结合业务,所以,实际结合业务开发中可能自然就越过了该坑儿,但是,还是留个印记吧。

 

转载于:https://www.cnblogs.com/mythings/p/5941751.html

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/weixin_30753873/article/details/96346366

智能推荐

Bayes’s formula for Conditional Probability_anyi6536的博客-程序员秘密

Conditional ProbabilityExample:In a batch, there are 80% C programmers, and 40% are Java and C programmers. What is the probability that a C programmer is also Java programmer?Let A --> Ev...

cdq分治(bzoj 1176: [Balkan2007]Mokia && bzoj 2683: 简单题)_Jaihk662的博客-程序员秘密

CDQ分治:本质:对询问进行分治优点:和莫队分块一样都属于技巧,关键时刻能免去复杂的数据结构,常数小缺点:必须离线

Tips on Probability Theory_weixin_30892037的博客-程序员秘密

1、独立与不相关随机变量X和Y相互独立,有:E(XY) = E(X)E(Y)。独立一定不相关,不相关不一定独立(高斯过程里二者等价) 。对于均值为零的高斯随机变量,“独立”和“不相关”等价的。独立性是指两个变量的发生概率一点关系没有,而相关性通常是指线性关系。如果两个变量不相关,指的是线性关系里不相关,但是不能说它们没有关系,可能是线性以外的其他关系。2、中心极限定理和强...

Probabilistic Models_partition covariance_拉普拉斯的汪的博客-程序员秘密

Reference:Bishop C M. Pattern recognition and machine learning[M]. springer, 2006.Slides of CS4220, TUDContentBayesian InferenceBayes’ Theorem for Gaussian Variables (2.3.1-2.3.3)Conditional Gaussian distributionsMarginal Gaussian distributionsPartition

逆向工程--苹果移动端app逆向分析技术(一)_ios查壳_5t4rk的博客-程序员秘密

0x01 IOS逆向基础关于iphone移动端app逆向程序相关基础知识。学习之前呢,大家先搭建系统环境,准备些工具。参考链接教程自行搭建和安装。1 macOS安装vmware workstation 12.0 安装macOS 操作系统。https://jingyan.baidu.com/article/54b6b9c0ec0a1b2d593b4745.html2 XCODE安

智能客服FAQ知识点挖掘一般方法_Ted_Li的博客-程序员秘密

一般来说,智能客服有3个功能实现:QABot,TaskBot,ChatBot。其中QAbot中包括FAQ,KBQA。这里我来谈一下FAQ中知识点的一般方法吧。一般来说,最开始产品经理会结合业务知识和经验,人工的总结出一些常见的标准问题和答案对,同时会做一些问句改写的工作。一般来说,一个标准问会写个3-5个相似问法,Q-Q paire是业内的通用做法,至于为什么这么做,请参考https://...

随便推点

组合和聚合举例说明_聚合关系和组合关系示例_航知道的博客-程序员秘密

合成关系分为 聚合(aggregation) 关系和组合(composition) 关系, 在大部书中都讲得很抽像模糊。按我理解,这两种合成方式在代码中的表现应如下:typeTOperate = class(TObject);TAnyObjects = class(TObject)publicconstructor Create(AOwner: TComponent); override;dest...

02、Java的lambda表达式和JavaScript的箭头函数_asd7782292的博客-程序员秘密

前言在JDK8和ES6的语言发展中,在Java的lambda表达式和JavaScript的箭头函数这两者有着千丝万缕的联系;本次试图通过这篇文章弄懂上面的两个“语法糖”。简介Lambda 表达式来源于 C# 5.0,但又不太确定,于是查了下 百度百科:Lambda表达式,仍然没有得到明确的答案,所以懒得去纠结这个问题了。箭头函数(arrow function),就是C#中...

Python基础与大数据应用实验——水仙花数_打印水仙花实验报告_椅糖的博客-程序员秘密

一、实验内容水仙花数(Narcissistic Number)也被称为超完全数字不变数、自恋数、自幂数、阿姆斯壮数或阿姆斯特朗数。水仙花数是指一个3位数,它的每个位上数字的3次幂之和等于它本身。二、实验目的编写一个函数,用来判断一个三位的的整数是否是水仙花数。三、实验环境PyCharm Community Edition 2021.2.2四、实验结果1、编写程序#水仙花数模块num = int(input ("请输入一个三位数:"))a = num % 10b =

《剑指offer---面试题20:表示数值的字符串》_柳丁橙的博客-程序员秘密

《剑指offer—面试题20:表示数值的字符串》 注明:仅个人学习笔记public class Solution {//数组下标,这里定义为成员变量,方便各函数调用修改int index;public boolean isNumeric(char[] str) { /** //解法一:正则表达式 String s=String.valueOf(str);...

hdoj 1114 Piggy-Bank(完全背包+dp)_aqjh9999的博客-程序员秘密

题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1114思路分析:该问题要求为多重背包问题,使用多重背包的解法即可;假设dp[v]表示容量为v的背包中能够装下的最少的价值,因为一件物品可以装无限数次,所以可以得到递推公式: dp[v] = Min(dp[v], dp[v- c[i]] + w[i]);代码如下:impor...