Skip to content

Refactor parse-multipart #36

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
cameronhunter wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Refactor parse-multipart #36

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
39 changes: 2 additions & 37 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,37 +1,2 @@
# Logs
logs
*.log
npm-debug.log*

# Runtime data
pids
*.pid
*.seed

# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov

# Coverage directory used by tools like istanbul
coverage

# nyc test coverage
.nyc_output

# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
.grunt

# node-waf configuration
.lock-wscript

# Compiled binary addons (http://nodejs.org/api/addons.html)
build/Release

# Dependency directories
node_modules
jspm_packages

# Optional npm cache directory
.npm

# Optional REPL history
.node_repl_history
/build
/node_modules
1 change: 1 addition & 0 deletions .prettierignore
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
/tsconfig.*
11 changes: 11 additions & 0 deletions .prettierrc
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
{
"printWidth": 120,
"singleQuote": true,
"tabWidth": 4,
"overrides": [
{
"files": "*.json",
"options": { "tabWidth": 2 }
}
]
}
88 changes: 41 additions & 47 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,48 +1,44 @@
# parse-multipart
# `parse-multipart`

A javascript/nodejs multipart/form-data parser which operates on raw data.
A JavaScript/node multipart/form-data parser that operates on raw data.

# note
## Author

this code is not abandoned. i just keep it as its minimum as possible.
My name is Cristian Salazar (christiansalazarh@gmail.com) from Santiago Chile (South America).

# author
I'm an Amazon AWS developer focused on Serverless software development, I call it: the new age of software development.

My name is Cristian Salazar (christiansalazarh@gmail.com) from Santiago Chile (South America).
_I'm open to remote jobs:_

