Création d'une page publique

Support
1

Bonjour,

nous souhaiterions enrichir notre application avec une page publique.
Le comportement désiré est le suivant :

  • si la personne va sur l’url /ui, elle soit dirigée vers une page d’authentification.
  • si la personne va sur l’url /ui/pub/modificationArchi (exemple d’url), elle soit dirigée vers une page publique (sans authentification). Sur cette page, l’utilisateur pourra remplir et valider un formulaire.

Savez-vous comment je peux le faire ? Avez vous une documentation dessus ?

Merci d’avance
Amandine TRIDOU

[Platform]
Status=OK
Version=4.0.P24
BuiltOn=2020-03-05 23:18 (revision 40c7997ef4ecb7b5cf073d0427e387a478b0eb96)
Encoding=UTF-8
EndpointIP=21.1.30.255
EndpointURL=http://26b065351928:8080
TimeZone=Europe/Paris
SystemDate=2020-03-13 08:31:58

2

Les objets externes (i.e. les composants UI/API spécifiques) sont exposés sur /ext en zone publique.

Il y a plusieurs exemples d’objets externes de ce type dans la démo :

En termes de droits, n’est accessible en zone publique que ce qui est habilité au user public ou a un user technique ad hoc (comme le website des exemples de la démo)

Une doc plus générale sur les objects externes est là: https://docs.simplicite.io/documentation/01-core/externalobject-code-examples.md

3

Merci pour votre réponse. N’y a t-il pas moyen d’utiliser un objet métier ?
Voici notre besoin : nous avons besoin que des anonymes puissent remplir un formulaire demandant une modification de notre système et l’envoyer.
Ensuite des architectes se connectent sur Simplicité et valident ou refusent ces demandes.
Nous avons déjà créé un objet métier, une vue et des contraintes d’affichage.
Existe t-il une façon de réutiliser ces 3 éléments dans la vue publique ?

Merci d’avance

4

Je ne comprend pas votre question.

Dans les exemples que je vous ai indiqué des objets métier sont, bien entendu, utilisés. Soit en lecture soit en écriture en fonction des droits que l’on donne au user “technique” utilisé.

Le premier exemple, en particulier, permet à un utilisateur du frontend (ici un client) de créer des commandes dans un état “pending” qui sont ensuite gérées en back pour les autres états. C’est je pense exactement votre cas d’usage.

5

Bonjour
merci pour votre retour. J’ai importé votre module de démo mais il n’y a aucun objet métier (sauf erreur de ma part). Je crois que le projet est incomplet.
J’ai quelques questions :

  • Dans la documentation, l’affichage de la page est définie dans une méthode Display. Existe-t’il un moyen d’utiliser directement le template défini sur un objet métier ? (J’ai vu dans la documentation qu’une méthode addVue existait. La création d’une vue avec le template de l’objet pourrait être une solution ?)
  • Je souhaiterai que le nom de ma page publique coressponde à la traduction de mon objet externe.
    BootstrapWebPage wp = new BootstrapWebPage(params.getRoot(), this.getName(), false);
    Malheureusement le getName() donne le nom technique de l’objet et non la traduction.
  • Comment pouvons nous utiliser les traductions des certains attributs dans le formulaire de la vue publique ?

Merci d’avance

6

Cf. mon post précédent les exemples de frontend de la démo ne sont pas dans le module Demo mais dans des modules dédiés:

7

La notion d’ “objet externe” permet de faire plein de choses:

  1. des composants de la UI responsive
  2. des pages standalone (généralement publiques)
  3. des webservices custom
  4. d’autres composants spécifiques

Décrire tous les cas ne relève pas du support mais de la formation. Je ne peux donc pas vous donner ici autre choses que des exemples (ceux de la démo) des liens vers des docs et des guidelines généraux.

Si vous êtes dans le cas 1. vous êtes dans la onepage responsive de la UI standard le pattern à appliquer est celui-ci https://docs.simplicite.io/documentation/01-core/externalobject-code-examples.md#responsive . Dans ce genre de composant vous avez accès à tous les composants Javascript et CSS chargés par cette onepage, notamment la lib UI décrite ici https://docs.simplicite.io/documentation/04-ui/responsive.md

Si vous êtes dans le cas 2. vous fabriquez une page web standalone from scratch, à vous de charger explicitement les composants Javascript et CSS dont vous avez besoin. Le pattern de base dans ce cas est décrit ici https://docs.simplicite.io/documentation/01-core/externalobject-code-examples.md#basic. Vous pouvez vous appuyer sur des classes helper du package https://docs.simplicite.io/4.0/javadoc/com/simplicite/webapp/web/package-summary.html

Si vous êtes dans le cas 3. vous fabriquez un webservice standalone from scratch, le pattern à appliquer est celui ci https://docs.simplicite.io/documentation/02-integration/custom-services.md. Vous pouvez utiliser les classe helper du package https://docs.simplicite.io/4.0/javadoc/com/simplicite/webapp/services/package-summary.html

Les exemples de la démo sont franchement très didactiques, les 3 exemples sont structurellement très différents, la 1ère est assez complète mais est assez bas niveau, elle se sert de la lib AJax standard, les 2 autres sont des exemples volontairement très simples basés sur des patterns plus modernes à base de templates Mustache et du framework Vue.js (à noter que ces deux là sont à la fois prévus pour fonctionner en tant que page standalone publique ou comme composant de la UI onepage)

Au delà des objets externes, sur notre GitHub https://github.com/simplicitesoftware vous trouverez aussi des kickstarters pour faire des UI custom en Vue.js, Angular, React, NodeRED, etc. mais là on est plutôt dans des choses à développer en dehors de Simplicité et basés sur la lib JS contrib (web & node.js) disponible ici https://www.npmjs.com/package/simplicite

