Skip to content

Commit

Permalink
Start project
Browse files Browse the repository at this point in the history
  • Loading branch information
barbhackk committed Dec 8, 2023
1 parent 03cc802 commit 18a56eb
Show file tree
Hide file tree
Showing 5 changed files with 529 additions and 1 deletion.
82 changes: 81 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
@@ -1,2 +1,82 @@
# preflight-request-proxy
# 🚀 preflight-request-proxy

[![barbhackk - preflight-request-proxy](https://img.shields.io/static/v1?label=barbhackk&message=preflight-request-proxy&color=blue&logo=github)](https://github.com/barbhackk/preflight-request-proxy "Go to GitHub repo")
[![Pure JS](https://img.shields.io/badge/langage-javascript-blue?logo=javascript)](https://img.shields.io/badge/langage-javascript-blue?logo=javascript)
[![License](https://img.shields.io/badge/License-MIT-blue)](#license)
[![issues - preflight-request-proxy](https://img.shields.io/github/issues/barbhackk/preflight-request-proxy)](https://github.com/barbhackk/preflight-request-proxy/issues)
[![stars - preflight-request-proxy](https://img.shields.io/github/stars/barbhackk/preflight-request-proxy?style=social)](https://github.com/barbhackk/preflight-request-proxy)
[![forks - preflight-request-proxy](https://img.shields.io/github/forks/barbhackk/preflight-request-proxy?style=social)](https://github.com/barbhackk/preflight-request-proxy)

Proxy a CORS preflight request

> [!IMPORTANT]
> Use this tool only for your development.
# 🔨 Description

Browsers implementing a same-origin policy prevent website scripts served on one origin from making requests to another origin using methods such as XMLHttpRequest or the Fetch API.
There are cases of exceptions but from the moment we touch the header of a request: “Accept”, “Content-Type”, “Authorization”… the policy is applied.

> Cross-Origin Resource Sharing (CORS) is an HTTP-header based mechanism that allows a server to indicate any origins (domain, scheme, or port) other than its own from which a browser should permit loading resources. CORS also relies on a mechanism by which browsers make a "preflight" request to the server hosting the cross-origin resource, in order to check that the server will permit the actual request. In that preflight, the browser sends headers that indicate the HTTP method and headers that will be used in the actual request.
>
> https://developer.mozilla.org/fr/docs/Web/HTTP/CORS
For security reasons, multi-origin HTTP requests issued from scripts are restricted by the browser.
The browser considers two URLs to be of the same origin if they have the same scheme, domain and port number (if the URL includes a port).

<p align="center">
<img src="./cross-origin.png">
</p>

A pre-check request is automatically sent by the browser when necessary.

A CORS cross-origin pre-check request is a verification request made to check whether the CORS protocol is authorized.
It is a request using the OPTIONS method that uses three HTTP headers: The Access-Control-Request-Method, the Access-Control-Request-Headers and Origin headers.

# 🔥 Usage

npm run start -- --help

```
Preflight request proxy
If you want to use the local development environment with the dev
backend,this will create a proxy so you won't run into CORS issues.It accepts
the following command line parameters:
- Port : the port where the proxy will listen
- Target : the DEV backend target to contact.
Example: If you set the port to 3000 and target to http://localhost:45680
thenyour actual "resourceBaseUrl" in setting should be
http://localhost:3000/api/v1
Options
-p, --port number The listened port au reverse proxy. By default port
3000 is used.
-t, --target string The targeted URL (for exemple your local API,
http://127.0.0.1:8001). By default
http://127.0.0.1:8000 is used.
--help string Print this usage guide.
Project write by Sébastien DOUTRE: https://github.com/barbhackk
```

## 💪 Basic usage

For use http://localhost:45469 TO http://localhost:99898

`npm run start -- -p 45469 -t http://localhost:99898`

The reverse proxy will now respond to preliminary requests that say the API can communicate with localhost:99898.

# ❤️ Contributing

1. Fork it (https://github.com/sr6033/lterm/fork)
2. Create your feature branch (git checkout -b feature/fooBar)
3. Commit your changes (git commit -am 'Add some fooBar')
4. Push to the branch (git push origin feature/fooBar)
5. Create a new Pull Request

### 🐛 Bug Reports & Feature Requests
Please use the [issue](https://github.com/barbhackk/preflight-request-proxy/issues) tracker to report any bugs or file feature requests.
Binary file added cross-origin.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
112 changes: 112 additions & 0 deletions index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,112 @@
import chalk from 'chalk';
import commandLineArgs from 'command-line-args';
import commandLineUsage from 'command-line-usage';
import http from 'http';
import httpProxy from 'http-proxy';

const description = 'If you want to use the local development environment with the dev backend,\
this will create a proxy so you won\'t run into CORS issues.\
It accepts the following command line parameters: \r\n\
- Port : the port where the proxy will listen \r\n\
- Target : the DEV backend target to contact. \r\n\r\n\
Example: If you set the port to 3000 and target to http://localhost:45680 then\
your actual "resourceBaseUrl" in setting should be http://localhost:3000/api/v1';

const sections = [
{
header: chalk.bold.green("Preflight request proxy"),
content: chalk.white(description),
},
{
header: 'Options',
optionList: [
{
name: 'port',
alias: 'p',
typeLabel: '{underline number}',
description: 'The listened port au reverse proxy. By default port 3000 is used.'
},
{
name: 'target',
alias: 't',
typeLabel: '{underline string}',
description: 'The targeted URL (for exemple your local API, http://127.0.0.1:8001). By default http://127.0.0.1:8000 is used.'
},
{
name: 'help',
description: 'Print this usage guide.'
}
]
},
{
content: 'Project write by Sébastien DOUTRE: {underline https://github.com/barbhackk}'
}
]
const usage = commandLineUsage(sections)

// Define the command line options
const optionDefinitions = [
{ name: "help", alias: "h", type: Boolean, defaultValue: false },
{ name: "port", alias: "p", type: Number, defaultValue: 3000 },
{ name: "target", alias: "t", type: String, defaultValue: "http://127.0.0.1:8000" }
];

// parse command line options
const options = commandLineArgs(optionDefinitions);

if (options.help) {
console.log(usage);
} else {
// Start the proxy
console.log("Start proxy on port", options.port, "for", options.target);

// Create a proxy server with custom application logic
var proxy = httpProxy.createProxyServer({});
var sendError = function (res, err) {
return res.status(500).send({
error: err,
message: "An error occured in the proxy"
});
};

// error handling
proxy.on("error", function (err, req, res) {
sendError(res, err);
});

var enableCors = function (req, res) {
res.setHeader('access-control-allow-origin', '*');
res.setHeader('access-control-allow-methods', 'GET, PUT, PATCH, POST, DELETE');
res.setHeader('access-control-allow-credentials', 'true');

if (req.headers['access-control-request-headers']) {
res.setHeader('access-control-allow-headers', req.headers['access-control-request-headers']);
}
};

// set header for CORS
proxy.on("proxyRes", function (proxyRes, req, res) {
enableCors(req, res);
});

var server = http.createServer(function (req, res) {
// You can define here your custom logic to handle the request
// and then proxy the request.
if (req.method === 'OPTIONS') {
console.log(chalk.magenta(req.method + " | ") + chalk.bgCyan.white("Pre-flight request interception : ") + chalk.bold(req.url));
enableCors(req, res);
res.writeHead(204);
res.end();
return;
}

console.log(chalk.magenta(req.method + " | ") + chalk.gray("Redirect to --> ") + chalk.bold(options.target + req.url));
proxy.web(req, res, {
target: options.target
}, function (err) {
sendError(res, err);
});
});

server.listen(options.port);
}
Loading

0 comments on commit 18a56eb

Please sign in to comment.