ANS-0795 · DéVELOPPEMENT SUITESCRIPT

Comment générer des liens et des pages de contenu dynamique dans les Suitelets NetSuite ?

Utilisez les URI de données au sein des Suitelets NetSuite pour créer de manière dynamique des fichiers téléchargeables ou des pages Web temporaires sans avoir besoin de stocker physiquement les fichiers.

Solution courte

Pour générer du contenu dynamique sans URI physique dans NetSuite, encodez vos données (par exemple, au format CSV ou HTML) en BASE64. Intégrez ces données encodées directement dans l’attribut href d’une balise d’ancrage en utilisant un schéma d’URI « data: » pour les téléchargements, ou ouvrez-les dans une nouvelle fenêtre à l’aide de window.open pour les pages Web dynamiques dans SuiteScript 2.1.

Scénario

Les utilisateurs de NetSuite peuvent avoir besoin de générer du contenu dynamique, tel que des fichiers CSV téléchargeables ou des pages HTML temporaires, sans avoir à créer ni à stocker de fichiers physiques ou d’URI dédiés. Cela s’avère particulièrement utile pour les exportations de données à la volée ou pour regrouper plusieurs pages d’impression de transactions en une seule vue côté client.

Solution

Pour générer du contenu dynamique sans URI physique dans NetSuite, le processus consiste à encoder les données au format BASE64, puis à les intégrer dans une URI de type « data: ». Cette approche prend en charge à la fois les téléchargements directs de fichiers et la création de pages Web temporaires côté client.

  1. Génération et encodage des données :

    Commencez par préparer le contenu souhaité (par exemple, une chaîne CSV ou une chaîne HTML). Ce contenu doit ensuite être encodé au format BASE64 afin de réduire sa taille et de garantir un traitement correct au sein de l’URI. Dans SuiteScript 2.1, le module N/encode est utilisé pour l’encodage BASE64.

  2. Mise en œuvre pour le téléchargement d’un fichier CSV (exemple de Suitelet) :

    Un Suitelet peut être utilisé pour afficher un lien qui, lorsqu’on clique dessus, permet de télécharger un fichier CSV généré dynamiquement. Le schéma d’URI « data: » est directement intégré dans l’attribut href d’une balise d’ancrage.

javascript/** * @NApiVersion 2.1 * @NScriptType Suitelet */define(['N/ui/serverWidget', 'N/encode'], function(serverWidget, encode) {    function onRequest(context) {        if (context.request.method === 'GET') {            var form = serverWidget.createForm({                title: 'My New Form',                hideNavBar: false            });            // Placeholder for dynamic CSV content generation            var myContent = 'Header1,Header2nValue1,Value2nValue3,Value4';            var encodedContent = encode.convert({                string: myContent,                inputEncoding: encode.Encoding.UTF_8,                outputEncoding: encode.Encoding.BASE_64            });            var field = form.addField({                id: 'custpage_download',                type: serverWidget.FieldType.INLINEHTML,                label: 'Download CSV'            });            field.defaultValue = '<a href="data:text/csv;base64,' + encodedContent + '" download="myFile.csv">myFile.csv</a>';            context.response.writePage(form);        }    }    return {        onRequest: onRequest    };});

Ce Suitelet affichera une page comportant un lien intitulé « myFile.csv ». Lorsqu’un utilisateur clique sur ce lien ou effectue un clic droit puis sélectionne « Enregistrer sous… », un fichier CSV physique nommé « myFile.csv » sera téléchargé, contenant les données générées dynamiquement.

  1. Mise en œuvre pour une page HTML dynamique (ouverture côté client) :

    Pour générer dynamiquement et ouvrir une page HTML dans un nouvel onglet ou une nouvelle fenêtre du navigateur, le contenu HTML est d’abord encodé en BASE64. L’URI de données qui en résulte peut ensuite être utilisé avec la méthode window.open(). Cela s’avère utile pour regrouper plusieurs pages d’impression de transactions ou pour afficher du contenu temporaire généré côté client.

javascript// This example demonstrates generating HTML content and opening it in a new browser tab.// Note: The N/encode module is a server-side module. For purely client-side encoding// within a browser, the native btoa() function would typically be used.// This snippet assumes 'encode' is available in the current scope, for instance,// if the 'uriContent' is prepared server-side and then passed to a client script.var html = '<html><head><title>This is a fake web page</title></head><body><p>blablablablabla.. here there could be links, images, links, whatever we can do in html</p></body></html>';var uriContent = 'data:text/html;base64,' + encode.convert({    string: html,    inputEncoding: encode.Encoding.UTF_8,    outputEncoding: encode.Encoding.BASE_64});window.open(uriContent);

L’exécution de ce code ouvrira un nouvel onglet ou une nouvelle fenêtre de navigateur affichant le contenu HTML généré dynamiquement.Considérations relatives aux performances : il est important de noter que l’utilisation d’URI « data: » implique que l’ensemble du contenu est chargé en mémoire côté client. Pour les fichiers très volumineux ou les structures HTML complexes, cela peut avoir un impact notable sur les performances du navigateur de l’utilisateur.

Support expert NetSuite

Besoin d’aide pour cet enjeu NetSuite ?

Accompagnement-conseil et configuration pour Développement SuiteScript

Parler à un consultant