yonycalsin / nextjs-cors

:tada: nextjs-cors is a node.js package to provide a Connect/Express middleware that can be used to enable CORS with various options :rocket:

Nextjs Cors

Nextjs-Cors is a node.js package to provide a middleware that can be used to enable CORS with various options in nextjs applications.

Installation

First we will have to install, in order to use this wonderful package.

# Using npm
npm install nextjs-cors@latest

# Using yarn
yarn add nextjs-cors@latest

# Using pnpm
pnpm add nextjs-cors@latest

Usage

nextjs-cors uses the cors package, so we invite you to check the documentation https://github.com/expressjs/cors

pages/api/whoami.{ts,js}

import NextCors from 'nextjs-cors';

async function handler(req, res) {
   // Run the cors middleware
   // nextjs-cors uses the cors package, so we invite you to check the documentation https://github.com/expressjs/cors
   await NextCors(req, res, {
      // Options
      methods: ['GET', 'HEAD', 'PUT', 'PATCH', 'POST', 'DELETE'],
      origin: '*',
      optionsSuccessStatus: 200, // some legacy browsers (IE11, various SmartTVs) choke on 204
   });

   // Rest of the API logic
   res.json({ message: 'Hello NextJs Cors!' });
}

Support for

nextjs-cors is an open source project licensed by MIT. You can grow thanks to the sponsors and the support of the amazing sponsors. If you want to join them, contact me here.

Stay in touch

• Github @yonycalsin
• Twitter @yonycalsin

Contributors

Thanks to the wonderful people who collaborate with me !

License

nextjs-cors under License.

nextjs-cors's Issues

Origin type array not working

In official CORS package documentation I see that an array of domains can be passed as origin value: https://github.com/expressjs/cors#configuration-options

Passing an array to origin seems not to be working with the current version of this package.

To Reproduce

Working example:

await NextCors(req, res, {
  origin: "*",
});

Not working example:

await NextCors(req, res, {
  origin: ["*"],
});

Enable Cors for all routes

I see from the example that I can enable cors for that specific route - api/whoami but is there a way to apply this to all routes?

Peer dependency update for NextJs 11

Hi there.
Nextjs 11 came out.
Could you please add peer dependency support for the latest version.
Thanks in advance.

Cors origin whitelist is not working

I tried setting cors whitelist but it didn't work.

var whitelist = ['http://example1.com', 'http://example2.com']

var corsOptions = {

  origin: function (origin, callback) {
    
console.log(origin)
// get undefined

    if (whitelist.indexOf(origin) !== -1) {

      callback(null, true)

    } else {

      callback(new Error('Not allowed by CORS'))

    }

  }

}

1.0.5 release

Hi @yonycalsin could we get a package release for v.1.0.5 with the latest changes? Thanks 😃

Update for Next.js 12

Is your feature request related to a problem? Please describe.
Next.js updated to version 12.

Describe the solution you'd like
This package to support Next.js 12. I currently get warning messages when using Next.js 12:
[email protected]" has incorrect peer dependency "next@^8.1.1-canary.54 || ^9.0.0 || ^10.0.0 || ^11.0.0".

Updated peer dependences not in a release

The latest push to master to update peer dependencies has not been put in to a release yet.

It appears as though it all works fine, are we able to push a patch allowing this to be merged? It's currently causing problems with updating to next 14 in my project

Example ?

Is there an example where Axios, Next-cors is used together?

Peer dependency update for NextJs 13

Next.js 13 is out and nextjs-cors depends on nextjs 12:

Could not resolve dependency:
npm ERR! peer next@"^8.1.1-canary.54 || ^9.0.0 || ^10.0.0-0 || ^11.0.0 || ^12.0.0" from [email protected]

types not supported.

Describe the bug
Not able to import types for typescript.

To Reproduce
Steps to reproduce the behavior:

1. Install package via npm
2. Add to the nextjs project
3. In vscode, cant see imports working.

Expected behavior
Types should be loaded in vscode automatically.

Screenshots

Desktop (please complete the following information):

• OS: Macosx
• Browser Chrome
• Version: 120
• VS Code: Latest

Add global api cors middleware, always reported res argument is required error

Describe the bug
A clear and concise description of what the bug is.

Can this be used along with next js version 10 . In

I am developing app with next js version 10
we get call back from different domain for fetching data .
On developing mode things work but on production callback don't seem to work.
I believe it as cors issue

The automated release is failing 🚨

🚨 The automated release from the master branch failed. 🚨

I recommend you give this issue a high priority, so other packages depending on you can benefit from your bug fixes and new features again.

You can find below the list of errors reported by semantic-release. Each one of them has to be resolved in order to automatically publish your package. I’m sure you can fix this 💪.

Errors are usually caused by a misconfiguration or an authentication problem. With each error reported below you will find explanation and guidance to help you to resolve it.

Once all the errors are resolved, semantic-release will release your package the next time you push a commit to the master branch. You can also manually restart the failed CI job that runs semantic-release.

If you are not sure how to resolve this, here are some links that can help you:

• Usage documentation
• Frequently Asked Questions
• Support channels

If those don’t help, or if this issue is reporting something you think isn’t right, you can always ask the humans behind semantic-release.

---

No npm token specified.

An npm token must be created and set in the NPM_TOKEN environment variable on your CI environment.

Please make sure to create an npm token and to set it in the NPM_TOKEN environment variable on your CI environment. The token must allow to publish to the registry https://registry.npmjs.org/.

---

Good luck with your project ✨

Your semantic-release bot 📦🚀