I'm an Amazon AWS developper focused in Serverless software development, i call it: the new age of software development.
please visit my profile at: [https://www.linkedin.com/in/cristian-salazar-h](https://www.linkedin.com/in/cristian-salazar-h)

*im open to remote job:*
## Video/Tutorial

please visit my profile on: [https://www.linkedin.com/in/cristian-salazar-h](https://www.linkedin.com/in/cristian-salazar-h)
You can Watch my video where I expose the necessary steps to [implement a Multiform/form-data parser inside a Amazon Aws ApiGateway](https://www.youtube.com/watch?v=BrYJlR0yRnw).

# Video/Tutorial
## Background

You can Watch my video on which i expose the necesary steps to [implement a Multiform/form-data parser inside a Amazon Aws ApiGateway](https://www.youtube.com/watch?v=BrYJlR0yRnw).
Sometimes you have a server listening for data arriving at it (e.g., the Amazon API Gateway in AWS), this is called an "endpoint". Some website or script may send data to this endpoint. It may contain files or text, an encoded video and so on. The data is packaged in a well-known format called "multipart/form-data". This data must be parsed, you must know where the data is, how much data comes to you and other aspects. This component will help you with this.

# Background
As an example, The Amazon AWS ApiGateway. It operates as a facade between the http/s client (as an example, the browser) and your component (your lambda function, an action script etc). The "component" is the one written by you designed to extract the uploaded files or the data contained on it and then perform operations with it (storage etc).

Sometimes you have a server listeing for data arriving to it (example: the Amazon API Gateway in AWS), this is called a "endpoint". Some website or script may send data to this endpoint. It may contain files or text, a encoded video and so on. The data is packaged in a well know format called "multipart/form-data". This data must be parsed, you must know where the data is, how many data comes to you and other aspects. This component will help you on this.
## What is "Multipart/form-data"?

As an example, The Amazon AWS ApiGateway. It operates as a facade between the http/s client (as an exampe, the browser) and your component (your lambda function, an action script etc). The "component" is the one written by you designed to extract the uploaded files or the data contained on it and then perform operations with it (storage etc).
`mutipart/form-data` is the raw data attached to a POST coming with an HTTP request, it has a format and marks to let you know when it starts and when it ends, these marks are also used to separate each "part of the data" that means: the same POST may have different parts: text and/or files or video, sound etc.

# What means "Multipart/form-data".
First, I need to clarify this point: some people think that "multipart" means: "a POST coming several times to an endpoint" each part having a "new or the next part" of the whole data", this is the wrong approach and may confuse you when trying to understand this work. Please have it in mind. The data arrives as a whole package in the same POST, that is: if you send a file, the entire file is contained in the POST, it will have an initial mark and a finalization mark, the mark is also sent to you in the same post. In other words, The "multipart" means: in the same post you will find many parts of different data separated by a mark. It may be different files, text, etc.

The 'mutipart/form-data' is the raw data attached to a POST coming inside a Http request, it has a format and marks to let you now when it starts and when it ends, this marks are also used to separate each "part of the data" that means: the same POST may have different parts: text and/or files or video,sound etc.
The header in the multipart/form-data has fields, that lets you know about what is coming to you, the next paragraph will explain this:

First, i need to clarify this point: some people think that "multipart" means: "a POST comming several times to an endpoint" each part having a "new or the next part" of the whole data", this is wrong approach and may confuse you when trying to undestand this work. Please have it in mind. The data arrives as a whole package in the same POST, that is: if you send a file, the entire file is contained in the POST, it will have a initial mark and a finalization mark, the mark is also sent to you in the same post. In other words, The "multipart" means: in the same post you will find many parts of different data separated by a mark. It may be different files, or text, etc.
## Data Fields

The header in the multipart/form-data has fields, this let you know about what is coming to you, the next paragraph will explain this:
It is important to mention that sometimes the raw data contains some fields (look at the example below these lines, "filename=.." etc). So you must deal with it and parse the "field=value;" token. Some person wrote a very nice modification to my code to handle these fields in a better approach than mine, you may find the solution here: https://github.com/freesoftwarefactory/parse-multipart/pull/7.

# Data Fields

It is important to mention that sometimes the raw data contains some fields (look at the example below this lines, "filename=.." etc). So you must deal with it and parse the "field=value;" token. Some persons wrote a very nice modifications to my code in order to handle this fields in a better approach than mine, you may find the solution here: https://github.com/freesoftwarefactory/parse-multipart/pull/7.

# Raw data example received in an endpoint:
## Raw data example received in an endpoint

The raw payload is formatted as a "multipart/form-data" will look like this one:

```
```text
------WebKitFormBoundaryDtbT5UpPj83kllfw
Content-Disposition: form-data; name="uploads[]"; filename="somebinary.dat"
Content-Type: application/octet-stream
Expand All @@ -56,16 +52,16 @@ hello how are you
------WebKitFormBoundaryDtbT5UpPj83kllfw--
```

The lines above represents a raw multipart/form-data payload sent by some HTTP client via form submission containing two files. We need to extract the all files contained inside it. The multipart format allows you to send more than one file in the same payload, that's why it is called: multipart.
The lines above represent a raw multipart/form-data payload sent by some HTTP client via form submission containing two files. We need to extract the all files contained inside it. The multipart format allows you to send more than one file in the same payload, that's why it is called: multipart.

# Usage
## Usage

In the next lines you can see a implementation. In this case two key values
needs to be present:
In the next lines, you can see an implementation. In this case, two key values
need to be present:

* body, which can be:
- body, which can be:

```
```text
------WebKitFormBoundaryDtbT5UpPj83kllfw
Content-Disposition: form-data; name="uploads[]"; filename="sometext.txt"
Content-Type: application/octet-stream
Expand All @@ -74,27 +70,25 @@ hello how are you
------WebKitFormBoundaryDtbT5UpPj83kllfw--
```

* boundary, the string which serve as a 'separator' between parts, it normally
comes to you via headers. In this case, the boundary is:
- boundary, the string which serves as a 'separator' between parts, it normally
comes to you via headers. In this case, the boundary is:

```
----WebKitFormBoundaryDtbT5UpPj83kllfw
```text
----WebKitFormBoundaryDtbT5UpPj83kllfw
```

Now, having this two key values then you can implement it:
Now, having these two key values then you can implement it:

```
var multipart = require('parse-multipart');
var body = "..the multipart raw body..";
var boundary = "----WebKitFormBoundaryDtbT5UpPj83kllfw";
var parts = multipart.Parse(body,boundary);

for(var i=0;i<parts.length;i++){
var part = parts[i];
// will be:
// { filename: 'A.txt', type: 'text/plain',
// data: <Buffer 41 41 41 41 42 42 42 42> }
}
```js
import { parse } from 'parse-multipart';

const body = '..the multipart raw body..';
const boundary = '----WebKitFormBoundaryDtbT5UpPj83kllfw';
const parts = parse(body, boundary);

for (const { data, filename, name, type } of parts) {
// Handle part
}
```

The returned data is an array of parts, each one described by a filename, a type and a data, this last one is a Buffer (see also Node Buffer).
138 changes: 0 additions & 138 deletions multipart.js
View file
Open in desktop

This file was deleted.

Loading