Portail de services API : ServiceNow Fluent

  • Rversion finale: Australia
  • Mis à jour 12 mars 2026
  • 14 minutes de lecture

    • L’API Portail de services définit des widgets personnalisés [sp_widget] pour les pages du portail.

    Remarque :
    Pour obtenir la documentation et des exemples d’API les plus récents ServiceNow Fluent , consultez les ServiceNow Fluent Référence API et référentiel d’exemples de SDK ServiceNow sur GitHub.

    Pour en savoir plus sur les portails, reportez-vous à la section Service Portal.

    Objet SPWidget

    Créez un widget personnalisé [sp_widget] à inclure sur une page de portail.

    Pour en savoir plus sur la création de widgets personnalisés, reportez-vous à la section Developing custom widgets.

    Tableau 1. Propriétés
    Nom Type Description
    $id Chaîne ou numéro Requis. ID unique pour l’objet de métadonnées. Lorsque vous créez l’application, cet ID est haché en une sys_id unique. Pour en savoir plus, consultez ServiceNow Fluent Constructions linguistiques.

    Format : Now.ID['chaîne' ou numéro]
    nom Chaîne Requis. Nom attribué au widget.
    catégorie Chaîne Type de widget.
    Valeurs valides :
    • de série
    • otherApplications
    • Personnalisation
    • Exemple
    • base de connaissances
    • Portail de services
    • Catalogue de services

    Par défaut : personnalisé
    Script client Script Un script côté client qui définit le contrôleur AngularJS. Cette propriété prend en charge le JavaScript en ligne ou une référence à un autre fichier dans l’application qui contient un script.
    Format :
    • Pour utiliser le contenu textuel d’un autre fichier, reportez-vous à un fichier de l’application en utilisant le format suivant : Now.include('chemin/vers/fichier'). Pour plus d'informations, consultez ServiceNow Fluent Constructions linguistiques.
    • Pour fournir un script inline, utilisez des chaînes de caractères ou des modèles de lignes de code : « Script » ou « Script ».
    Par défaut : 
    api.controller=function() { /* widget controller */ var c = this;};
    serverScript Script Script côté serveur qui définit l’état initial du widget, envoie des données au script client du widget à l’aide de l’objet de données ou exécute des requêtes côté serveur. Cette propriété prend en charge le JavaScript en ligne ou une référence à un autre fichier dans l’application qui contient un script.
    Format :
    • Pour utiliser le contenu textuel d’un autre fichier, reportez-vous à un fichier de l’application en utilisant le format suivant : Now.include('chemin/vers/fichier'). Pour plus d'informations, consultez ServiceNow Fluent Constructions linguistiques.
    • Pour fournir un script inline, utilisez des chaînes de caractères ou des modèles de lignes de code : « Script » ou « Script ».
    Par défaut :
    (function () { /* populate the 'data' object */ /* e.g., data.table = $sp.getValue('table'); */ })();
    Contrôleurs A Chaîne Variable pour une référence au contrôleur dans le périmètre de la directive. Le script client accède par défaut à l’objet de données du serveur à l’aide de la variable c.data .

    Par défaut : c
    Modèle html Chaîne Le code HTML du corps qui définit ce qui est rendu lorsque la page est affichée. Il peut contenir du XHTML statique, du contenu généré dynamiquement défini comme Jelly ou des includes de script d’appel et des macros d’interface utilisateur. Cette propriété prend en charge une référence à un autre fichier dans l’application qui contient du HTML ou du HTML en ligne.
    Format :
    • Pour utiliser le contenu textuel d’un autre fichier, reportez-vous à un fichier de l’application en utilisant le format suivant : Now.include('chemin/vers/fichier'). Pour plus d'informations, consultez ServiceNow Fluent Constructions linguistiques.
    • Pour fournir du HTML en ligne, utilisez des chaînes de caractères ou des modèles littéraux pour plusieurs lignes de code : « HTML » ou « HTML ».
    Par défaut :
    <div><!-- your widget template --></div>
    customCss Chaîne CSS ou SCSS qui définit le style de widget. Cette propriété prend en charge une référence à un autre fichier dans l’application qui contient CSS ou CSS en ligne.
    Format :
    • Pour utiliser le contenu textuel d’un autre fichier, reportez-vous à un fichier de l’application en utilisant le format suivant : Now.include('chemin/vers/fichier'). Pour plus d'informations, consultez ServiceNow Fluent Constructions linguistiques.
    • Pour fournir du CSS en ligne, utilisez des chaînes de caractères ou des modèles pour plusieurs lignes de code : « CSS » ou « CSS ».
    Table de données Chaîne Table dans laquelle stocker les options d’instance de widget. Pour définir un schéma d’option personnalisé, vous pouvez ajouter des champs à une table qui étend la table Instance de widget [sp_instance] et configurer votre widget pour qu’il utilise la table d’extension comme source de données. Pour plus d'informations, consultez Store instance options in a table.

    Par défaut : sp_instance
    demoData (Données de démonstration) Chaîne ou objet Données qui démontrent la fonctionnalité du widget. Cette propriété prend en charge les chaînes en ligne, une référence à un autre fichier dans l’application qui contient JSON ou des objets sérialisables JSON en ligne.
    Format :
    • Pour utiliser le contenu textuel d’un autre fichier, reportez-vous à un fichier de l’application en utilisant le format suivant : Now.include('chemin/vers/fichier'). Pour plus d'informations, consultez ServiceNow Fluent Constructions linguistiques.
    • Pour fournir un JSON en ligne, utilisez un objet avec des paires clé/valeur : { key : value }.
    description Chaîne Description du widget et de son objectif.
    docs Référence L’identificateur de variable de la Portail de services documentation [sp_documentation] qui fournit des informations supplémentaires sur le widget et son objectif.

    Pour définir Portail de services la documentation, reportez-vous à .API d’enregistrement : ServiceNow Fluent
    champs Tableau Une liste de noms de colonnes de la table de données à utiliser dans le schéma de l’option de widget.
    hasPreview Booléen Marqueur indiquant si vous pouvez prévisualiser le widget à partir de l’éditeur de widget.
    Valeurs valides :
    • true : vous pouvez prévisualiser le widget à partir de l’éditeur de widget.
    • false : vous ne pouvez pas prévisualiser le widget à partir de l’éditeur de widget.

    Valeur par défaut : false
    id Chaîne Un ID unique pour le widget. L’ID ne peut pas contenir d’espaces.
    linkScript Script Fonction de lien qui utilise AngularJS pour manipuler directement le DOM. Cette propriété prend en charge le JavaScript en ligne ou une référence à un autre fichier dans l’application qui contient un script.
    Format :
    • Pour utiliser le contenu textuel d’un autre fichier, reportez-vous à un fichier de l’application en utilisant le format suivant : Now.include('chemin/vers/fichier'). Pour plus d'informations, consultez ServiceNow Fluent Constructions linguistiques.
    • Pour fournir un script inline, utilisez des chaînes de caractères ou des modèles de lignes de code : « Script » ou « Script ».
    Par défaut : 
    function link(scope, element, attrs, controller) { }
    roles Tableau Liste des identificateurs de variables d’objets de rôle ou de noms de rôles pouvant accéder au widget de ServiceNow. Pour en savoir plus, consultez API du rôle : ServiceNow Fluent.
    Schéma d’option Tableau Une liste de paramètres qu’un Portail de services administrateur (sp_admin) peut configurer pour une instance de widget. Le schéma d’option widget prend en charge la réutilisation d’un widget et la configuration unique des instances de celui-ci sur différentes pages. Pour plus d'informations, consultez Widget option schema.
    optionSchema: [
  {
    name: 'String',
    label: 'String',
    section: 'String',
    type: 'String',
    defaultValue: 'String',
    hint: 'String'
  },
...
]
    • nom : obligatoire. Nom du paramètre.
    • Étiquette : Obligatoire. Étiquette pour le paramètre qui apparaît dans les options d’instance de widget.
    • section : Obligatoire. Section des options d’instance de widget dans laquelle le paramètre apparaît.
      Valeurs valides :
      • données
      • Comportement de
      • documentation
      • présentation
      • autre
    • type : obligatoire. Type de données du paramètre.
      Valeurs valides :
      • chaîne
      • booléen
      • entier
      • référence
      • choix
      • Liste de champs
      • Fieldname
      • liste glideList
      • glyphIcon
    • defaultValue : valeur par défaut du paramètre.
    • conseil : une brève description du paramètre qui s’affiche sous forme d’info-bulle lorsque vous le survolez.
    publique Booléen Marqueur indiquant si le widget est disponible pour les utilisateurs non authentifiés.
    Valeurs valides :
    • vrai : les utilisateurs non authentifiés peuvent accéder au widget.
    • faux : seuls les utilisateurs authentifiés peuvent accéder au widget.

    Valeur par défaut : false
    dépendances Tableau Une liste des identificateurs de variables des objets ou des noms SPWidgetDependency ou sys_ids de dépendances pour le widget. Pour plus d'informations, consultez Objet SPWidgetDependency.
    angularProviders Tableau Liste des identificateurs de variables d’objets ou de noms SPAngularProvider ou sys_ids de fournisseurs Angular pour le widget. Pour plus d'informations, consultez Objet SPAngularProvider.
    modèles Tableau Une liste de modèles de nouvelle génération d’angle [sp_ng_template] à associer au widget. Les modèles ngular ng-templates contiennent du contenu qui n’est rendu que lorsque vous lui demandez de s’afficher.
    templates: [
  {
    $id: Now.ID['String' or Number]
    id: 'String'
    htmlTemplate: 'HTML' or `HTML` 
  },
  ...
]
    • $id : obligatoire. ID unique pour l’objet de métadonnées. Lorsque vous créez l’application, cet ID est haché en une sys_id unique.

      Format : Now.ID['chaîne' ou numéro]

    • ID : requis. ID du modèle de nouvelle génération d’angle.
    • htmlTemplate : obligatoire. Contenu du modèle HTML. Cette propriété prend en charge une référence à un autre fichier dans l’application qui contient du HTML ou du HTML en ligne.
    $meta Objet Métadonnées pour les métadonnées de l’application.
    Avec la propriété installMethod , vous pouvez mapper les métadonnées d’application à un répertoire de sortie qui ne se charge que dans des circonstances spécifiques.
    $meta: {
      installMethod: 'String'
}
    Valeurs valides pour installMethod :
    • demo : génère les métadonnées de l’application dans le répertoire metadata/unload.demo à installer avec l’application lorsque l’option Charger les données de démonstration est sélectionnée.
    • première installation : génère les métadonnées de l’application dans le répertoire metadata/unload à installer uniquement la première fois qu’une application est installée sur une instance.
    		 
    import { SPWidget } from '@servicenow/sdk/core'

