Récupérer le fragment (hash) d'une URL et injecter les valeurs dans le haricot

Je suis à la recherche d'un moyen d'injecter des valeurs à partir du fragment (#) d'une URL dans le haricot(JSF), de la même manière à la requête des valeurs de paramètre sont injectés. Je suis l'aide de Ben Alman du Bookmarkable plugin jQuery (http://benalman.com/projects/jquery-bbq-plugin/) pour créer l'URL des fragments. J'espérais que la Coutume de modèles regex de prettyFaces pourrait être un moyen de résoudre mon problème, mais jusqu'à maintenant, j'ai succombé.

(http://ocpsoft.com/docs/prettyfaces/snapshot/en-US/html_single/#config.pathparams.regext)

Je voudrais ici de définir ma situation et si quelqu'un a une idée, je
aimerait essayer.

Je suis en utilisant
RichFaces: 3.3.3,
Printemps: 3.0.2.LIBÉRATION,
Hibernate: 3.5.3-Finale,
JSF: 2.0.2-FCS,
PrettyFaces: 3.0.1

L'application web génère, suivant la nature de l'URL où les paramètres
sont listés après un dièse(#). L'idée est d'avoir un basé sur ajax
Bookmarkable URL. Donc à chaque fois que je clique sur un élément qui change la
l'état du système, la valeur est envoyée au serveur via ajax et le
URL après le hachage est réécrit. Il peut être de 1 à 3 paramètres après
le hachage, le nombre de paramètres sont facultatifs.

Mon but, c'est quand les signets de l'utilisateur, l'adresse URL (avec de hachage) et que
revisite la page enregistrée, la page d'injecter les valeurs correctes
dans le système et de visualiser la page dans l'état précédent (comme
une requête de paramètre).

Ci-dessous, j'ai une expression régulière qui doit attraper tous les paramètres
après le hachage.

//URL:   
http://localhost:8080/nymphaea/workspace/#node=b48dd073-145c-4eb6-9ae0-e1d8ba90303c&lod=75e63fcd-f94a-49f5-b0a7-69f34d4e63d7&ln=en

//Regular Expression:    
\#(\w*\=(\w{8}-\w{4}-\w{4}-\w{4}-\w{12}))|\&(\w*\=(\w{8}-\w{4}-\w{4}-\w{4}-\w{12}))|\&(\w*\=\w{2})

Je sais qu'il existe des sites web que certains comment envoyer le fragment d'URL vers le côté de serveur logique,

Est-il de toute façon à injecter des valeurs à partir de l'URL de fragments en côté serveur haricots?

source d'informationauteur Choesang | 2010-08-13

  1. 8

    Vous pouvez le faire avec l'aide de window.onhashchange qui remplit un champ de saisie d'un formulaire masqué qui se soumet lui-même de manière asynchrone lorsque le champ de saisie a changé.

    Voici un coup d'envoi exemple de la Facelets page:

    <!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" 
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:h="http://java.sun.com/jsf/html">
    <h:head>
        <title>SO question 3475076</title>
        <script>
            window.onload = window.onhashchange = function() {
                var fragment = document.getElementById("processFragment:fragment");
                fragment.value = window.location.hash;
                fragment.onchange();
            }
        </script>
        <style>.hide { display: none; }</style>
    </h:head>
    <h:body>
        <h:form id="processFragment" class="hide">
            <h:inputText id="fragment" value="#{bean.fragment}">
                <f:ajax event="change" execute="@form" listener="#{bean.processFragment}" render=":showFragment" />
            </h:inputText>
        </h:form>
        <p>Change the fragment in the URL. Either manually or by those links:
            <a href="#foo">foo</a>, <a href="#bar">bar</a>, <a href="#baz">baz</a>
        </p>
        <p>Fragment is currently: <h:outputText id="showFragment" value="#{bean.fragment}" /></p>
    </h:body>
</html>

    Voici comment appropriés bean ressembler à:

    package com.stackoverflow.q3475076;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;
import javax.faces.event.AjaxBehaviorEvent;

@ManagedBean
@RequestScoped
public class Bean {

    private String fragment;

    public void processFragment(AjaxBehaviorEvent event) {
        //Do your thing here. This example is just printing to stdout.
        System.out.println("Process fragment: " + fragment);
    }

    public String getFragment() {
        return fragment;
    }

    public void setFragment(String fragment) {
        this.fragment = fragment;
    }

}

    C'est tout.

    Noter que le onhashchange événement est relativement nouveau et n'est pas supporté par les navigateurs plus anciens. En l'absence de la prise en charge du navigateur (undefinied et ainsi de suite), vous souhaitez vérifier window.emplacement.de hachage à des intervalles à l'aide de setInterval() à la place. L'exemple de code ci-dessus devrait au moins donner un bon coup d'envoi. Il fonctionne à au moins FF3.6 et IE8.

  2. 3

    Voici le moyen le plus fiable pour extraire un fragment d'une syntaxiquement valide URL /URI.

     URI uri = new URI(someString);
 String fragment = uri.getFragment();

    Comment vous injecter ce une fève dépendra de ce côté serveur framework que vous utilisez, et si vous faites l'injection à l'aide de XML ou des annotations, ou de le faire programmaticaly.

  3. 1

    Regarder cette question et en particulier les réponses: JSP Servlet d'ancrage

    • Fragment ne peut être vu sur
      côté serveur.
    • Vous pouvez extraire le fragment
      du côté des clients, de les convertir et de les envoyer à
      le serveur via Ajax.
  4. 1

    Le fragment ne peut être vu à partir du côté serveur, il ne peut être accédé que par des scripts côté client. La façon dont il est habituellement fait est que le côté serveur génère un non paramétrée page, qui est ensuite modifiée par les scripts en conformité avec le fragment de paramètres. Les scripts pourrait faire des requêtes AJAX avec les paramètres de la requête, où les réponses AJAX sont générés par JSF à l'aide de fèves contrôlé par les paramètres.

    Si vous voulez absolument le côté serveur pour avoir accès à la fragment de paramètres lors du rendu de la page, vous avez besoin de recharger la page avec les paramètres en tant que paramètres de la requête à la place.

    EDIT: Pour recharger la page, vous pouvez utiliser ce code:

    if (window.location.hash != '') {
  var newsearch = window.location.search;
  if(newsearch != '') {
    newsearch += '&';
  }
  newsearch += window.location.hash.match(/#?(.*)/)[1];
  window.location.hash = '';
  window.location.search = newsearch;
}
  5. 0

    Merci beaucoup pour vos idées & spécialement BalusC (beaucoup bravo à vous). Ma solution finale a été une légère mutation et je tiens à partager avec vous tous.

    Depuis que je suis à l'aide de richfaces 3.3.3, c'est comme l'utilisation de jsf1.2, donc pas de <f:ajax>

    Dans une situation classique, on s'attend à cliquer sur un lien avec un href pointant vers un lien interne <a id='internalLink'href='#internalLink'>. Je suis à l'aide de plusieurs des composants pré-emballés où chaque élément cliquable d'un lien <a>. Il peut être n'importe quel élément html. Il est très utile d'utiliser Ben Alman du Bookmarkable plugin jQuery (http://benalman.com/projects/jquery-bbq-plugin/)

    Veuillez noter ci-dessous que, onclick, je peux définir par programmation la valeur du fragment en tant que clé/valeur, et dans le code suivant, j'ai remplacer l'ancienne valeur par la nouvelle valeur jQuery.bbq.pushState(state,2) (ou je pourrait avoir simplement ajouté derrière l'ancienne valeur jQuery.bbq.pushState(state)).

    Dans mon cas, ws->md->nd est une organisation hiérarchique des données, où il suffit d'avoir l'un d'entre eux et ses parents sont calculés sur le serveur, j'ai donc remplacer la valeur de parent à enfant de la valeur. 

    <ui:repeat value="#{workspaceController.modulesForWorkspace}" var="item">  
 <a4j:commandLink onclick="var state = {}; state['md'] = '#{item.uuid}';
  jQuery.bbq.pushState( state, 2 );"    
  action="#{workspaceController.setSelectedModule}"
  reRender="localesList" 
  oncomplete="selectNavigationElement(this.parentNode>
    <f:param name="selectedModule" value="#{item.uuid}"/>
  </a4j:commandLink>
</ui:repeat>

    Dans richfaces, c'est une façon cool pour appeler les méthodes de définition de navigateur avec un paramètre. Notez que sendURLFragment est considérée comme une méthode JS avec 5 paramètres et les valeurs sont transmises au serveur (ce qui est très cool). 

    <h:form id="processFragment" prependId="false" style="display: none">
  <h:inputText id="fragment" value="#{workspaceController.selectedWorkspace}">                                  
   <a4j:support event="onchange"/>
  </h:inputText>    
<a4j:jsFunction name="sendURLFragment" reRender="workspaces">
 <a4j:actionparam name="ws" assignTo="#{workspaceController.selectedWorkspace}"/>
 <a4j:actionparam name="md" assignTo="#{workspaceController.selectedModule}"/>
 <a4j:actionparam name="nd" assignTo="#{workspaceController.selectedContentNode}"/>
 <a4j:actionparam name="ld" assignTo="#{workspaceController.selectedLOD}"/>
 <a4j:actionparam name="ln" assignTo="#{workspaceController.contentNodeTreeLocale}"  
 converter="localeConverter"/>                              
</a4j:jsFunction>
</h:form>

    Faire la chose, lorsque vous copiez-collez l'url de nouvelles et de charger la page.

    window.onload = function(){
if(window.location.hash != ""){  
    //Parse the fragment (hash) from a URL, deserializing it into an object            
    var deparamObj = jQuery.deparam.fragment();
    var ws= '', md= '', nd= '', ld= '', ln = '';            
    jQuery.each(deparamObj, function(key, value) {              
        switch(key){
            case 'ws':
                ws = value;
                break;
            case 'md':
                md = value;
                break;
            case 'nd':
                nd = value;
                break;
            case 'ld':
                ld = value;
                break;
            case 'ln':
                ln = value;
                break;
            default:
                break;          
        }

    });
    sendURLFragment(ws,md,nd,ld,ln);
}   };