Creating a Webhook for API Testing

I'll create a webhook that can test the HTTP API request shown in your screenshot. This will be a Next.js application with an API route that can receive webhook events and forward them to your target API.

How This Webhook Works

I've created a Next.js application that provides a webhook endpoint for testing the API request shown in your screenshot. Here's what it does:

1. Webhook Endpoint: The application exposes an API route at /api/webhook that accepts POST requests 1.
2. Form Data Handling: The webhook takes the incoming JSON payload and converts it to the x-www-form-urlencoded format required by your target API.
3. API Request: It forwards the request to https://customer-beta.mlc.sa/api/store-truck-notification with the parameters tag and tag2 as shown in your screenshot.
4. Response Handling: The webhook returns the API response directly to the caller.
5. Testing Interface: I've included a user-friendly interface at /test where you can manually test the API with different parameters.

How to Deploy

To deploy this webhook:

1. Click the "Deploy" button in the top right corner of the code preview.
2. Follow the prompts to deploy to Vercel.
3. Once deployed, your webhook will be available at https://your-project-name.vercel.app/api/webhook.

4. You can test it by sending a POST request with JSON body:

   { "tag": "test tag", "tag2": "test b" }
5. Or use the built-in test interface at https://your-project-name.vercel.app/test.

Security Considerations

For a production webhook, you might want to consider:

1. Adding authentication to your webhook endpoint
2. Setting up webhook secrets for verification 2
3. Implementing rate limiting to prevent abuse

Please make sure to add the following environment variable to your project: