Chrome扩展程序弹出窗口不再显示

编程入门 行业动态 更新时间:2024-10-28 02:26:09
本文介绍了Chrome扩展程序弹出窗口不再显示的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧! 问题描述

我正在创建一个新的Chrome扩展程序,一切都很好。但是,今天我编写了一个新的函数,然后我看到我的扩展图标是灰色的。当我点击图标时,弹出窗口不会显示。 一个有趣的观点是扩展正在运行。没有错误日志。

I'm creating a new Chrome extension and everything was fine. However, today I was coding a new func, then I saw that my extension icon was grayed. And when I click on the icon, the popup isn't shown. One interesting point is that the extension is working. No error logs.

我评论了我写的所有代码,但没有效果。如果我直接在Chrome上打开链接,则会打开一个新标签,正常显示弹出窗口。 [chrome-extension://extensionId/popup.html]

I commented all the code I wrote, but had no effect. If I open the link directly on the Chrome, it open a new tab showing the popup normally. [chrome-extension://extensionId/popup.html]

我的清单看起来还不错,popup.html / js也是如此。我真的不知道发生了什么。有任何想法吗?谢谢!

My manifest looks ok and the popup.html/js too. I really don't know what happened. Any ideas? Thanks!

Manifest.json

{ "name": "Say It", "version": "0.0.1", "manifest_version": 2, "description": "__MSG_appDescription__", "icons": { "16": "images/icon-16.png", "128": "images/icon-128.png" }, "default_locale": "en", "background": { "scripts": [ "scripts/chromereload.js", "scripts/background.js" ] }, "permissions": [ "tabs", "*/*", "*/*", "background", "bookmarks", "clipboardRead", "clipboardWrite", "contentSettings", "cookies", "*://*.google/", "debugger", "history", "idle", "management", "notifications", "pageCapture", "topSites", "storage", "webNavigation", "webRequest", "webRequestBlocking", "nativeMessaging" ], "options_ui": { "page": "options.html", "chrome_style": true }, "content_scripts": [ { "matches": [ "*/*", "*/*" ], "js": [ "scripts/contentscript.js" ], "run_at": "document_end", "all_frames": false } ], "omnibox": { "keyword": "OMNIBOX-KEYWORD" }, "page_action": { "default_icon": { "19": "images/icon-19.png", "38": "images/icon-38.png" }, "default_title": "Say It", "default_popup": "popup.html" }, "web_accessible_resources": [ "images/icon-48.png" ] }

Popup.html

<!DOCTYPE html> <html ng-app="app"> <head> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="styles/main.css"> <link rel="stylesheet" type="text/css" href="bower_components/bootstrap/dist/css/bootstrap.min.css"> </head> <body ng-controller="mainController as ctrl"> <h4>Choose your Destiny!</h4> <button class="btn btn-large btn-primary" ng-click="ctrl.kappa()">Kappa</button> <button class="btn btn-large btn-secondary" ng-click="ctrl.pride()">Pride</button> <button class="btn btn-large btn-success" ng-click="ctrl.fon()">Fon</button> <script type="text/javascript" src="bower_components/jquery/dist/jquery.min.js"></script> <script type="text/javascript" src="bower_components/angular/angular.min.js"></script> <script type="text/javascript" src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script> <script type="text/javascript" src="main.js"></script> <script type="text/javascript" src="scripts/popup.js"></script> </body> </html>

Popup.js

(function () { 'use strict'; angular.module('app').controller('mainController', function () { var self = this; //Por localStorage console.log(localStorage.getItem('kappa')); //Por API chrome.storage.local.get('value', function (res) { console.log(res); }); this.kappa = function () { console.log('Seu Kappa!'); }; this.pride = function () { console.log('Seu KappaPride!'); }; this.fon = function () { console.log('Fon!'); }; }); })();

推荐答案

在 manifest.json 替换page_action(仅适用于特定页面)browser_action(其中适用于所有这些)。

In manifest.json replace "page_action" (which only works on specific pages) with "browser_action" (which works on all of them).

更多推荐

Chrome扩展程序弹出窗口不再显示

本文发布于:2023-08-06 05:17:09,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1310287.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:弹出窗口   程序   Chrome

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!