websocket 将变量从Chrome发送到VSCode

7gcisfzg  于 2022-11-24  发布在  Vscode
关注(0)|答案(1)|浏览(172)

我想在点击事件期间从Chrome发送一个变量,并通过VSCode扩展接收VSCode中的变量。
click事件不是问题所在。我正在努力接收VSCode中的数据。
This可以工作,但我只能从它那里得到一个延迟的结果(见下文)。

**问题:**在您看来,哪一个是最好的解决方案?

我在解决方案中添加了一个答案。

延迟的结果来自所提供链接中的示例:

建议代码:

import * as vscode from 'vscode';

export function activate(context: vscode.ExtensionContext) {
    const handleUri = (uri: vscode.Uri) => {
        // this doesn't log
        console.log('testing', uri);
        const queryParams = new URLSearchParams(uri.query);
        if (queryParams.has('say')) {
            vscode.window.showInformationMessage(`URI Handler says: ${queryParams.get('say') as string}`);
        }
    };

    context.subscriptions.push(
        vscode.window.registerUriHandler({
          handleUri
        })
    );
}

export function deactivate() {}

但是,只有此示例会立即记录所需的结果:

import * as vscode from 'vscode';

export function activate(context: vscode.ExtensionContext) {
    const handleUri = (uri: vscode.Uri) => {
        // this doesn't log
        console.log('testing', uri);
        const queryParams = new URLSearchParams(uri.query);
        if (queryParams.has('say')) {
            vscode.window.showInformationMessage(`URI Handler says: ${queryParams.get('say') as string}`);
        }
    };

    context.subscriptions.push(
        vscode.window.registerUriHandler({
          handleUri
        })
    );
    let disposable = vscode.commands.registerCommand('my-org.myExtension', function () {
        vscode.window.showInformationMessage('Hello World');
        vscode.window.registerUriHandler({ handleUri })
    });

    context.subscriptions.push(disposable);
}

export function deactivate() {}

在上面的第一个示例中,handleUri函数按预期被调用,但是日志打印得很晚(我不得不在第二个示例中调用命令来查看“testing”和记录的uri)。

g9icjywg

g9icjywg1#

事实证明,这是一个很好的解决方案,但不是我选择的解决方案...
缺点:
1.它将只打开最近使用的VSCode窗口中的链接;它不会将数据发送到每个VSCode窗口,这对于您的预期用途可能是个问题。
1.如果您希望通过 AJAX 从浏览器静默发送数据,则需要使用以vscode://开头的URI,这不像http://那样容易实现。
所以我做了一个简单的服务器,这就容易多了。
在VSCode中:

const vscode = require('vscode');
const handler = require('serve-handler');
const http = require('http');

/**
 * @param {vscode.ExtensionContext} context
 */
function activate(context) {

    let disposable = vscode.commands.registerCommand('myExtension.startServer', function () {
        // The code you place here will be executed every time your command is executed
        const server = http.createServer((req, res) => {
            const headers = {
                'Access-Control-Allow-Origin': '*', /* @dev First, read about security */
                'Access-Control-Allow-Methods': 'OPTIONS, POST, GET',
                'Access-Control-Max-Age': 2592000, // 30 days
                /** add other headers as per requirement */
            };
        
            if (req.method === 'OPTIONS') {
                res.writeHead(204, headers);
                res.end();
                return;
            }
        
            if (['GET', 'POST'].indexOf(req.method) > -1) {
                res.writeHead(200, headers);
                var url = new URL('http://localhost:6000' + req.url);
                var param = url.searchParams.get('param');
                console.log('Param: ', param)
                res.end('Hello World');
                return;
            }
        
            res.writeHead(405, headers);
            res.end(`${req.method} is not allowed for the request.`);

            // You pass two more arguments for config and middleware
            // More details here: https://github.com/vercel/serve-handler#options
            return handler(req, res);
        });
        
        server.listen(6000, () => {
            console.log('Running at http://localhost:6000');
        });

        // Display a message box to the user
    });

    context.subscriptions.push(disposable);
}

// this method is called when your extension is deactivated
function deactivate() {}

然后从客户端的浏览器中发出AJAX请求:

const response = await fetch('http://localhost:3000/?param=1234' , {
  method: 'GET'
})

我希望这能帮助到一些人。

相关问题