远程控制Chrome浏览器页签

设计思路

后端启用一个websocket服务，插件监听websocket服务，写一个html页面用于远程控制，通过页面发送指令到websocket服务端，插件接收到websocket服务的消息，根据指令去操作浏览器页签。

安装使用

安装nodejs

下载项目

加载扩展程序

打开Chrome浏览器的开发者模式，加载未打包的扩展程序，选择项目文件夹

加载成功

启动后端服务

切换页签

打开ctrl-tab.html进行切换。

测试切换页签。

远程切换

直接打开ctrl-tab.html进行切换，只能在本机测试，根据下面的调试测试步骤，修改相应的服务地址和端口，在网络联通的情况下进行切换。

如果想用平板操作，可以用httpd或nginx搭建一个http服务，把ctrl-tab.html放到http服务器上，用平板浏览器访问控制页面。

禁用插件

插件可能会部署到多台服务器，在不用远程切换页签的功能时可以把插件禁用掉，以免其他服务器受到影响，或者修改background.js中ws://localhost:3000的配置，连接一个错误的地址或端口，重新加载插件即可。

或者部署多套服务，保证每个服务器的服务都是独立的。

调试测试

端口配置

server.js中const wss = new WebSocket.Server({port: 3000});，3000是服务端口，按需修改。

background.js中ws = new WebSocket("ws://localhost:3000");，localhost是server.js运行机器的地址，3000是服务端口，按需修改。

ctrl-tab.html中const ws = new WebSocket("ws://localhost:3000");，localhost是server.js运行机器的地址，3000是服务端口，按需修改。

3个文件中的端口号需保持一致。

控制页面修改

ctrl-tab.html是控制网页，样式、功能等可以根据自己的需求进行修改。

注意

选择加载未打包的扩展程序加载插件，修改项目代码后，刷新插件后，代码生效，同时注意，本地插件项目代码文件夹不要移动位置或修改文件夹名称。

插件打包

打包即可，打包后的插件可以加载到任意一台电脑的Chrome浏览器，不再依赖本地项目文件夹。

高版本的浏览器已经无法加载自行打包的插件，只能通过开发者模式加载未打包的文件夹来使用。