360、chrome开发插件扩展如何跨域调用其他网站的信息并且显示在扩展、tab中的api

简介:

chrome插件提供了查找tab的api 

Js代码
  1. chrome.tabs.get(integer tabId, function callback)  


但是出于安全的考虑,tab的属性中没有document 

因此无法在扩展中直接获取某个页签页面中的页面元素 

但是tab有这样一个方法 

Js代码
  1. chrome.tabs.sendRequest(integer tabId, any request, function responseCallback)  


他可以在扩展中可以对某一个tab进行请求,发送请求信息; 
在对应的tab页面中通过 

Js代码 
  1. chrome.extension.onRequest.addListener(function(any request, MessageSender sender, function sendResponse) {...});  


对扩展中的请求进行监听,根据监听到的信息,决定要做的事情 

简单一点的,简明实例: 
一、在扩展中 添加 发送事件请求 的代码 

Js代码 
  1. chrome.tabs.sendRequest(tab_id, {  
  2.       hello: "ok"  
  3.     }, function(response) {  
  4.         // tab做出响应,发来的response  
  5. })  



二、在 tab中添加 事件监听的代码 

在manifest.json中添加 

Js代码 
  1. "content_scripts": [  
  2.   {  
  3.     "matches": ["*://*/*"],  
  4.     "js": ["jquery.min.js","test.js"]  
  5.   }  
  6. ],  
  7. "permissions": ["*://*/*","tabs"]  


其目的是在每个页签页面加载的时候同时载入这两个js,获取tabs的权限 

在test.js 中放入监听 扩展 请求事件的代码 

Js代码
  1. chrome.extension.onRequest.addListener(  
  2.   function(request, sender, sendResponse) {  
  3.     if (request.hello == "ok"){  // 在得到request请求是ok的时候 做下面的操作  
  4.       sendResponse({  
  5.         data: $("#hello"// 获取id是hello的元素发过去  
  6.       });  
  7.     }  
  8.   }  
  9.   );  



  10. 本文转自黄聪博客园博客,原文链接:http://www.cnblogs.com/huangcong/p/3534089.html,如需转载请自行联系原作者
相关文章
|
2天前
|
人工智能 机器人 API
【Python+微信】【企业微信开发入坑指北】3. 如何利用企业微信API给微信群推送消息
【Python+微信】【企业微信开发入坑指北】3. 如何利用企业微信API给微信群推送消息
4 0
|
2天前
|
缓存 人工智能 API
【Python+微信】【企业微信开发入坑指北】2. 如何利用企业微信API主动给用户发应用消息
【Python+微信】【企业微信开发入坑指北】2. 如何利用企业微信API主动给用户发应用消息
6 0
|
13天前
|
小程序 前端开发 API
小程序全栈开发中的RESTful API设计
【4月更文挑战第12天】本文探讨了小程序全栈开发中的RESTful API设计,旨在帮助开发者理解和掌握相关技术。RESTful API基于REST架构风格,利用HTTP协议进行数据交互,遵循URI、客户端-服务器架构、无状态通信、标准HTTP方法和资源表述等原则。在小程序开发中,通过资源建模、设计API接口、定义资源表述及实现接口,实现前后端高效分离,提升开发效率和代码质量。小程序前端利用微信API与后端交互,确保数据流通。掌握这些实践将优化小程序全栈开发。
|
22天前
|
前端开发 Java API
构建RESTful API:Java中的RESTful服务开发
【4月更文挑战第3天】本文介绍了在Java环境中构建RESTful API的重要性及方法。遵循REST原则,利用HTTP方法处理资源,实现CRUD操作。在Java中,常用框架如Spring MVC简化了RESTful服务开发,包括定义资源、设计表示层、实现CRUD、考虑安全性、文档和测试。通过Spring MVC示例展示了创建RESTful服务的步骤,强调了其在现代Web服务开发中的关键角色,有助于提升互操作性和用户体验。
构建RESTful API:Java中的RESTful服务开发
|
27天前
|
机器学习/深度学习 前端开发 API
实现以图搜货功能,淘宝API开发实战分享
实现以图搜货功能,淘宝API开发实战分享
24 0
|
28天前
|
安全 API 开发者
构建高效可扩展的RESTful API服务
在数字化转型的浪潮中,构建一个高效、可扩展且易于维护的后端API服务是企业竞争力的关键。本文将深入探讨如何利用现代后端技术栈实现RESTful API服务的优化,包括代码结构设计、性能调优、安全性强化以及微服务架构的应用。我们将通过实践案例分析,揭示后端开发的最佳实践,帮助开发者提升系统的响应速度和处理能力,同时确保服务的高可用性和安全。
28 3
|
1月前
|
缓存 前端开发 API
构建高效可扩展的RESTful API:后端开发的最佳实践
【2月更文挑战第30天】 在现代Web应用和服务端架构中,RESTful API已成为连接前端与后端、实现服务间通信的重要接口。本文将探讨构建一个高效且可扩展的RESTful API的关键步骤和最佳实践,包括设计原则、性能优化、安全性考虑以及错误处理机制。通过这些实践,开发者可以确保API的健壮性、易用性和未来的可维护性。
|
1月前
|
XML JSON API
通过Flask框架创建灵活的、可扩展的Web Restful API服务
通过Flask框架创建灵活的、可扩展的Web Restful API服务
|
Web App开发 API 网络架构
chrome插件API协议(Extensions Context Menu API Proposal)
Extensions Context Menu API Proposal NOTE: This document is now out of date. The API evolved some while behind the experimental flag, and is becoming fully supported in chrome 6.
1192 0

热门文章

最新文章