Création de la nouvelle page de magasin

Dans cette leçon, vous créez la nouvelle page démographique dans votre vitrine, afin que les clients puissent entrer leurs informations.

Procédure

Procédez comme suit dans HCL Commerce Developer.

Copiez le fichier StoreLab1/MyStoreSAS/UserArea/AccountSection/ExtProfileForm.jsp dans le répertoire suivant : crs-web > WebContent > MyStoreSAS > UserArea > AccountSection.

Le fichier ExtProfileForm.jsp contient du code qui affiche un formulaire au client qui capture les informations de profil supplémentaires. Lorsque le client saisit les informations et clique sur Soumettre, les informations sont mises à jour dans la base de données.
Développez crs-web > Java Resources > src/main/resources > MyStoreSAS.
Ouvrez le fichier storetext_v2.properties. Ce fichier de propriétés contient du texte traduisible utilisé dans la vitrine. Ajoutez les lignes suivantes à la fin du fichier :
```
# ExtProfileForm.jsp
EXT_PROFILE_TITLE=Additional Profile Information
MARITAL_STATUS=Marital Status
HOUSEHOLD=Number of people in household (including children)
CHILDREN=Number of children in household
```
Ces clés sont utilisées dans le fichier ExtProfileForm.jsp.
Enregistrez vos modifications et fermez le fichier.
Définissez la configuration du contrôleur Spring pour le fichier ExtProfileForm.jsp.

Le répertoire crs-web > WebContent > WEB-INF > spring contient les configurations Spring. Cela inclut les configurations par défaut et personnalisées. Les configurations Spring personnalisées doivent être incluses dans les fichiers -ext. Chaque magasin a sa propre version de ces fichiers. Les fichiers en dehors des répertoires du magasin contiennent les configurations par défaut et s'appliquent à tous les magasins.
1. Développez crs-web > WebContent > WEB-INF > spring > MyStoreSAS.
2. Ouvrez le fichier views-ext.xml pour l'éditer.
3. Insérez le fragment de code suivant avant la balise </beans> :
```
  <bean id="ExtProfileFormView/MyStoreSAS" class="com.ibm.commerce.store.mvc.view.spring.StoreInternalResourceView">
    <property name="url" value="/UserArea/AccountSection/ExtProfileForm.jsp"/>
    <property name="https" value="1"/>
    <property name="viewAccessType" value="RegisteredCustomerView"/>
  </bean>
```
  Dans cet exemple, ExtProfileFormView est le nom de la vue. L'alias du magasin, MyStoreSAS, indique que cette vue est spécifique à votre magasin personnalisé. La valeur URL est le chemin d'accès du fichier JSP mappé à la vue. La nouvelle vue s'exécutera toujours en mode HTTPS et ne peut être exécutée que par les clients enregistrés sur le site (c'est-à-dire que la vue n'est pas accessible aux utilisateurs invités). Pour en savoir plus sur ces propriétés, reportez-vous à Personnalisation de l'infrastructure MVC Spring et du contrôleur de magasin.