SPWidget({
    $id: 'my_simple_widget',
    name: 'My Simple Widget',
    category: 'knowledgeBase',
    clientScript: Now.include('./client.js'),
    serverScript: Now.include('./server.js'),
    controllerAs: '$ctrl',
    customCss: Now.include('./custom_css.css'),
    dataTable: 'sp_instance',
    demoData: { message: 'Hello, World!' },
    description: 'This is a test widget',
    docs: widgetDoc,
    htmlTemplate: Now.include('./template.html'),
    fields: ['color', 'class_name'],
    hasPreview: true,
    id: 'my-simple-widget',
    linkScript: Now.include('./link.client.js'),
    optionSchema: [
        {
            name: 'my_option',
            label: 'My Option',
            type: 'string',
            section: 'behavior'
        }
    ],
    roles: [manager, 'admin'],
})

    Objet SPAngularProvider

    Créez un fournisseur d’angle [sp_angular_provider] pour réutiliser des composants dans plusieurs widgets et améliorer les performances du portail.

    Tableau 2. Propriétés
    Nom Type Description
    $id Chaîne ou numéro Requis. ID unique pour l’objet de métadonnées. Lorsque vous créez l’application, cet ID est haché en une sys_id unique. Pour en savoir plus, consultez ServiceNow Fluent Constructions linguistiques.

    Format : Now.ID['chaîne' ou numéro]
    nom Chaîne Requis. Nom du fournisseur Angular.
    Script client Script Script côté client à réutiliser dans les widgets.Cette propriété prend en charge le JavaScript en ligne ou une référence à un autre fichier dans l’application qui contient un script.
    Format :
    • Pour utiliser le contenu textuel d’un autre fichier, reportez-vous à un fichier de l’application en utilisant le format suivant : Now.include('chemin/vers/fichier'). Pour plus d'informations, consultez ServiceNow Fluent Constructions linguistiques.
    • Pour fournir un script inline, utilisez des chaînes de caractères ou des modèles de lignes de code : « Script » ou « Script ».
    type Chaîne Le type de fournisseur Angular.
    Valeurs valides :
    • directive
    • usine
    • service

    Par défaut : directive
    Nécessite Tableau Liste des identificateurs de variables d’autres objets ou noms SPAngularProvider ou sys_ids de fournisseurs Angular.
    $meta Objet Métadonnées pour les métadonnées de l’application.
    Avec la propriété installMethod , vous pouvez mapper les métadonnées d’application à un répertoire de sortie qui ne se charge que dans des circonstances spécifiques.
    $meta: {
      installMethod: 'String'
}
    Valeurs valides pour installMethod :
    • demo : génère les métadonnées de l’application dans le répertoire metadata/unload.demo à installer avec l’application lorsque l’option Charger les données de démonstration est sélectionnée.
    • première installation : génère les métadonnées de l’application dans le répertoire metadata/unload à installer uniquement la première fois qu’une application est installée sur une instance.
    		 
    import { SPAngularProvider } from '@servicenow/sdk/core'
