Integrating Plivo SMS with RedwoodJS - code-examples -

Frequently Asked Questions

Integrate Plivo's messaging API into your RedwoodJS application. This involves installing the Plivo Node.js SDK, setting up environment variables for your Plivo credentials, creating a GraphQL mutation, and building a frontend form to trigger the message sending process. The provided tutorial guides you through each step to create a fully functional SMS sending feature within your RedwoodJS app.
Plivo is a cloud communications platform used to send SMS messages programmatically from your RedwoodJS application. It acts as the SMS gateway, removing the need for you to build that infrastructure yourself. The Plivo Node.js SDK facilitates the integration within your RedwoodJS service.
RedwoodJS provides a full-stack JavaScript/TypeScript framework with integrated frontend (React) and backend (GraphQL API, Prisma) capabilities, simplifying the development process. This integration allows you to build and deploy SMS campaigns easily by combining the Plivo API with a user-friendly interface.
Create a `.env` file in the root of your RedwoodJS project and add your `PLIVO_AUTH_ID`, `PLIVO_AUTH_TOKEN`, and `PLIVO_SOURCE_NUMBER`. RedwoodJS loads these into `process.env`. Never hardcode these credentials directly in your code. Be sure to add `.env` to your `.gitignore` file to prevent exposing secrets.
Log in to your Plivo console at https://console.plivo.com/. Your Auth ID and Auth Token are displayed on the main dashboard overview page. Your Plivo source number can be found under 'Messaging -> Phone Numbers'.
The `plivoCampaign` service is responsible for interacting with the Plivo SDK. It handles authentication, message sending, and logging. This service isolates the Plivo-specific logic from the rest of your RedwoodJS application, promoting code organization and maintainability.
Use `try...catch` blocks around Plivo API calls to handle potential errors such as invalid credentials or network issues. Log error details using Redwood's logger and return user-friendly error messages in the GraphQL response. The example code also shows how to implement retries using the `async-retry` library for transient errors.
Prisma, the ORM used by RedwoodJS, allows you to log sent messages and their statuses (sent, failed, pending) in a database. This provides a record of all SMS activity, enabling tracking and analysis of your campaign's performance.
You can test using the GraphQL Playground at `http://localhost:8910/graphql` during development or through the form on the `/send-campaign` page. Test with valid and invalid phone numbers and messages to verify success and error handling. For more in-depth testing, mock the Plivo client in unit tests.
Use the E.164 format for phone numbers, such as +14155552671. This international standard ensures compatibility and successful message delivery. Client-side and server-side validation should be in place to enforce this format in your application.
Never commit `.env` to version control. When deploying, use your hosting provider's secure environment variable mechanisms (e.g., Netlify, Vercel, or Fly.io secrets) to store your Plivo API keys. This keeps sensitive information out of your codebase and protects your credentials.
Use a library like `async-retry`. Wrap the `client.messages.create` call within the retry function, configuring the number of attempts and the backoff strategy. This ensures that temporary network or server errors don't permanently prevent your messages from being sent. Examine Plivo's error responses for more specific retry criteria.
The request takes a JSON object with an `input` field containing the recipient's phone number (`to` in E.164 format) and the message text (`text`). For example: `{"input": {"to": "+14155552671", "text": "Hello from Redwood!"}}`
The response will be a JSON object indicating success or failure. A successful response includes a `messageId` (Plivo's UUID for the message). A failed response includes an `error` message. Example success: `{"data": {"sendPlivoMessage": {"success": true, "messageId": "UUID", "error": null}}}`. Example failure: `{"data": {"sendPlivoMessage": {"success": false, "messageId": null, "error": "Error message"}}}`