Développez crs-web > WebContent > MyStoreSAS > UserArea > AccountSection et ouvrez le fichier ExtProfileForm.jsp. Repérez la ligne suivante :
```
<form name="Logon" method="post" action="RESTUserRegistrationUpdate"
id="Logon">
```
Dans cet exemple, l'action utilisée est RESTUserRegistrationUpdate. Lorsque le client saisit les informations requises dans le formulaire et clique sur le bouton Envoyer, l'action définie est appelée. La valeur RESTUserRegistrationUpdate est une URL qui doit être mappée à un contrôleur d'action Spring. Ce mappage se trouve dans le fichier crs-web\WebContent\WEB-INF\spring\controllers.xml :
```
<prop key="/RESTUserRegistrationUpdate">userRegistrationUpdate</prop>
```
L'URL RESTUserRegistrationUpdate s'affiche sur le contrôleur d'action userRegistrationUpdate. Le bean du contrôleur d'action userRegistrationUpdate est défini dans le fichier crs-web\WebContent\WEB-INF\spring\member-controllers.xml :
```
<bean id="userRegistrationUpdate"
class="com.ibm.commerce.store.mvc.controller.spring.RESTActionController
">
<property name="https" value="1"/>
<property name="authenticate" value="0"/>
<property name="parameter" value="personHandler.updatePerson"/>
<property name="generic" value="1"/>
<property name="csrfProtected" value="1"/>
</bean>
```
Dans la définition de bean de contrôleur précédente, la propriété parameter identifie le service REST appelé lorsque cette action est appelée. Chaque service REST dispose d'un modèle qui définit son URL de nœud final, sa méthode, sa requête et ses formats de réponse. Les modèles REST par défaut se trouvent dans le répertoire crs-web\WebContent\WEB-INF\xml\config. Les modèles liés au composant membre se trouvent dans le répertoire com.ibm.commerce.person.
La valeur du paramètre se présente sous le format suivant : resourceName.methodName. Par conséquent, personHandler.updatePerson représente la méthode updatePerson du service REST personHandler dans le fichier rest-template-config.xml, comme indiqué en gras :
```
	<resource path="{serverHost}/{contextPath}/store/{storeId}/person" name="personHandler">
	 <serverParam name="serverHost">$WCParam.serverHost</serverParam>
	 <serverParam name="contextPath">$WCParam.contextPath</serverParam>
	 <serverParam name="storeId">$WCParam.storeId</serverParam>
		<method name="updatePerson" httpMethod="PUT" path="@self?action={action}">
		<var name="action">updateUserRegistration</var>
```
Le modèle par défaut de updatePerson n'inclut pas l'état matrimonial, le foyer et les enfants dans la requête. Par conséquent, si vous appelez updatePerson dans sa forme actuelle, ces zones ne seront pas enregistrées dans la base de données. Vous personnaliserez le modèle REST pour inclure ces zones manquantes.
Développez crs-web > WebContent > WEB-INF > xml et créez l'arborescence de répertoires suivante : config/com.ibm.commerce.person.
Copiez le fichier StoreLab1/WEB-INF/xml/config/com.ibm.commerce.person/rest-template-config-ext.xml à partir de l'exemple d'actifs du tutoriel dans le répertoire nouvellement créé. Ce fichier est une copie du modèle REST com.ibm.commerce.person par défaut, mais contient les zones manquantes dans la définition updatePerson vers la fin du modèle.
Actualisez le projet crs-web. Le répertoire et son contenu doivent ressembler à la capture d'écran suivante dans le projet :
Vous pouvez ouvrir le fichier et l'examiner, en notant que les valeurs suivantes existent :
```
"maritalStatus" : "$maritalStatus",
"household" : "$household",
"children" : "$children"
```
Le nom du paramètre de requête JSON doit correspondre aux paramètres pris en charge par le service REST. Le nom de la variable doit correspondre à la variable d'entrée définie dans le formulaire de fichier JSP où l'entrée du client est capturée.

Les paramètres de requête pris en charge pour updatePerson sont affichés dans l'API REST suivante : Gestion des utilisateurs et des organisations.

Accédez à la section Balise : Personne et cliquez sur PUT /store/{storeId}/person/@self.

Cette URL correspond au chemin d'accès des ressources et au chemin d'accès de la méthode définis dans le modèle REST, comme illustré en gras :


	<resource path="{serverHost}/{contextPath}/store/{storeId}/person" name="personHandler">
	 <serverParam name="serverHost">$WCParam.serverHost</serverParam>
	 <serverParam name="contextPath">$WCParam.contextPath</serverParam>
	 <serverParam name="storeId">$WCParam.storeId</serverParam>
		<method name="updatePerson" httpMethod="PUT" path="@self?action={action}">
		<var name="action">updateUserRegistration</var>

Cliquez sur UserRegistrationUpdateRequest dans le corps de la requête.

Ce lien affiche la liste des paramètres de requête pris en charge.
Redémarrez le serveur de test de magasin et démarrez le serveur de test de personnalisation et le conteneur de serveur de test de recherche, si le serveur et le conteneur ne sont pas déjà en cours d'exécution. Pour plus d'informations, voir l'affichage Serveurs :

Résultats

Dans cette leçon, vous avez créé la nouvelle page de magasin et examiné son comportement dans l'API REST.