Skip to content

Docs v4 #359

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.

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

Merged
merged 5 commits into from
Aug 4, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
103 changes: 51 additions & 52 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -21,33 +21,39 @@ A TypeScript server agnostic Whatsapp's Official API framework.

## Set up

First, you need a Facebook app with the Whatsapp API activated.
You can create your first app following [this steps](https://developers.facebook.com/docs/whatsapp/getting-started/signing-up).
Get the API token, either a temporal or a permanent one.
Before all, you will need a Meta Bussiness App with WhatsApp API activated. You
can create your first app following
[this steps](https://developers.facebook.com/docs/whatsapp/cloud-api/get-started).

In your server you can install the module using npm:
- Get the API token, either a temporal or a
[permanent one](https://developers.facebook.com/docs/whatsapp/business-management-api/get-started).
- Get your App secret from App Settings > Basic > App Secret.
- More in-depth information on how to set and retrieve this values is available
at
[the module documentation](https://whatsappapijs.web.app/types/types.TheBasicConstructorArguments.html)

You can now install the module using npm:

```sh
npm install whatsapp-api-js
```

Now you can write code like this:
Which will let you write code like this:

```js
import { WhatsAppAPI } from "whatsapp-api-js";
import { Text, Image, Document } from "whatsapp-api-js/messages";
import * as Contacts from "whatsapp-api-js/messages/contacts";
import { Document, Image, Text } from "whatsapp-api-js/messages";

// Kind reminder to not hardcode your token and secret
const TOKEN = "YOUR_TOKEN";
const APP_SECRET = "YOUR_SECRET";

/** @type WhatsAppAPI<number> */
const Whatsapp = new WhatsAppAPI({ token: TOKEN, appSecret: APP_SECRET });

// Assuming post is called on a POST request to your server
async function post(e) {
// The handlers work with any framework, as long as you pass the correct data
// You can also use one of the middlewares provided in the package, keep reading
// Too long? Read https://whatsappapijs.web.app/modules/middleware.html
return await Whatsapp.post(
JSON.parse(e.data),
e.data,
Expand All @@ -62,47 +68,32 @@ Whatsapp.on.message = async ({ phoneID, from, message, name, reply }) => {
)}`
);

let promise;
let response;

if (message.type === "text") {
promise = reply(
response = await reply(
new Text(`*${name}* said:\n\n${message.text.body}`),
true
);
}

if (message.type === "image") {
promise = reply(
response = await reply(
new Image(message.image.id, true, `Nice photo, ${name}`)
);
}

if (message.type === "document") {
promise = reply(
response = await reply(
new Document(message.document.id, true, undefined, "Our document")
);
}

if (message.type === "contacts") {
promise = reply(
new Contacts.Contacts(
[
new Contacts.Name(name, "First name", "Last name"),
new Contacts.Phone(phone),
new Contacts.Birthday("2022", "04", "25")
],
[
new Contacts.Name("John", "First name", "Last name"),
new Contacts.Organization("Company", "Department", "Title"),
new Contacts.Url("https://www.google.com", "WORK")
]
)
);
}

console.log(
(await promise) ??
"There are more types of messages, such as locations, templates, interactive, reactions and all the other media types."
response ??
"There are more types of messages, such as contacts, " +
"locations, templates, interactive, reactions and " +
"all the other media types."
);

Whatsapp.markAsRead(phoneID, message.id);
Expand All @@ -115,12 +106,14 @@ Whatsapp.on.sent = ({ phoneID, to, message }) => {
};
```

To receive the post requests on message, you must setup the webhook at your Facebook app.
To receive the messages updates, you must set-up the webhook at your Meta app.

Back in the dashboard, click on WhatsApp > Settings, and write down your webhook
URL. Make sure to subscribe to the messages event.

Back in the dashboard, click on WhatsApp > Settings, and setup the webhook URL.
While setting it up, you will be asked for a Verify Token. This can be any string you want.
You will also be asked for a Verify Token. This can be any string you want.

The package also has a GET wizard for the webhook authentication:
The package also includes a GET handler for the webhook authentication:

```js
import { WhatsAppAPI } from "whatsapp-api-js";
Expand All @@ -136,28 +129,29 @@ const Whatsapp = new WhatsAppAPI({
});

// Assuming get is called on a GET request to your server
// You can also use one of the middlewares provided in the package, keep reading
function get(e) {
// Too long!? Read https://whatsappapijs.web.app/modules/middleware.html
return Whatsapp.get(e.query);
}
```

Once you are done, click the administrate button, and subscribe to the messages event.

And that's it! Now you have a functioning Whatsapp Bot connected to your server.
For more information on the setup process for specific runtimes and frameworks, check out the
For more information on the setup process for specific runtimes and frameworks,
check out the
[Environments.md file](https://github.com/Secreto31126/whatsapp-api-js/blob/main/ENVIRONMENTS.md).

## Examples and Tutorials

There are a few examples that cover how to create each type of message,
and how to use the basic methods of the library.
There are a few examples that cover how to create each type of message, and how
to use the basic methods of the library.

Check them out in the [examples folder](https://github.com/Secreto31126/whatsapp-api-js/blob/main/EXAMPLES/).
Check them out in the
[examples folder](https://github.com/Secreto31126/whatsapp-api-js/blob/main/EXAMPLES/).

## Types

The library is fully typed. Most types are available by importing `/types` or `/emitters` :
The library is fully typed. Most types are available by importing `/types` or
`/emitters` files:

```ts
import { GetParams, PostData } from "whatsapp-api-js/types";
Expand All @@ -166,12 +160,15 @@ import { OnMessage, OnSent, OnStatus } from "whatsapp-api-js/emitters";

## Changelog

To know what changed between updates, check out the [releases on Github](https://github.com/Secreto31126/whatsapp-api-js/releases).
To know what changed between updates, check out the
[releases on Github](https://github.com/Secreto31126/whatsapp-api-js/releases).

## Documentation

The latest release documentation is available in [whatsappapijs.web.app](https://whatsappapijs.web.app/),
and previous versions are available in [secreto31126.github.io/whatsapp-api-js](https://secreto31126.github.io/whatsapp-api-js/).
The latest release documentation is available at
[whatsappapijs.web.app](https://whatsappapijs.web.app/), and previous versions
are archived at
[secreto31126.github.io/whatsapp-api-js](https://secreto31126.github.io/whatsapp-api-js/).

## Contributors

Expand All @@ -197,15 +194,17 @@ and previous versions are available in [secreto31126.github.io/whatsapp-api-js](

## Contributions

If you have some free time and really want to improve the library or fix dumb bugs, feel free to read
If you have some free time and really want to improve the library or fix dumb
bugs, feel free to read
[CONTRIBUTING.md file](https://github.com/Secreto31126/whatsapp-api-js/blob/main/CONTRIBUTING.md).

## Breaking changes

You can get a full list of breaking changes in the [BREAKING.md file](https://github.com/Secreto31126/whatsapp-api-js/blob/main/BREAKING.md).
You can get a full list of breaking changes in the
[BREAKING.md file](https://github.com/Secreto31126/whatsapp-api-js/blob/main/BREAKING.md).

## Beta releases

Install the latest beta release with `npm install whatsapp-api-js@beta`.
As any beta, it is 110% likely to break. I also use this tag to test npm releases.
Use it at your own risk.
Install the latest beta release with `npm install whatsapp-api-js@beta`. As any
beta, it is 110% likely to break. I also use this tag to test npm releases. Use
it at your own risk.
4 changes: 2 additions & 2 deletions SECURITY.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,8 @@

| Version | Supported |
| ------- | ------------------ |
| 3 | :white_check_mark: |
| < 3 | :x: |
| 4 | :white_check_mark: |
| < 4 | :x: |

## Reporting a Vulnerability

Expand Down
2 changes: 1 addition & 1 deletion src/emitters.ts
Original file line number Diff line number Diff line change
Expand Up @@ -107,7 +107,7 @@ export type OnMessageArgs = {
* @param response - The message to send as a reply
* @param context - Wether to mention the current message, defaults to false
* @param biz_opaque_callback_data - An arbitrary 512B string, useful for tracking
* @returns WhatsAppAPI.sendMessage return value
* @returns The {@link WhatsAppAPI.sendMessage} return value
*/
reply: (
response: ClientMessage,
Expand Down