Existem várias maneiras de armazenar as preferências do usuário no VSCode. Antes da chegada da versão 1.53.0, as informações confidenciais tinham que ser armazenadas em objetos Memento em workspaceState e globalState ou, por exemplo, keytar . E armazenar senhas com tokens em um arquivo de configuração padrão ou usar variáveis de ambiente não era a melhor ideia, uma vez que esses dados poderiam ser lidos e armazenados em cache por outras extensões.
No artigo, veremos maneiras de ler dados de settings.json
e environment variables
. E então criaremos uma classe com funcionalidade mínima responsável por armazenar e servir chaves com valores do VSCode SecretStorage.
Iremos nomear convencionalmente o projeto fancycolor
. O processo de inicialização do projeto é detalhado na documentação do VSCode Extensions , portanto, vamos começar imediatamente.
settings.json
Todas as configurações de todas as extensões VSCode são armazenadas em um arquivo comum settings.json
e, portanto, podem ser acessadas de qualquer extensão. Por exemplo, em nosso aplicativo, fancycolor
podemos ler facilmente uma lista de todos os hosts e suas plataformas correspondentes em nossa configuração de outro aplicativo popular SSH - Remote
.
const configurationWorkspace = workspace.getConfiguration()
const sshRemotePlatform: string | undefined = configurationWorkspace.get(
"remote.SSH.remotePlatform"
)
console.log(sshRemotePlatform)
Este código listará sua configuração para a extensão SSH - Remote
.
Proxy {ubuntu: 'linux', home: 'linux', raspberry: 'linux'}
variáveis ambientais
VSCode . .bashrc
Linux User.Environment
Windows process.env
.
/home/ubuntu/.env
ACCESS_TOKEN_ENV
.bashrc
.
echo 'export ACCESS_TOKEN_ENV="d8aba3b2-fda0-414a-b867-4798b7892bb4"' >> /home/ubuntu/.env
echo "source /home/ubuntu/.env" >> /home/ubuntu/.bashrc
Windows Powershell.
[System.Environment]::SetEnvironmentVariable('ACCESS_TOKEN_ENV', 'd8aba3b2-fda0-414a-b867-4798b7892bb4', [System.EnvironmentVariableTarget]::User)
VSCode fancycolor
extension.
import * as process from "process"
export const accessTokenEnv = process.env["ACCESS_TOKEN_ENV"]
console.log(accessTokenEnv)
.
d8aba3b2-fda0-414a-b867-4798b7892bb4
SecretStorage
, , VSCode. AuthSettings
, fancycolor_token
, :
init
SecretStorage
getter
instance
storeAuthData
SecretStorage
getAuthData
SecretStorage
import { ExtensionContext, SecretStorage } from "vscode"
export default class AuthSettings {
private static _instance: AuthSettings
constructor(private secretStorage: SecretStorage) {}
static init(context: ExtensionContext): void {
/*
Create instance of new AuthSettings.
*/
AuthSettings._instance = new AuthSettings(context.secrets)
}
static get instance(): AuthSettings {
/*
Getter of our AuthSettings existing instance.
*/
return AuthSettings._instance
}
async storeAuthData(token?: string): Promise<void> {
/*
Update values in bugout_auth secret storage.
*/
if (token) {
this.secretStorage.store("fancycolor_token", token)
}
}
async getAuthData(): Promise<string | undefined> {
/*
Retrieve data from secret storage.
*/
return await this.secretStorage.get("fancycolor_token")
}
}
A extension.ts
funcionalidade de gravação permite adicionar e recuperar o token usando os comandos na Paleta de comandos.
import * as vscode from "vscode"
import AuthSettings from "./settings"
export function activate(context: vscode.ExtensionContext) {
// Initialize and get current instance of our Secret Storage
AuthSettings.init(context)
const settings = AuthSettings.instance
// Register commands to save and retrieve token
vscode.commands.registerCommand("fancycolor.setToken", async () => {
const tokenInput = await vscode.window.showInputBox()
await settings.storeAuthData(tokenInput)
})
vscode.commands.registerCommand("fancycolor.getToken", async () => {
const tokenOutput = await settings.getAuthData()
console.log(tokenOutput)
})
}
export function deactivate() {}
Resta apenas package.json
registrar os comandos fancycolor.setToken
e fancycolor.getToken
. Posteriormente, ao trabalhar com VSCode SecretStorage, poderemos nos referir exclusivamente ao SecretStorage específico criado para nosso aplicativo, que será atribuído ao nosso _id: 'undefined_publisher.fancycolor'
.