Question

我正在尝试编写一个“Chrome应用”（不是Chrome扩展程序，而是一个可以在自助服务终端模式下运行的应用），它基本上只打开一个显示网页的全屏浏览器。

此应用需要一些配置信息，例如该网页的URL应该由管理员设置。

我希望通过指定选项页面来解决这个问题。但似乎这是不可能的，故意：cf。例如How do I handle options in a packaged Chrome App?。
那里描述的解决方案对我不起作用有两个原因：

我的网页已经使用了上下文菜单/右键单击（它实际上是为了防止错误而被禁用）
只有管理员才能更改设置（想想酒店环境）

我如何实现这一目标？

我无法做任何花哨的事情，因为管理员很可能不是IT专家。他会通过简单的步骤来设置设备，就是这样。所有主要的配置/设置信息都来自中央服务器 - 但必须首先设置该服务器的URL ...

Answer 1

您可能希望使用键盘组合，按下该组合键时，会在菜单上显示登录门以设置网址和密码。您可能还希望在设置期间自动显示锁定的菜单，此时尚未设置网址。

您需要使用chrome.storage api永久存储密码和网址。

的manifest.json：

"permissions": [ "storage" ]

您可以使用chrome.commands api处理键盘快捷键。

的manifest.json：

"commands": {
 "adminmenu": {
  "suggested_key": { "default": "Alt+A" },
  "description": "Show admin menu"
} }

main.js：

chrome.commands.onCommand.addListener(showadmin)

您可以使用dialog element处理菜单和密码门。

main.html中：

<dialog id="adminpassword">
 Admin options. Press alt a to reopen.
 <br><br>
 Admin password: <input type="text" id="enterpassword">
 <br><br>
 <button id="close">Close</button>
 <button id="unlock" style="float: right">Unlock</button>
</dialog>
<dialog id="adminoptions">
 Admin options. Press alt a to reopen.
 <br><br>
 New password: <input type="text" id="newpassword">
 <br><br>
 Site url: <input type="text" id="newurl">
 <br><br>
 <button id="close">Close</button>
 <button id="save" style="float: right">Save</button>
</dialog>

输入正确的密码并单击解锁按钮，打开管理选项。单击关闭按钮时关闭对话框。单击保存按钮时保存更新的值。

main.js：

var passworddialog = document.querySelector("#adminpassword")
var admindialog = document.querySelector("#adminoptions")
var closepassword = passworddialog.querySelector("#close")
var closeadmin = admindialog.querySelector("#close")
var unlockadmin = passworddialog.querySelector("#unlock")
var saveoptions = admindialog.querySelector("#save")
var enterpassword = passworddialog.querySelector("#enterpassword")
var newpassword = admindialog.querySelector("#newpassword")
var newurl = admindialog.querySelector("#newurl")

function showadmin() {
 passworddialog.showModal()
}

closepassword.addEventListener("click", function() {
 passworddialog.close()
})
closeadmin.addEventListener("click", function() {
 admindialog.close()
})

unlockadmin.addEventListener("click", function() {
 chrome.storage.local.get("password", function(storage) {
  passworddialog.close()
  if(enterpassword.value == storage.password) {
   admindialog.showModal()
} }) })

saveoptions.addEventListener("click", function() {
 chrome.storage.local.set({ password: newpassword.value, url: newurl.value })
})

加载时，设置默认密码（如果未定义）并打开登录菜单。否则，请填充管理选项对话框。

main.js：

chrome.storage.local.get(function(storage) {
 if(storage.password) {
  newpassword.value = storage.password
 } else {
  chrome.storage.local.set({ password: "admin" })
 }
 if(storage.url) {
  newurl.value = storage.url
 } else {
  showadmin()
} })

用于自助服务终端模式的Chrome打包应用的选项页面

1 个答案: