Pour commencer à utiliser des formulaires adaptatifs sans interface dans votre projet de réaction, installez les dépendances suivantes dans votre projet de réaction.
Mettez à jour le fichier package.json pour inclure les dépendances suivantes. Au moment de l'écriture 0.22.41 était la version actuelle
"@aemforms/af-react-components": "^0.22.41",
"@aemforms/af-react-renderer": "^0.22.41",
La liste déroulante et la mise en page des cartes de ce tutoriel ont été créés à l’aide de la Bibliothèque de l’interface utilisateur matérielle. Vous devrez télécharger les modules d’IU matériel appropriés pour que le code fonctionne sur votre système.
Le partage des ressources cross-origin (CORS) est un mécanisme de sécurité qui empêche les navigateurs web d’effectuer des requêtes vers un domaine différent de celui sur lequel l’application est hébergée. Des erreurs CORS peuvent se produire lorsque vous essayez de récupérer des données d’une API hébergée sur un autre domaine. En configurant un proxy, vous pouvez contourner les restrictions CORS et envoyer des requêtes à l’API à partir de votre application React. J’ai utilisé le code suivant dans un fichier appelé setUpProxy.js dans le dossier src. Veillez à modifier la cible pour qu’elle pointe vers votre instance de publication.
const { createProxyMiddleware } = require('http-proxy-middleware');
const proxy = {
target: 'https://mypublishinstance:4503/',
changeOrigin: true
}
module.exports = function(app) {
app.use(
'/adobe',
createProxyMiddleware(proxy)
),
app.use(
'/content',
createProxyMiddleware(proxy)
);
};
Vous devez également installer et ajouter le http-proxy-middleware à votre projet.