Serverless Functions in ZEIT Now - Customizing Routes with Parameters

I successfully implemented 4 serverless routes

  • /api/list (GET)
  • /api/add (POST)
  • /api/update/:id (PUT)
  • /api/remove/:id (DELETE)

These routes were added to the api/now.json file in the following format:

{"src": "/api/list", "dest": "./list.js", "methods": ["GET"]},
{"src": "/api/add", "dest": "./add.js", "methods": ["POST"]},
{"src": "/api/update/*", "dest": "./update.js", "methods": ["PUT"]},
{"src": "/api/remove/*", "dest": "./remove.js", "methods": ["DELETE"]}

Currently, the /api/list and /api/add routes that do not require parameters are functioning correctly. However, I am facing issues with the /api/update and /api/remove routes, likely due to incorrect usage of regex on the api path within the now.json file.

The snippet for handling the update route is as follows:

app.put('/api/update/:id', (req, res) => {
  ...
});
module.exports = app;

Answer №1

When it comes to routing in your application, the src represents the request path you're looking to match, while the dest specifies the file that should be executed.

This means that for paths like /api/list and /api/add, the corresponding JavaScript files like /api/list.js and /api/add.js will automatically be executed without the need for additional route configurations.

To define routes using express-like patterns, you can utilize rewrites within a now.json file:

{
  "rewrites": [
    { "source": "/update/:id", "destination": "/api/update" },
    { "source": "/remove/:id", "destination": "/api/remove" }
  ]
}

For example, a function inside /api/remove.js could look something like this:

module.exports = (req, res) => {
  const { id } = req.query;
  res.send('Removing ID ' + id);
});

Alternatively, if you name your file as /api/remove/[id].js, there's no need to configure any rewrites. This concept is known as Path Segments.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

The jQuery date picker refuses to function correctly when I attempt to initialize it after an AJAX call

I am facing an issue with my jquery-ui datepicker not working within the document.ready function after making an ajax call. However, it works fine when I add it inside the ajax complete function. Can someone please provide assistance on what could be cau ...

Inconsistency in @nuxtjs/i18n locales after refreshing the page

I am currently working on an application where I am implementing language management, but I have encountered a difficulty. I am using the latest version of @nuxtjs/i18n. Changing the language successfully updates the URL and labels, yet upon refreshing the ...

Tips for distinguishing the beginning and ending points of wrapped text in the Firefox browser

Within my work, I am utilizing a contentEditable span where I aim to position an element with position: absolute on the same line as the cursor. However, issues arise when text wrapping occurs - causing abnormal behavior at the start and end of wrapped lin ...

Is there a way to retrieve a singular value from various select options sharing the same name within a single form?

I am facing an issue with my code where only the value assigned to the last select option panel is being saved in the database table. I need assistance as it was working well initially but for some reason, it's not functioning correctly now. <?php ...

Is it possible to organize and filter a dropdown menu in JQuery based on a secondary value (new attribute)?

Can the drop-down list be sorted by value2? <select id="ddlList"> <option value="3" value2="3">Three</option> <option value="1" value2="1">One</option> <option value="Order_0" value2="0">Zero</option> </sele ...

Instead of using an ID in javaScript, opt for $(this) instead

Is there a way to utilize $(this) instead of an ID in the option select function in javaScript? var tot = 5 * ($( "#firstOne option:selected" ).text()); In the scenario mentioned above, I aim to substitute $(this) for #firstOne, allowing this functional ...

"Ensure div remains at the bottom of the page even while

In order to implement a feature where the menu sticks to the top when scrolling down, you can use the following JS code. You can view a live example of this functionality on this Plunker by widening the preview window to see the columns side by side. wi ...

Encountering an error with the node module timestampnotes: 'command not recognized'

I am encountering an issue while trying to utilize a npm package called timestamp notes. After executing the following commands: $npm install timestampnotes $timestamp I receive the error message: timestamp:126: command not found: slk Subsequently, I ...

Strategies for avoiding unused style tags in React components

Expanding beyond React, I'm unsure if React itself is the culprit of this issue. In a React environment with TypeScript, I utilize CSS imports in component files to have specific stylesheets for each component. I assumed these styles would only be ad ...

Issue with Masonry layout not adjusting to change in window size

Something seems to be fixed on displaying four rows, no matter the size of the window. Previously, it would adjust to three rows or fewer as the browser was resized. I recently played around with columnWidth, but reverting it back to 250 doesn't seem ...

Storing data in a JSON format

Our team requires a service that can periodically generate up-to-date JSON data every 15 minutes for our AJAX services to consume. This JSON will be used for metric analysis and charts among other things. The reason behind the 15-minute interval is due to ...

Concealing object identifiers in Node.js when working with MongoDB

Here is the response from a GET request: { "parkingList": [ { "_id": "62e11ab3079daa939290fa07", "parkingInfo": [ { "parkingName": &qu ...

Issues with Kendo Grid showing incomplete data and columns

Having trouble populating a kendo grid with column titles, as some columns appear empty despite having data when checked in the console log. $(function () { $("#uploadBtn").click(function () { var url = window.rootUrl + 'Upload/UploadM ...

Using regular expressions to identify the presence of "&", parentheses, and consecutive letters in a string

I specialize in working with JavaScript and I have a need to verify if my text contains certain characters. Specifically, I want to check for the presence of parentheses (), ampersands (&), and repeating letters within the text. Here are some examples: te ...

Internet Explorer: JQuery deselects radio button upon its selection

One issue I have encountered is with a listener for a group of radio buttons in IE. When a radio button is selected, it triggers a database call to populate a select element. However, in IE, after the code runs successfully, the selected radio button becom ...

Unexpected behavior encountered when using TypeScript type declarations

I am currently working on a Gatsby side project incorporating Typescript for the first time. I initially expected Typescript to behave similarly to PHP type declarations, but I have encountered some unforeseen issues. Despite feeling confident in my Typesc ...

Creating an automated sequence of $http requests to sequentially retrieve JSON files with numbered filenames in Angular 1.2

I have a series of JSON files (page1.json, page2.json, etc.) that store the layout details for our website pages. Initially, I would load each page's data as needed and everything was functioning smoothly. However, it is now necessary for all page da ...

Reliable Dropdown Navigation Bars

Once I have successfully implemented three dynamic drop down menus using the combination of jQuery, AJAX, and PHP, the next challenge arises. After populating the dropdown menus based on user selections (e.g., selecting a value in the first dropdown menu ...

How to show multiline error messages in Materials-UI TextField

Currently, I am attempting to insert an error message into a textfield (utilizing materials UI) and I would like the error text to appear on multiple lines. Within my render method, I have the following: <TextField floatingLabelText={'Input Fi ...

show a fresh new page using react router

I have recently developed a mobile app that showcases a collection of movies. Currently, it is static and I am looking to implement a react router for navigation. Specifically, I want the user to be directed to a detail page for a TV Show when they click o ...