About the Web Methods API

The Web Methods API allows you to define functions in your backend code that you can call from your app's frontend code. You can also define the permissions required to call the function. You can define these functions in web method extensions.

Web methods provide several advantages over using http functions to call your app's backend.

Additionally, you can cache the return values of these functions. Caching enables you to temporarily store the return values of your web methods on Wix's infrastructure for a specified period of time. By implementing caching, you can reduce response times, decrease server load, and enhance the overall user experience by providing faster access to your site's data. Learn more about web method caching.

Setup

To use the Web Methods API, install the @wix/web-methods package:

npm install @wix/web-methods

or

yarn add @wix/web-methods

Then import the webMethod utility and Permissions enum from @wix/web-methods:

import { webMethod, Permissions } from '@wix/web-methods`

The Permissions enum is used to define the permissions needed to call the function in frontend code. See the webMethod() documentation for more details.

Using web methods

Web methods are defined in your backend code using the webMethod() wrapper function, then imported into and called from your frontend code.

Web methods must be defined in a file with a .web.ts extension.

Backend code example

import { webMethod, Permissions } from "@wix/web-methods";

export const multiply = webMethod(
  Permissions.Anyone,
  (a: number, b: number) => a * b,
);

Frontend code example

Import the web method, then call it. For example:

import { multiply } from "<relative-path>/my-web-method-file.web.ts";

const result = await multiply(3, 7);