2.27.2 • Published 3 months ago

@opensumi/ide-connection v2.27.2

Weekly downloads
-
License
MIT
Repository
github
Last release
3 months ago

通信模块(connection)

基于 jsonrpc 完成多端远程调用场景,兼容 lsp 等通信方式

opensumi 中使用

准备 1. 框架中服务分为运行在浏览器环境的 前端服务(frontService) 与运行在 node 环境的 后端服务(backService),服务在两端的实现方式是一致的 2. 目前在 tools/dev-tool 中的启动逻辑中完成了服务的注册和获取逻辑,在具体功能模块中无需关心具体的通信注册获取逻辑

后端服务(backService) 后端服务(backService) 即在 Web Server 暴露的能力,类似 web 应用框架中 controller提供的请求响应逻辑

  1. 注册服务

packages/file-service/src/node/index.ts

import { FileSystemNodeOptions, FileService } from './file-service';
import {servicePath} from '../common/index';

export class FileServiceModule extends NodeModule {
  providers = [{ token: 'FileServiceOptions', useValue: FileSystemNodeOptions.DEFAULT }];

  backServices = [
    {
      servicePath,
      token: FileService,
    },
  ];
}

例如在 file-service 模块中,通过定义 backServices 数组,传递模块提供的后端服务,servicePath 为前端模块引用的服务地址,以及对应服务的注入 token

  1. 服务调用

packages/file-tree/src/browser/index.ts

import {servicePath as FileServicePath} from '@opensumi/ide-file-service';

@Injectable()
export class FileTreeModule extends BrowserModule {

  providers: Provider[] = [
    createFileTreeAPIProvider(FileTreeAPIImpl),
  ];
  backServices = [{
    servicePath: FileServicePath,
  }];
}

例如在 file-tree 模块中,首先在模块入口位置声明需要用到的 backServices,传入引用的服务 servicePath,与服务注册时的 servicePath 一致

packages/file-tree/src/browser/file-tree.service.ts

import {servicePath as FileServicePath} from '@opensumi/ide-file-service';

@Injectable()
export default class FileTreeService extends Disposable {

  @observable.shallow
  files: CloudFile[] = [];

  @Autowired()
  private fileAPI: FileTreeAPI;

  @Autowired(CommandService)
  private commandService: CommandService;

  constructor(@Inject(FileServicePath) protected readonly fileSevice) {
    super();

    this.getFiles();
  }
   createFile = async () => {
    const {content} = await this.fileSevice.resolveContent('/Users/franklife/work/ide/ac/ide-framework/tsconfig.json');
    const file = await this.fileAPI.createFile({
      name: 'name' + Date.now() + '\n' + content,
      path: 'path' + Date.now(),
    });

    // 只会执行注册在 Module 里声明的 Contribution
    this.commandService.executeCommand('file.tree.console');

    if (this.files) {
      this.files.push(file);
    } else {
      this.files = [file];
    }
  }
}

在 file-tree.service.ts 中通过 servicePath 进行注入,并直接调用在服务类上的方法

constructor(@Inject(FileServicePath) protected readonly fileSevice) {
    super();

    this.getFiles();
  }

方法调用会转换成一个远程调用进行响应,返回结果

const {content} = await this.fileSevice.resolveContent('/Users/franklife/work/ide/ac/ide-framework/tsconfig.json');

前端服务(frontService) 后端服务(backService) 即在 Browser 环境下运行的代码暴露的能力

  1. 注册服务

packages/file-ree/src/browser/index.ts

@Injectable()
export class FileTreeModule extends BrowserModule {

  providers: Provider[] = [
    createFileTreeAPIProvider(FileTreeAPIImpl),
  ];
  backServices = [{
    servicePath: FileServicePath,
  }];
  frontServices = [{
    servicePath: FileTreeServicePath,
    token: FileTreeService,
  }];
}

与后端服务注册类似,例如在 file-tree 模块中声明 frontServices 字段,传入对应的服务地址 servicePath 和对应服务的注入 token

  1. 服务使用

packages/file-service/src/node/index.ts

import {servicePath as FileTreeServicePath} from '@opensumi/ide-file-tree';

@Injectable()
export class FileServiceModule extends NodeModule {
  providers = [{ token: 'FileServiceOptions', useValue: FileSystemNodeOptions.DEFAULT }];

  backServices = [
    {
      servicePath,
      token: FileService,
    },
  ];
  frontServices = [
    {
      servicePath: FileTreeServicePath,
    },
  ];
}

与使用后端服务一致,在模块定义中声明需要使用的前端服务 frontServices,传入前端服务注册时用的 servicePath 一致

packages/file-service/src/node/file-service.ts

@Injectable()
export class FileService implements IFileService {

  constructor(
    @Inject('FileServiceOptions') protected readonly options: FileSystemNodeOptions,
    @Inject(FileTreeServicePath) protected readonly fileTreeService
  ) { }

  async resolveContent(uri: string, options?: { encoding?: string }): Promise<{ stat: FileStat, content: string }> {
    const fileTree = await this.fileTreeService
    fileTree.fileName(uri.substr(-5))

    ...
    return { stat, content };
  }

与使用后端服务使用方式一致,在 file-service.ts 中通过 servicePath 进行注入,通过调用注入服务的对应方法

