Reverse proxy PowerShell Universal : héberger VS Code dans le navigateur avec YARP

PowerShell Universal a toujours consisté à créer des outils avec du code. C’est pourquoi nous avons consacré beaucoup de temps à l’expérience d’édition. Cela a donné des fonctions comme la complétion de code et PSScriptAnalyzer dans la console d’administration, ainsi que l’extension Universal pour VS Code.

Dans cet article, nous verrons comment aller plus loin et héberger VS Code directement dans le navigateur grâce à une nouvelle fonction de PSU prévue dans la v4.2 : les reverse proxies.

YARP (Yet Another Reverse Proxy)

YARP est une technologie, bâtie sur ASP.NET, qui permet de proxifier des services web locaux et distants. Cela signifie que vous pouvez utiliser un seul point de terminaison et un seul port pour exposer un autre point de terminaison ou port. Par exemple, si un service écoute sur le port 5000 et un autre sur le port 8080, vous pouvez proxifier du premier vers le second via un chemin ou un en-tête configurable.

Par exemple, imaginez une requête web vers le premier service à ce chemin : http://localhost:5000/myservice/mypath. Avec la bonne configuration YARP, vous pouvez transférer cette requête vers le service sur 8080, vers un chemin comme http://localhost:8080/mypath. Les configurations YARP offrent une multitude d’options pour transformer les chemins et les en-têtes, appliquer l’authentification et regrouper des points de terminaison.

YARP a été intégré à PowerShell Universal v4.2 et commencera à être livré dans les builds nightly ce soir. Vous pouvez aussi consulter la documentation actuelle du plugin YARP.

code-server

code-server est un fork open source de VS Code qui s’exécute dans le navigateur, par Coder. Ce fork de VS Code est multiplateforme et s’exécute comme un service, avec de nombreuses options de configuration, des ports à l’authentification. Il prend même en charge les extensions.

Configurer code-server avec PowerShell Universal

Un déploiement utile de code-server consiste à l’utiliser comme éditeur de vos fichiers de configuration PowerShell Universal. En général, pour modifier des fichiers à distance, il faut passer par la console d’administration Universal ou par l’extension Universal pour VS Code. Les deux options ont des limites, alors disposer d’une instance complète de VS Code accessible à distance est bien pratique.

Installer code-server

D’abord, nous installerons et configurerons code-server. Cela doit se faire sur l’instance PSU pour y accéder à distance. Nous ne l’exposerons pas vraiment à distance : nous utiliserons le nouveau reverse proxy PSU pour appliquer l’authentification et l’autorisation.

Parce que l’installation de code-server ne prend pas Windows en charge directement, nous utiliserons Docker.

D’abord, récupérez l’image Docker.

docker pull codercom/code-server:latest

Ensuite, vous pouvez démarrer l’image Docker et monter le répertoire du dépôt dans le conteneur. Cela donnera accès aux fichiers de configuration PSU.

docker run --name code-server -p 127.0.0.1:8080:8080 `
    -v /c/ProgramData/UniversalAutomation/Repository:/home/coder/project `
    -e "DOCKER_USER=$ENV:USERNAME" `
    codercom/code-server:latest

Dans le conteneur Docker, vous pouvez désactiver l’authentification dans le fichier /home/coder/.config/code-server/config.yaml. Nous utiliserons plutôt l’authentification PSU.

bind-addr: 127.0.0.1:8080
auth: none
cert: false

Une fois cela fait, vous devrez redémarrer votre conteneur. Vous devriez pouvoir voir code-server en allant à http://localhost:8080 dans le navigateur.

Configuration du reverse proxy PSU

Ensuite, il faut configurer le reverse proxy PSU. Cela se fait actuellement dans le fichier appsettings.json. Vous pouvez modifier le fichier dans %ProgramData%\PowerShellUniversal.

La configuration suivante expose code-server via le chemin /code du serveur PSU. Notez que j’inclus AdministratorRolePolicy pour que seuls les administrateurs puissent accéder à ce chemin.

{
    "ReverseProxy": {
        "Routes": {
            "route1": {
                "ClusterId": "cluster1",
                "AuthorizationPolicy": "AdministratorRolePolicy",
                "Match": {
                    "Path": "/code/{**catch-all}"
                },
                "Transforms": [
                    {
                        "PathRemovePrefix": "/code"
                    }
                ]
            }
        },
        "Clusters": {
            "cluster1": {
                "Destinations": {
                    "destination1": {
                        "Address": "http://localhost:8080"
                    }
                }
            }
        }
    }
}

Une fois terminé, démarrez PowerShell Universal. Connectez-vous en allant à http://localhost:5000/login. Enfin, allez à http://localhost:5000/code. Vous verrez VS Code dans votre navigateur et le dossier du dépôt sera accessible. À partir de là, vous pouvez installer des extensions (comme PowerShell) et commencer à gérer votre instance PSU.

Précautions et perspectives

L’intégration de YARP dans PSU aura des usages bien plus larges que l’hébergement de VS Code. Vous pourrez transférer vers toutes sortes d’API et appliquer la même authentification et autorisation PSU que pour PSU lui-même. Nous explorons encore la meilleure façon d’exposer cette fonctionnalité dans PSU, alors elle pourrait changer avant la publication.

Il s’agit encore d’une build nightly et nous ne prenons pas encore cette fonctionnalité en charge. Vous devez aussi bien comprendre votre implémentation de code-server pour ne pas exposer une instance VS Code ouverte à des utilisateurs sans authentification. Des terminaux peuvent être créés et donner aux utilisateurs distants le contrôle complet de votre serveur PSU. Coder offre un outil d’équipe complet (Coder Enterprise) avec plus de fonctions, mieux adapté à ce type d’usage.

N’hésitez pas à nous écrire pour des commentaires ou des questions sur les forums.

Prêt à construire? Téléchargez PowerShell Universal.