Minimal SharePoint Framework web part using Dev Proxy

Summary

This sample demonstrates the minimal setup to use Dev Proxy with a SharePoint Framework (SPFx) web part. It shows how to configure Dev Proxy to intercept API requests from an SPFx web part and mock responses using the MockResponsePlugin.

Compatibility

Contributors

• Waldek Mastykarz

Version history

Prerequisites

• Dev Proxy
• Node.js v22

Minimal path to awesome

• Get the sample:

  • Download just this sample:

    npx gitload-cli https://github.com/pnp/proxy-samples/tree/main/samples/minimal-spfx

    or

  • Download as a .ZIP file and unzip it, or

  • Clone this repository

• Navigate to the sample folder: cd samples/minimal-spfx
• Install dependencies: npm install
• In one terminal, start Dev Proxy: devproxy
• In another terminal, serve the web part: npm start
• In the SharePoint workbench, add the DevProxyDemo web part
• Click the “Fetch Post” button
• Observe the mocked API response with headers x-powered-by: Dev Proxy and x-mocked-by: Dev Proxy MockResponsePlugin

Features

This sample illustrates the following concepts:

• Configuring Dev Proxy with a .devproxy/devproxyrc.json file
• Using MockResponsePlugin to return custom API responses
• Including CORS headers in mocked responses for browser-based SPFx applications
• Making HTTP requests from SPFx web parts using HttpClient
• Displaying mocked response data and headers in a web part

Help

We do not support samples, but this community is always willing to help, and we want to improve these samples. We use GitHub to track issues, which makes it easy for community members to volunteer their time and help resolve issues.

You can try looking at issues related to this sample to see if anybody else is having the same issues.

If you encounter any issues using this sample, create a new issue.

Finally, if you have an idea for improvement, make a suggestion.

Disclaimer

THIS CODE IS PROVIDED AS IS WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.