Overview
The @nuxtjs/proxy is a npm package that provides proxy support for Nuxt 2 server. It allows users to configure proxies in their Nuxt applications and provides features such as path rewrites, host-based routing, proxy event logging, WebSockets support, and cookie authentication.
Features
- Path rewrites: Allows users to rewrite paths in the proxy configuration.
- Host-based router: Useful for staging and testing purposes, allows users to route requests based on the host.
- Logs / Proxy Events: Logs and provides events related to proxy requests.
- WebSockets: Proxy supports WebSockets, allowing users to proxy WebSocket connections.
- Auth / Cookie: Supports authentication and cookie handling for proxy requests.
- … (additional features mentioned in the documentation)
Installation
To install the @nuxtjs/proxy package, follow these steps:
- Add the @nuxtjs/proxy dependency to your project using the package manager (e.g., npm or yarn).
- Add “@nuxtjs/proxy” to the modules section of the nuxt.config.js file.
- Define your desired proxy middleware in the proxy section of the nuxt.config.js file.
Here is an example of how to configure the proxy using an array configuration:
// nuxt.config.js
export default {
modules: [
'@nuxtjs/proxy',
],
proxy: [
'http://example.com/api',
{
context: '/foo',
target: 'http://example.net',
pathRewrite: { '^/foo': '' }
}
],
}
Alternatively, you can use an object configuration by providing proxy configuration options:
// nuxt.config.js
export default {
modules: [
'@nuxtjs/proxy',
],
proxy: {
'/api/': { target: 'http://example.net', pathRewrite: { '^/api/': '' } },
'/foo/': { target: 'http://example.org', pathRewrite: { '^/foo/': '' } }
},
}
You can also provide default options to all proxy targets by passing options to the module options in the nuxt.config.js file.
Summary
The @nuxtjs/proxy package is a useful tool for configuring proxies in Nuxt applications. It provides various features such as path rewrites, host-based routing, WebSocket support, and authentication handling for proxy requests. By following the installation guide, users can easily set up and configure proxies in their Nuxt projects.