  constructor(
    @Inject('FileServiceOptions') protected readonly options: FileSystemNodeOptions,
    @Inject(FileTreeServicePath) protected readonly fileTreeService
  ) { }

方法调用会转换成一个远程调用进行响应,返回结果

const fileTree = await this.fileTreeService
fileTree.fileName(uri.substr(-5))

与后端服务调用区别的是,目前因前端代码后置执行,所以首先需要获取服务 await thie.fileTreeService 后进行调用

2.27.2

4 months ago

2.26.7

8 months ago

2.26.6

9 months ago

2.26.8

8 months ago

2.26.3

9 months ago

2.26.2

10 months ago

2.26.5

9 months ago

2.26.4

9 months ago

2.26.1

10 months ago

2.26.0

10 months ago

2.27.1

6 months ago

2.27.0

7 months ago

2.25.4

10 months ago

2.25.3

10 months ago

2.25.2

11 months ago

2.25.0

11 months ago

2.25.1

11 months ago

2.24.5

12 months ago

2.24.4

12 months ago

2.24.6

11 months ago

2.24.3

12 months ago

2.24.2

12 months ago

2.23.6

1 year ago

2.23.5

1 year ago

2.23.2

1 year ago

2.23.1

1 year ago

2.23.4

1 year ago

2.23.3

1 year ago

2.22.7

1 year ago

2.22.6

1 year ago

2.22.9

1 year ago

2.22.8

1 year ago

2.22.5

1 year ago

2.22.10

1 year ago

2.22.11

1 year ago

2.24.1

1 year ago

2.24.0

1 year ago

2.23.0

1 year ago

2.22.3

1 year ago

2.22.2

1 year ago

2.22.4

1 year ago

2.22.1

1 year ago

2.22.0

1 year ago

2.21.8

1 year ago

2.21.7

1 year ago

2.21.9

1 year ago

2.21.11

1 year ago

2.21.10

1 year ago

2.21.13

1 year ago

2.21.12

1 year ago

2.21.2

1 year ago

2.21.4

1 year ago

2.21.3

1 year ago

2.21.6

1 year ago

2.21.5

1 year ago

2.20.13

1 year ago

2.20.12

1 year ago

2.21.0

2 years ago

2.21.1

2 years ago

2.20.3

2 years ago

2.20.8

2 years ago

2.20.9

2 years ago

2.20.6

2 years ago

2.20.7

2 years ago

2.20.4

2 years ago

2.20.5

2 years ago

2.20.10

2 years ago

2.20.11

2 years ago

2.20.2

2 years ago

2.20.0

2 years ago

2.20.1

2 years ago

2.19.9

2 years ago

2.19.13

2 years ago

2.19.14

2 years ago

2.19.10

2 years ago

2.19.11

2 years ago

2.19.12

2 years ago

2.19.8

2 years ago

2.19.6

2 years ago

2.19.7

2 years ago

2.19.4

2 years ago

2.19.5

2 years ago

2.19.2

2 years ago

2.19.3

2 years ago

2.19.0

2 years ago

2.19.1

2 years ago

2.18.9

2 years ago

2.18.7

2 years ago

2.18.8

2 years ago

2.18.5

2 years ago

2.18.6

2 years ago

2.18.4

2 years ago

2.18.17

2 years ago

2.18.12

2 years ago

2.18.13

2 years ago

2.18.14

2 years ago

2.18.15

2 years ago

2.18.10

2 years ago

2.18.11

2 years ago

2.17.12

2 years ago

2.18.3

2 years ago

2.18.1

2 years ago

2.18.2

2 years ago

2.18.0

2 years ago

2.16.15

2 years ago

2.16.14

2 years ago

2.16.13

2 years ago

2.17.8

2 years ago

2.17.9

2 years ago

2.17.6

2 years ago

2.17.7

2 years ago

2.17.4

2 years ago

2.17.5

2 years ago

2.17.2

2 years ago

2.17.3

2 years ago

2.17.11

2 years ago

2.17.10

2 years ago

2.14.5

2 years ago

2.16.11

2 years ago

2.16.10

2 years ago

2.16.12

2 years ago

2.17.0

2 years ago

2.17.1

2 years ago

2.16.9

2 years ago

2.16.7

2 years ago

2.16.8

2 years ago

2.16.5

2 years ago

2.16.6

2 years ago

2.16.3

2 years ago

2.16.4

2 years ago

2.16.1

2 years ago

2.16.2

2 years ago

2.15.8

2 years ago

2.15.9

2 years ago

2.15.6

2 years ago

2.15.7

2 years ago

2.15.4

2 years ago

2.15.5

2 years ago

2.15.3

2 years ago

2.16.0

2 years ago

2.13.10

2 years ago

2.13.8

2 years ago

2.13.9

2 years ago

2.13.6

2 years ago

2.13.7

2 years ago

2.15.2

2 years ago

2.13.5

2 years ago

2.15.0

2 years ago

2.15.1

2 years ago

2.14.3

2 years ago

2.14.4

2 years ago

2.14.1

2 years ago

2.14.2

2 years ago

2.14.0

2 years ago

2.13.5-next.0

2 years ago

2.12.1-next.166

2 years ago

2.13.4

2 years ago

2.13.3

2 years ago

2.13.2

2 years ago

2.13.1

2 years ago

2.13.0

2 years ago