const OTHER_ANGULAR_PROVIDER = 'd11f285fe069e1f119b44bd05c0770aa'

SPAngularProvider({
    $id: 'my_angular_provider',
    name: 'my_angular_provider',
    clientScript: Now.include('my_angular_provider.client.js'),
    type: 'directive',
    requires: [OTHER_ANGULAR_PROVIDER]
})

    Objet SPWidgetDependency

    Créez une dépendance de widget [sp_dependency] pour lier des fichiers JavaScript et CSS à des widgets et utiliser des bibliothèques tierces, des feuilles de style externes ou des modules Angular.

    Les dépendances sont chargées de façon asynchrone à partir du serveur si nécessaire. Les widgets peuvent avoir autant ou aussi peu de dépendances que nécessaire. Cependant, plus vous en ajoutez, plus un widget doit télécharger de contenu pour s’afficher sur la page. Réduisez au maximum les dépendances pour des temps de chargement plus efficaces. Pour plus d'informations, consultez Create a widget dependency.

    Tableau 3. Propriétés
    Nom Type Description
    $id Chaîne ou numéro Requis. ID unique pour l’objet de métadonnées. Lorsque vous créez l’application, cet ID est haché en une sys_id unique. Pour en savoir plus, consultez ServiceNow Fluent Constructions linguistiques.

    Format : Now.ID['chaîne' ou numéro]
    nom Chaîne Requis. Le nom de la dépendance de widget.
    nom du module angulaire Chaîne Nom du module d’angle à charger si l’include JS est un module d’angle.
    includeOnPageLoad Booléen Marqueur indiquant quand la dépendance se charge sur une page.
    Valeurs valides :
    • vrai : la dépendance se charge avec le chargement initial de la page.
    • false : la dépendance se charge uniquement lorsque le widget lié est chargé sur une page.

    Valeur par défaut : false
    Includes cssIncludes Tableau Une liste des identificateurs de variables d’objets CSSInclude ou de sys_ids d’includes CSS et leur ordre. Pour plus d'informations, consultez Objet CssInclude.
    cssIncludes: [
  {
    order: Number,
    include: 'String' or Reference,
  },
  ...
]
    jsIncludes Tableau Identificateurs de variables de liste d’objets JsInclude ou de sys_ids d’includes JS et leur ordre. Pour plus d'informations, consultez Objet JsInclude.
    jsIncludes: [
  {
    order: Number,
    include: 'String' or Reference,
  },
  ...
]
    portailsForPageLoad Tableau Une liste des sys_ids de portails [sp_portal] qui chargent la dépendance de widget. Si ce champ est vide, la dépendance est incluse dans le chargement des pages pour tous les portails.
    $meta Objet Métadonnées pour les métadonnées de l’application.
    Avec la propriété installMethod , vous pouvez mapper les métadonnées d’application à un répertoire de sortie qui ne se charge que dans des circonstances spécifiques.
    $meta: {
      installMethod: 'String'
}
    Valeurs valides pour installMethod :
    • demo : génère les métadonnées de l’application dans le répertoire metadata/unload.demo à installer avec l’application lorsque l’option Charger les données de démonstration est sélectionnée.
    • première installation : génère les métadonnées de l’application dans le répertoire metadata/unload à installer uniquement la première fois qu’une application est installée sur une instance.
    		 
    import { SPWidgetDependency } from '@servicenow/sdk/core'

SPWidgetDependency({
    $id: 'samplejs',
    name: 'Sample',
    angularModuleName: 'samplejs',
    includeOnPageLoad: true,
    portalsForPageLoad: ['b4572a48262a16df3032b48cef75a853', 'fe12dbbed14bd3f712f0787141c2f656'],
    cssIncludes: [
        {
            order: 100,
            include: localCss,
        },
        {
            order: 200,
            include: '94112ccb0fb3c2ed072b01d3cb401196',
        },
    ],
    jsIncludes: [
        {
            order: 100,
            include: localJs,
        },
        {
            order: 200,
            include: 'f8af18a5e6c71a3702c4f2038b43cf62',
        },
    ],
})

    Objet CssInclude

    Créez un include CSS [sp_css_include] pour référencer une feuille de style ou un CSS externe dans une dépendance de widget.

    Tableau 4. Propriétés
    Nom Type Description
    $id Chaîne ou numéro Requis. ID unique pour l’objet de métadonnées. Lorsque vous créez l’application, cet ID est haché en une sys_id unique. Pour en savoir plus, consultez ServiceNow Fluent Constructions linguistiques.

    Format : Now.ID['chaîne' ou numéro]
    nom Chaîne Requis. Le nom de l’include CSS.
    URL Chaîne L’URL vers un fichier CSS externe. Cette propriété est requise si une feuille de style n’est pas fournie avec la propriété spCss.
    spCss Chaîne La sys_id d’une feuille de style [sp_css]. Cette propriété est requise si un fichier CSS externe n’est pas fourni avec la propriété url .
    rtlCssUrl Chaîne URL d’un fichier CSS externe de droite à gauche (RTL) pour mettre en miroir la direction d’un widget lorsque la langue de la session est une langue de droite à gauche, comme l’hébreu. Pour plus d'informations, consultez Styling for right-to-left languages in portals.
    chargement différé Booléen Marqueur indiquant comment charger l’include CSS. Cette propriété s’applique uniquement si vous utilisez la propriété spCSS pour spécifier une feuille de style.
    Valeurs valides :
    • true : l’include CSS se charge de manière asynchrone pour améliorer le temps de chargement des pages.
    • false : l’include CSS ne se charge pas de manière asynchrone.

    Valeur par défaut : false
    $meta Objet Métadonnées pour les métadonnées de l’application.
    Avec la propriété installMethod , vous pouvez mapper les métadonnées d’application à un répertoire de sortie qui ne se charge que dans des circonstances spécifiques.
    $meta: {
      installMethod: 'String'
}
    Valeurs valides pour installMethod :
    • demo : génère les métadonnées de l’application dans le répertoire metadata/unload.demo à installer avec l’application lorsque l’option Charger les données de démonstration est sélectionnée.
    • première installation : génère les métadonnées de l’application dans le répertoire metadata/unload à installer uniquement la première fois qu’une application est installée sur une instance.
    		 
    import { CssInclude } from '@servicenow/sdk/core'

