HTML瞬态模态窗口 [英] HTML transient modal window

问题描述

我们有一个遗留的Web应用程序。在不同的地方，它会在Firefox的权限管理器的帮助下打开一个窗口，以获得所需的结果。
其中一些窗口打开一个Java小程序或一个PDF文档。
客户端机器正在更新Firefox，并且Privilege Manager已不存在。

最简单的方法是什么？
问题是：

1. 任何时候只能有一个弹出窗口的实例。这可以通过在 window.open（）调用上选择合适的窗口名称来完成。

如果窗口再次打开（通过用户操作），它不应该重新加载，而只是集中把它带到前台（我已经看到我可以保持对JavaScript的窗口的引用来做到这一点） >

2. 它基本上必须是临时的/模态的，这样客户端才能不离开当前页面，重新加载或者与父窗口进行任何其他类型的交互（除了打开/重新调整子窗口）首先窗口。我不知道如何做到这一点。

有没有人有一个想法如何做到这一点？

在Linux上，客户端只有Firefox（它在特殊的信息亭配置中工作）。

我可以以某种方式写一个扩展名，但我基本上无法知道扩展和API。 （简体）遗留代码的例子。（b）b

Edit1：不确定是否需要所有的权限，但这是它：这个函数打开一个窗口，保持在父窗口，并阻止用户与父窗口的任何交互。

  function fWindowOpen（url，name）{
 netscape.security.PrivilegeManager.enablePrivilege（UniversalBrowserRead）; 
 netscape.security.PrivilegeManager.enablePrivilege（UniversalBrowserWrite）; 
 netscape.security.PrivilegeManager 
 .enablePrivilege（CapabilityPreferencesAccess）; 
 netscape.security.PrivilegeManager 
 .enablePrivilege（UniversalPreferencesWrite）; 
 netscape.security.PrivilegeManager 
 .enablePrivilege（UniversalPreferencesRead）; 
 netscape.security.PrivilegeManager.enablePrivilege（UniversalFileRead）; 
 netscape.security.PrivilegeManager.enablePrivilege（UniversalXPConnect）; 
 window.open（
 url，
 name，
screenX = 70，dependent = yes，menubar = 0，toolbar = 0，width = 900，height = 700，modal = 1，dialog = 1
）; 
 
 
函数fnCapture（）{
 fWindowOpen（/ path / to / document_or_japplet / page，_ blank）; 
 
  

HTML：

 < button value =Captureproperty =btnCaptureonclick =javascript：fnCapture（）;/> 
  

Edit2：解决方案

扩展，在xul代码上，定义这个javascript代码：

$ p $ var $ dialogExt = {
listener：function（evt） {
//使用参数evt.target.getAttribute（attribute_name）来读取参数。
window.openDialog（evt.target.getAttribute（url），evt.target.getAttribute（name ），evt.target.getAttribute（features））;

$ b //例子
document.addEventListener（dialogExtEvent，function（e）{dialogExt.listener（e）;}，false，true）;

然后，在网页上：

  var element = document.createElement（dialogExtElement）; 
 element.setAttribute（url，url）; 
 element.setAttribute（name，name）; 
 element.setAttribute（features，features）; 
 document.documentElement.appendChild（element）; 
 var evt = document.createEvent（Events）; 
 evt.initEvent（dialogExtEvent，true，false）; 
 element.dispatchEvent（evt）; 
  

现在，也许我缺少一些安全检查来让代码工作，如果它来自同一个主机，以及如何处理引用请求对话框的文档作为对话窗口与其开启者之间的交互方式。 解决方案

权限管理器是在Firefox 12中不推荐使用，并在Firefox 17中删除 short restored ）。

你可能想看看 Window.showModalDialog（） 。但是，它已被弃用，预计将在一年内消失，或者在2016年，如果你使用Firefox 38的扩展服务版本（ESR），那么这可能是一个临时解决方案。

b
$ b

为了完成相同的任务，您需要编写一个扩展名并要求用户安装它（从绕过安全限制和签署代码，关于特权管理器的旧信息）：
$ b

需要额外权限的网站现在应要求Firefox用户安装扩展程序，如果需要，它可以与非特权页面进行交互。

可以使用三种不同的扩展类型中的任何一种来编写这样的扩展：

1. XUL覆盖 .org / en-US / Add-ons / Bootstrapped_extensionsrel =nofollow>重启/引导
org / en-US / Add-ons / SDKrel =nofollow> Add-on SDK

前两种类型，您可以使用 窗口。开（） 。 模式选项位于需要权限的功能。您可能还需要查看 窗口.openDialog（） 。

对于附加SDK，通常使用 open（）窗口中使用c $ c> 函数/ utils 模块。在这里，你也许会想看看 openDialog（） 。



看来您可能会打开提供的内容从这些模式窗口中的网页。您不太可能获得批准在 AMO 上托管的扩展程序，该扩展程序会打开内容在不包含在附加发行版中的这样的窗口中。这并不意味着您无法开发扩展程序并将其安装在自助服务终端上，而无需将其托管在AMO上。不过，今年Firefox的开发还有其他的限制，这会使得这个问题变得更加困难，请看：引入扩展签名：更安全的附加体验。

We have a legacy web application. At various places it opens a window with the help of Privilege Manager on Firefox to get the needed result. Some of these windows open a Java applet or a PDF document. The client machines are updating Firefox and Privilege Manager is gone.

What is the easiest way around it? The problems are :

1. There must be only one instance of the pop-up at anyone time. This could be done by selecting appropriate window name on window.open() call.

2. If the window is opened again (by means of user action), it should not reload but just focus to bring it to the foreground (I have seen I can keep a reference to the window on JavaScript to do that)

3. It basically really must be transient/modal so that the client cannot leave the current page or reload or any other kind of interaction with the parent window (except opening/refocusing the child window) without closing the child window first. I have no idea how to do that.

Do anyone has an idea how to do that?

The client is only Firefox (it works in a special kiosk configuration) on Linux.

I read somewhere that I could somehow write an extension but I am basically clueless about extensions and its API.

Edit1:

Example of (simplified) legacy code. Not really sure if all the permissions were required, but this is it: This function opens a window that stays over the parent window and prevents any interaction from the user with the parent window.

function fWindowOpen(url, name) {
    netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");
    netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserWrite");
    netscape.security.PrivilegeManager
            .enablePrivilege("CapabilityPreferencesAccess");
    netscape.security.PrivilegeManager
            .enablePrivilege("UniversalPreferencesWrite");
    netscape.security.PrivilegeManager
            .enablePrivilege("UniversalPreferencesRead");
    netscape.security.PrivilegeManager.enablePrivilege("UniversalFileRead");
    netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
    window.open(
        url,
        name,
        "screenX=70,dependent=yes,menubar=0,toolbar=0,width=900,height=700,modal=1,dialog=1"
        );
}

function fnCapture(){
    fWindowOpen("/path/to/document_or_japplet/page","_blank");                      
}

HTML:

<button value="Capture" property="btnCapture" onclick="javascript:fnCapture();"/>

Edit2: Solution

On a typical extension, on the xul code, define this javascript code:

var dialogExt = {
 listener: function(evt) {
  // Do work with parameters read through evt.target.getAttribute("attribute_name")
  window.openDialog(evt.target.getAttribute("url"), evt.target.getAttribute("name"), evt.target.getAttribute("features"));
 }
}
// from examples
document.addEventListener("dialogExtEvent", function(e){ dialogExt.listener(e); }, false, true);

Then, on the web page:

var element = document.createElement("dialogExtElement");
element.setAttribute("url", url);
element.setAttribute("name", name);
element.setAttribute("features", features);
document.documentElement.appendChild(element);
var evt = document.createEvent("Events");
evt.initEvent("dialogExtEvent", true, false);
element.dispatchEvent(evt);

Now, maybe I am missing some security checks to let the code work if it originates from the same host, and how to handle a reference to the document that requested the dialog as means of interaction between the dialog window and it's opener.

解决方案

The Privilege Manager was deprecated in Firefox 12 and removed in Firefox 17 (briefly restored).

You might want to look into Window.showModalDialog(). However, it is deprecated and is expected to go away within the year, or in 2016 if you go with an extended service release (ESR) of Firefox 38. It may be a temporary solution while you develop an extension.

In order to accomplish the same tasks, you will need to write an extension and ask the user to install it (from Bypassing Security Restrictions and Signing Code, the old information about Privilege Manager):

Sites that require additional permissions should now ask Firefox users to install an extension, which can interact with non-privileged pages if needed.

It is possible to write such an extension using any of the three different extension types:

1. XUL overlay
2. Restartless/Bootstrap
3. Add-on SDK

For the first two types, you would use window.open(). The modal option is in "Features requiring privileges". You will probably also want to look at Window.openDialog().

For the Add-on SDK, you would normally use the open() function in the SDK's window/utils module. Here, again, you will probably want to look at openDialog().

It appears you may be opening content that is supplied from the web in these modal windows. It is unlikely that you will get an extension approved to be hosted on AMO which opens content in such windows which in not included in the add-on release. This does not mean you can not develop the extension and have it installed on your kiosk clients without hosting it on AMO. However, there are additional restrictions in development for Firefox this year which will make this significantly more difficult, see: "Introducing Extension Signing: A Safer Add-on Experience".

这篇关于HTML瞬态模态窗口的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！