Bref comme vous le voyez le champ des possibles est extrêmement large. Avant de se lancer dans le développement de composants de UI alternatifs (objets externes Simplicité ou en dehors de Simplicité) vous devez savoir ce que vous voulez faire et avoir bien regardé ce que permettent les différents composants (libs JS, helpers Java, …) qu’on vous met à disposition.

PS: pour répondre aux question plus anecdotiques que vous posez aussi : la traduction de l’objet externe est donnée par getDisplay() (cf. les exemples de la démo) et bien entendu les libs JS (Ajax, UI et la lib contrib JS web & node.js) donnent accès aux méta données des objets métier donc, notamment, aux traductions des attributs.

8

Bonjour
merci pour vos réponses. Mon erreur a été d’importer uniquement le module DemoWebSite et pas le module Demo donc évidemment les objets métiers manquaient. Veuillez m’excuser.
Entre temps, j’avais en effet trouvé le getDisplay et le getMetaData. Merci quand même.

J’ai quelques questions restantes pour lesquelles j’ai besoin de votre validation :

  1. Juste pour être sûre, j’ai un objet métier sur lequel j’ai défini un template. Nous sommes d’accord que je ne peux pas injecter directement le template dans ma page publique ? J’ai vu qu’il existait dans l’objet Simplicite.Ajax, la possibilité de charger une vue. Je n’ai pas vu l’équivalent pour les templates. Pouvez vous me confirmer que cette fonctionnalité n’existe pas ?

  2. Dans ma page publique, je souhaite afficher un input de type select avec une liste de valeur définie dans un de mes modules.
    Je n’ai pas trouvé, en js, l’équivalent getBusinessObject tel que getListOfValue. La seule solution que j’ai trouvé est en faisant Simplicite.Ajax.getBusinessObject(“monObjet”).getField(“monAttribut”)[“listOfValues”]
    (en revanche, en java, l’objet ListOfValues me retourne bien ma liste)
    Dans votre exemple toute votre page est construite dans le code js. Que conseillez-vous de faire : tous faire dans le js ou récupérer la liste dans le code java de l’objet externe et le transmettre en paramètre au init du JS ?

  3. Je ne comprends pas comment fonctionne le champ URL sur un objet externe. Actuellement, j’accède à ma page et faisant [Host]/ext/MonBusinessObjet. Je souhaiterai ne pas exposer le nom de mon business objet en utilisant une URL [Host]/ma_jolie_url. Lorsque j’indique l’url dans le champ url de mon objet externe, j’obtiens
    image
    Comment rendre cette URL acessible ?

Merci d’avance et bonne journée

9

1 et 2, cf https://docs.simplicite.io/documentation/04-ui/responsive.md dans un objet externe vous avez accès à ces composants directement quand il s’agit d’un composant privé, pour un composant public votre objet externe doit explicitement charger les libs dont il a besoin, je pense que vous pouvez tout de même hériter de la classe https://docs.simplicite.io/4.0/javadoc/com/simplicite/webapp/web/ResponsiveExternalObject.html en zone publique, à verifier…

3: les objects externes sont exposés par défaut sur l’URL de base [/ui|/api]/ext/<name> en fct de leur usage, vous pouvez leur affecter une URL arbitraire via le méccanisme de l’URI mapping:

[
	{ "source": "^/ext/MyExtObject(.+)$", "destination": "/my_custom_url$1" }	
]
10

PS: Exemple de mapping plus complet adapté aux objets externes de la démo:

[
	{ "source": "^/demo/api/v1(.+)$",   "destination": "/api/ext/demows$1"  },
	{ "source": "^/demo/web(.*)$",      "destination": "/ext/DemoWebSite$1" },
	{ "source": "^/demo/mustache(.*)$", "destination": "/ext/demo$1"        },
	{ "source": "^/demo/vue(.*)$",      "destination": "/ext/demovjs$1"     }
]
11

Bonjour
merci de nouveau pour vos retours.
Auriez vous à tout hasard un module qui implémente une page externe chargent un objet privé possédant un template ?
J’ai lu la documentation sur les [https://docs.simplicite.io/documentation/04-ui/responsive.md](http://les ui responsive) mais je ne comprends pas comment la mettre en place.
Je n’arrive pas à voir le lien entre les différents fichiers et comment se fait le chargement.

J’ai compris qu’il fallait que j’utilise Simplicite.UI.Globals.form mais je ne comprends pas comment. Sur la document, il y a tout un bloc de html, dois-je l’insérer tel quel ou sera t-il injecter lorsque je chargerai le formulaire.

Dans la partie " Stand-alone usage" de la documentation, il est indiqué “Use jQuery extensions” malheureusement le lien fourni renvoie un “Not Found” https://docs.simplicite.io/4.0/jsdocui/jQuery.fn.html

12

Il y a une infinité de cas pour les objets externes, c’est très difficile de vous répondre à vos questions sans avoir compris, plus globalement, ce que vous voulez faire.

Ici visiblement on parle d’une “page” web, ça limite déjà le champs des possibles.

La question de base c’est de savoir si cette page est :

  1. un composant de la UI générique en zone authentifiée auquel cas pas besoin de se poser la question du chargement des libs JS, vous êtes sur une “one page” où tout est déjà chargé
  2. une page standalone en zone publique, auquel cas vous avez le choix entre plusieurs approches en fonction des outils/libs que vous voulez/savez utiliser
  3. un composant “mixte” capable de s’afficher à la fois en zone authentifiée comme un composant de la UI générique et comme une page standalone en zone publique

Dans les exemples de la démo il y a du 2. (module DemoWebSite) et du 3. (modules DemoMustache et DemoVueJS)