const localCss = CssInclude({
    $id: '22bcf16da81e2bc0340c53d50d531adf',
    name: 'Sample Styles',
    spCss: '50e3e32aa321b1c7d1945c5f423228bd',
})

    Objet JsInclude

    Créez un include JS [sp_js_include] pour référencer un script d’interface utilisateur ou du code JavaScript externe dans une dépendance de widget.

    Tableau 5. Propriétés
    Nom Type Description
    $id Chaîne ou numéro Requis. ID unique pour l’objet de métadonnées. Lorsque vous créez l’application, cet ID est haché en une sys_id unique. Pour en savoir plus, consultez ServiceNow Fluent Constructions linguistiques.

    Format : Now.ID['chaîne' ou numéro]
    nom Chaîne Requis. Nom de l’include JS.
    URL Chaîne L’URL vers un fichier JavaScript externe. L’URL doit être un chemin d’accès absolu. Cette propriété est requise si un script d’interface utilisateur n’est pas fourni avec la propriété sysUiScript .
    sysUiScript Chaîne La sys_id d’un script d’interface utilisateur [sys_ui_script]. Cette propriété est requise si un fichier JavaScript externe n’est pas fourni avec la propriété url .
    $meta Objet Métadonnées pour les métadonnées de l’application.
    Avec la propriété installMethod , vous pouvez mapper les métadonnées d’application à un répertoire de sortie qui ne se charge que dans des circonstances spécifiques.
    $meta: {
      installMethod: 'String'
}
    Valeurs valides pour installMethod :
    • demo : génère les métadonnées de l’application dans le répertoire metadata/unload.demo à installer avec l’application lorsque l’option Charger les données de démonstration est sélectionnée.
    • première installation : génère les métadonnées de l’application dans le répertoire metadata/unload à installer uniquement la première fois qu’une application est installée sur une instance.
    		 
    import { JsInclude } from '@servicenow/sdk/core'

const localJs = JsInclude({
    $id: '98239e4eadfac88b01cce7daa23b6fc3',
    name: 'Sample Framework',
    sysUiScript: 'b67af05645f738df1f286bb3e9ecd55f',
})