Question

我正在尝试使用OmniFaces来推迟PrimeFaces脚本，如answer中所示。

但PrimeFaces会在头部呈现一个内联脚本，就像这样（脚本美化并由我评论）：

<script type="text/javascript">
    if(window.PrimeFaces) {
        // this line is always rendered in Development mode.
        PrimeFaces.settings.projectStage='Development';
        // these lines are added if Client Side Validation is enabled.
        PrimeFaces.settings.locale='pt_BR';
        PrimeFaces.settings.validateEmptyFields=true;
        PrimeFaces.settings.considerEmptyStringNull=true;
    }
</script>

当我运行应用程序时，我收到一些JS错误（文件和错误）：

validation.js.xhtml?ln=primefaces&v=5.3:1
Uncaught TypeError: Cannot read property 'en_US' of undefined

beanvalidation.js.xhtml?ln=primefaces&v=5.3:1
Uncaught TypeError: Cannot read property 'en_US' of undefined

produto.xhtml:2
Uncaught TypeError: Cannot set property 'locale' of undefined

如果我在primefaces.deferred.js中添加一些变量，就像这样：

if (!primeFacesLoaded) {
    window.PrimeFaces = {
        // variables added - begin
        settings: {
            projectStage: 'Development',
            locale: 'pt_BR',
            validateEmptyFields: true,
            considerEmptyStringNull: true
        },
        // variables added - end
        ab: function () {
            defer("ab", arguments);
        },
        cw: function () {
            defer("cw", arguments);
        },
        focus: function () {
            defer("focus", arguments);
        }
    };
}

仍然会出现两个第一个错误，但第三个错误消失了。

显然，PrimeFaces JS对象缺少以下属性：

locales: {
    // other values...
    en_US: {
        // other values...
    }
},
util: {
    // other values...
},

所以，问题是：如何正确推迟这些PrimeFaces脚本属性？

P.S：版本：PrimeFaces 5.3，OmniFaces 2.3，Payara Server（Glassfish）4.1.1.161

Answer 1

在the answer发布后引入了PrimeFaces.settings。同时，答案已经更新，以便将其考虑在内。更新的脚本是：

DeferredPrimeFaces = function() {
    var deferredPrimeFaces = {};
    var calls = [];
    var settings = {};
    var primeFacesLoaded = !!window.PrimeFaces;

    function defer(name, args) {
        calls.push({ name: name, args: args });
    }

    deferredPrimeFaces.begin = function() {
        if (!primeFacesLoaded) {
            settings = window.PrimeFaces.settings;
            delete window.PrimeFaces;
        }
    };

    deferredPrimeFaces.apply = function() {
        if (window.PrimeFaces) {
            for (var i = 0; i < calls.length; i++) {
                window.PrimeFaces[calls[i].name].apply(window.PrimeFaces, calls[i].args);
            }

            window.PrimeFaces.settings = settings;
        }

        delete window.DeferredPrimeFaces;
    };

    if (!primeFacesLoaded) {
        window.PrimeFaces = {
            ab: function() { defer("ab", arguments); },
            cw: function() { defer("cw", arguments); },
            focus: function() { defer("focus", arguments); },
            settings: {}
        };
    }

    return deferredPrimeFaces;
}();

基本上，只需将属性准备为空对象，在begin期间复制它，然后在apply期间进行设置。

至于推迟PrimeFaces validation.js和beanvalidation.js文件，这需要<h:head>的自定义渲染器，因为PrimeFaces实际上硬编码它们而不是将它们声明为@ResourceDependency。您可以在wiki of CombinedResourceHandler中找到具体示例。

package com.example;

import java.io.IOException;

import javax.faces.application.ResourceDependencies;
import javax.faces.application.ResourceDependency;
import javax.faces.component.UIComponent;
import javax.faces.context.FacesContext;
import javax.faces.render.Renderer;

@ResourceDependencies({
    @ResourceDependency(library="primefaces-aristo", name="theme.css"),
    @ResourceDependency(library="primefaces", name="primefaces.js"), // Only necessary when at least one validation JS files needs to be included.
    @ResourceDependency(library="primefaces", name="validation/validation.js"), // Only necessary when you need <p:clientValidator>.
    @ResourceDependency(library="primefaces", name="validation/beanvalidation.js") // Only necessary when you use JSR303 bean validation.
})
public class HeadRenderer extends Renderer {

    @Override
    public void encodeBegin(FacesContext context, UIComponent component) throws IOException {
        context.getResponseWriter().startElement("head", component);
    }

    @Override
    public void encodeChildren(FacesContext context, UIComponent component) throws IOException {
        // NOOP.
    }

    @Override
    public void encodeEnd(FacesContext context, UIComponent component) throws IOException {
        for (UIComponent resource : context.getViewRoot().getComponentResources(context, "head")) {
            resource.encodeAll(context);
        }

        context.getResponseWriter().endElement("head");
    }

}

要使其运行，请在faces-config.xml：

中按如下方式注册

<render-kit>
    <renderer>
        <component-family>javax.faces.Output</component-family>
        <renderer-type>javax.faces.Head</renderer-type>
        <renderer-class>com.example.HeadRenderer</renderer-class>
    </renderer>
</render-kit>

如何使用o：deferredScript推迟PrimeFaces.settings和客户端验证脚本

1 个答案: