Chrome扩展程序使用侧边栏 [英] Chrome extension using sidebar

查看:916
本文介绍了Chrome扩展程序使用侧边栏的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我一直在浏览Chrome扩展程序,我想创建一个使用侧边栏与网页交互的扩展程序。所以,用户点击按钮启动扩展,当前页面分裂,右边部分显示我的扩展名。我在下面尝试,但我什么都看不到(工作或其他)。我并不太惊讶它不起作用,因为我没有一个sidebar.html文件。我在清单中的理由是因为我在本网站的另一篇文章中看到了它。有人建议使用manifest.json中的侧边栏行,但在文档中甚至没有提到侧栏作为清单语法的有效部分。



manifest.json:

  {
name:Test 1,
版本:1.0,
description:Test Extension 1,
page_action:{
default_icon:icon.png,
default_title :Testing,
default_popup:popup.html
},
sidebar:{},
permissions:[
[b




popup.html:

 < script> 
chrome.experimental.sidebar.show();
chrome.experimental.sidebar.expand();
chrome.experimental.sidebar.navigate({path:sidebar.html});
< / script>

我已启用'experimental'。



感谢您的任何帮助。

解决方案

问题在于,您打开理论上的弹出窗口中的侧边栏,而不是当前页面。

您应该在页面中添加一个内容脚本,并带有一个可打开侧边栏的功能。所以,在你的弹出窗口中,你应该检索当前标签,然后调用它。

未来版本中停用。因此,我建议您通过内容脚本创建自己的边栏框。






更新 h2>

为了帮助您,我做了一个简单的扩展,在当前页面上创建一个侧边栏。



代码是完全煽情,你可以在这里下载它。






更新2



@ Curtis 已对此扩展示例进行了更新。



您可以克隆它 from github


I've been having a look at Chrome extensions and I'd like to create an extension that interacts with a web page using a sidebar. So, user clicks button to launch extension, and the current page splits, with the right hand portion displaying my extension. I tried below, but I see nothing (working or otherwise). I'm not overly surprised it's not working as I do not have a sidebar.html file for one thing. The reason I have that in the manifest is because I saw it in another post in this site. The suggestion there was to use the "sidebar" line in manifest.json, but "sidebar" isn't even mentioned in the documentation as being a valid part of the manifest syntax.

manifest.json:

{
  "name": "Test 1",
  "version": "1.0",
  "description": "Test Extension 1",
  "page_action": {
    "default_icon": "icon.png",
    "default_title": "Testing",
    "default_popup": "popup.html"
   },
  "sidebar" : {},
  "permissions": [
    "experimental"
  ]
}

popup.html:

<script>
  chrome.experimental.sidebar.show();
  chrome.experimental.sidebar.expand();
  chrome.experimental.sidebar.navigate({path: "sidebar.html"});
</script>

I've enabled 'experimental'.

Thanks for any help.

解决方案

The problem is that you are opening, theoretically, the sidebar inside your popup, not in the current page.

You should add a content script in the page, with a function that opens the sidebar. So, in your popup you should just retrieve the current tab then call this function from it.

Also, as Boris Smus said in your question, sidebars will be discontinued in future versions. So I advice you to create your own sidebar frame via content scripts.


Update

To help you, I've made a simple extension that create a sidebar on current page.

The code is fully comented and you can download it here.


Update 2

@Curtis has made an updated version of this sample extension.

You can clone it from github.

这篇关于Chrome扩展程序使用侧边栏的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