Boost Frontend‑Backend Integration in 5 Minutes with Alibaba Cloud Toolkit

Problem Background

I am a front‑end developer working remotely for 78 days due to the pandemic. After two weeks of development, I need to start front‑end/back‑end integration, but the remote setup makes switching proxies between multiple back‑end services cumbersome.

Unsatisfactory Solutions

Use existing proxy tools such as Charles, Postman, or the Chrome extension SwitchyOmega. These tools are powerful but complex to configure, especially for newcomers.

Maintain multiple proxy configurations and restart the project each time, which requires custom logic to detect environments.

Both approaches are time‑consuming and frustrating.

5‑Minute Solution: Alibaba Cloud Toolkit HTTP Proxy

Consulting a senior front‑end engineer from Alibaba, I learned about the Cloud Toolkit plugin for VS Code, which provides an HTTP Proxy feature that runs a local forward proxy without code changes.

Isolates code from environments and simplifies request debugging.

One‑click switching between saved proxy configurations, improving test environment reuse.

Easy integration—no need to install Nginx or Charles; just install the plugin in VS Code.

Official site: https://cn.aliyun.com/product/cloudtoolkit

Configuration Steps

Open the Alibaba Cloud Toolkit icon in VS Code and expand TOOLKIT > HTTP Proxy.

In the HTTP Proxy View tab, click Add Proxy and fill in the configuration:

Name : e.g., ACT System Test.

Target Server : the target URL (supports HTTP/HTTPS).

Header , Parameter , Cookie : optional fields.

In Advanced, set the listening port (default 18002) and optional Agent Server IP or CORS switch.

Click OK to save.

In the proxy list, toggle the Actions switch to enable the proxy.

After activation, click Copy to obtain the proxy address for use.

One‑Click Deployment with Cloud Toolkit

The plugin also supports one‑click deployment from various IDEs (IntelliJ, GoLand, PyCharm, Eclipse, VS Code) to remote servers, Kubernetes, Docker registries, and Alibaba Cloud services, reducing typical 7‑8 minute tasks to under 20 seconds.

Deploy projects to any remote server or Kubernetes cluster.

Package and push Docker images to Alibaba Cloud Registry.

Deploy to ECS, EDAS, SAE, Web+, Mini‑Program Cloud, ACK.

Built‑in terminal, file uploader, remote log viewer, SQL executor, Dubbo/Spring Cloud templates, remote Java diagnostics, micro‑service debugging, etc.

Example: Deploy to a Remote Server

Open Tools → Alibaba Cloud → Alibaba Cloud View → Host and click Add Host to add a server.

In the deployment dialog (e.g., in IntelliJ IDEA), set parameters such as build method (Maven, Gradle, or upload file), target host, target directory, and post‑deployment commands, then click Deploy.

Note: Deployment parameters include file build method, target host, target directory, and after‑deploy commands (e.g., sh /root/restart.sh for Java applications).

Additional Information

To edit a proxy, click Properties in the proxy list.

To delete a proxy, click Remove in the same list.

For more details, refer to the official Cloud Toolkit documentation.