How to use vercel nameservers in cloudflare?

[waptik]

Hi. I have a domain name that I bought from a domain name provider and I setup Cloudflare as my DNS provider. I added my domain name to my vercel project as a wildcard domain name. I'm basing my project on https://vercel.com/guides/nextjs-multi-tenant-application#5.-deploy-to-vercel
How do I insert the following nameservers in Cloudflare? Or do I have to forgo cloudflare and use prokbun as my DNS provider?

ns1.vercel-dns.com
ns2.vercel-dns.com

[EryouHao]

Any progress on this issue? @waptik

[waptik]

Nope. The only solution is to have another domain(eg. notaku.site) exclusively have vercel nameservers so that you can use wildcard subdomain(blog.notaku.site) and your primary domain(eg. notaku.website) on cf for frontpage and site management

[amyegan]

Edit: See latest answer here: #7739 (reply in thread)

https://vercel.com/docs/integrations/cloudflare

[amyegan]

Can you share more details about what you're trying to add and what errors you're getting? If you are using subdomains, you'll need to add records for each of them as well as the apex domain. A walk-through, in case you didn't already see it, can be found at vercel.com/docs/concepts/projects/domains/add-a-domain. Be sure to also set the SSL/TLS mode to "Full" to encrypt all traffic if using Cloudflare proxy

[benknab]

yeah, I followed the docs, the subdomain has the CNAME record, Cloudflare has SSL on Full, and everything works correctly, but Vercel is sending me false positive error emails about my subdomains having an invalid configuration and in the Domains tab it also shows up with the invalid configuration error

but let me repeat that I do not experience any errors, it's just the message showing up

[amyegan]

Sorry to hear you're still getting incorrect error messages @bkiac. Can you start a new discussion or submit a case to the Customer Success Team so we can work together to solve this without pinging everyone else in this discussion?

[benknab]

thank you @amyegan, I submitted a ticket

[codewithmilo]

Just experienced this same issue: CNAME record set up, site works properly, but getting invalid configuration issues from namespaces that I can't change. Was there any solution discovered?

[leerob]

P.S. we have new docs for nameservers! https://vercel.com/docs/concepts/projects/domains/managing-nameservers

[waptik]

P.S. we have new docs for nameservers! vercel.com/docs/concepts/projects/domains/managing-nameservers

The new documentation is related to the scope of this discussion. If i'm wrong and it is related then there's not enough information on how to proceed.

[akhil-naidu]

@amyegan, when using Cloudflare as my domain registrar, is it impossible to use Vercel wildcard domains?

I cannot edit my nameservers in Cloudflare but can add NS records in Cloudflare, so is it possible to add wild card support using these NS records?

[raRaRa]

@amyegan Thank you! Is there an alternative solution to this, because Cloudflare doesn't allow people to use a different name server for domains registered through them. One potential solution I have in mind is to use URL rewrite for the hostname on the Cloudflare side, so that {customer}.domain.com rewrites to domain.com/c/{customer} - that way I could also skip the middleware layer in NextJS. Are there any potential cons to this?

[amyegan]

You could use rewrites, or add customer subdomains as need, instead of using a wildcard. The downside is the extra work of setting up each subdomain if you need to do it often. Not a huge downside if new subdomains don't need to be created frequently.

Alternatively, if you think wildcard domains would make things much easier for your app, you can transfer the domain either to Vercel or to another registrar. Namecheap, Google Domains, and Hover are popular recommendations.

[akhil-naidu]

@raRaRa If you consider using subdomains as individual applications, I see no issues. But when you use NextJS for a multi-tenant application, I prefer adding the necessary subdomains via an API call. Configuring wildcards would be better for this API call to create a subdomain and SSL.

@amyegan Though I crossed the 60 days domain limit to transfer it to another registrar, I'm a premium user of Cloudflare, which provides us with many other benefits like Web application Firewall and Page Rules. So migrating my register would be my least priority.

So, for now, I created a wildcard CNAME record pointing at cname.vercel-dns.com, and everything seems fine, at least for using this with Vercel Platforms Starter Kit.

[raRaRa]

I ended up URL re-writing through CloudFront.

Cloudflare -> CloudFront (re-writes {customer}.domain.com to domain.com/c/{customer}) -> Vercel

This way I don't need to create subdomain per customer. However I still needed NextJS middleware to URL rewrite client-side requests.

Once Cloudflare snippets is released I will switch to Cloudflare -> Vercel instead of using CloudFront in the middle.

[amyegan]

Thanks for sharing that @akhil-naidu. I hadn't had success with that in the past, but maybe it's a premium feature or something changed since I last tried it. I'm happy to hear the wildcard CNAME record is working for you! Looks like I need to try it again. 😄

And thank you @raRaRa for sharing your solution as well. I'm glad the CloudFront rewrite works for you!

[smaeda-ks]

For those who landed on this old community post, let me update the previously marked answer, as it contains some inaccurate information as of today.

First of all, you can use a wildcard domain on your Vercel project with Cloudflare name servers. Our documentation, as well as the UI's error message, are somewhat misleading, but you can "ignore" the error message as long as you follow the below steps.

1. Add your wildcard domain to your project

First, you add *.example.com to your project (Project Settings -> Domains). At this stage, you will see the Invalid Configuration error message on the UI instructing you to change its name servers to ours. Please ignore this, you will be fine.

2. Issue your wildcard TLS certificate via Vercel CLI

This is the most crucial step. Since we use Let's Encrypt certificates, there are two ways to verify your domain ownership:
https://letsencrypt.org/docs/challenge-types/

Because this is a "wildcard" certificate, you can only verify via the DNS-01 challenge mentioned in the above documentation. This is why we initially said it's necessary to change the name servers so that we can automatically handle this DNS-01 challenge on our side without having you manually create a verification TXT DNS record. But that's not a hard requirement. You can still do this DNS-01 challenge manually using the Vercel CLI:
https://vercel.com/docs/cli/certs#challenge-only

$ vercel certs issue "*.example.com" --challenge-only
Vercel CLI 28.12.6
> A certificate issuance for *.example.com has been started [2s]
  Add the following TXT records with your registrar to be able to the solve the DNS challenge:

name                   type        value
_acme-challenge        TXT         YN7LvYccJ0Xlrih9lIb--gcgH8OzlsD4POWf15XtrDc

> To issue the certificate once the records are added, run:
  `vercel certs issue *.example.com`
  Read more: https://err.sh/vercel/solve-challenges-manually

$ vercel certs issue "*.example.com"
Vercel CLI 28.12.6
> Success! Certificate entry for *.example.com created [6s]

^^ This is the example output. You can then create a new TXT record via the Cloudflare DNS interface with the provided value.

[Important Note]

Because Let's Encrypt certificates have 90 days expiration period, and you will need a new verification challenge signature for the certificate auto-renewal, you have to follow the same step and re-issue the certificate and update the TXT record with the new verification signature before the cert expires. Please see my follow-up comment below for more details.

3. Create a wildcard DNS entry in Cloudflare

Once step 2 is completed, you can add a new wildcard DNS entry via the Cloudflare DNS interface, and point it to our shared CNAME hostname cname.vercel-dns.com. So it looks something like this:

4. (Optional) Disable warning notifications (UI's Inbox notification/Email)

Note that because of how we're checking the domain's name servers today, the Invalid Configuration error message will continue to appear even though your setup is perfectly fine.

Until we have better UI/UX around this name server check, you can disable warning notifications via https://vercel.com/account/notifications so we won't bother you.

• Web -> Domains -> Configuration
• Email -> Domains -> Configuration

[raRaRa]

Thank you so much for this clarification, and this makes 100% sense. I ended up using CloudFront in front of Vercel to bypass this issue. Cloudflare -> CloudFront (basically rewrites the request from *.domain.com to domain.com) -> Vercel. Really glad to be able to skip CloudFront with this solution :)

[smaeda-ks]

My apologies. I spoke too soon. I also had a misunderstanding and fixed my answer above.

Basically, as of today, we can't renew wildcard certificates automatically if the domain's name servers are not pointing to Vercel. Therefore, you will need to manually re-issue your wildcard certificate every ~90 days (all Let's Encrypt certs have 90 days expiration period) using the Vercel CLI as highlighted above.

The main reason is that renewing a Let's Encrypt cert requires a new verification signature; thus, the initial TXT record won't work for the next renewal, unfortunately.

Yes, the workflow is still cumbersome and should be streamlined; we acknowledge that. I just chatted with our engineering team, and we do think there's a way to eliminate this limitation. So I'm going to raise an internal ticket and pursue that route, but there are some challenges, and it will need enough engineering time investment, which may take some time to work on. We will keep you updated on this thread.

In the meantime, I thought I'd also mention another workaround you may be able to approach. In this case, you can also upload your custom certificates:
https://vercel.com/docs/concepts/projects/domains/custom-SSL-certificate
(note that it is only available to the Enterprise plan)

Since Cloudflare allows you to issue custom certificates using their Origin Certificate offering with a much longer expiration period (up to 15 years), you could upload it to Vercel to reduce the operational burden, so you don't have to update the certificate every XX days.

We can also discuss potentially making the custom cert feature available to other plans (Pro and Hobby) as an alternative approach.

[smaeda-ks]

Also, Cloudflare seems to support custom name servers, and it's available to Business and Enterprise plans as per:
https://developers.cloudflare.com/dns/additional-options/custom-nameservers/

[smaeda-ks]

For those folks landing this page today, we now have a workaround allowing you to set up and renew your wildcard certificates without switching to Vercel name servers. Please follow this guide: https://vercel.com/guides/wildcard-domain-without-vercel-nameservers

tl;dr; we started allowing the NS delegation method for the DNS-01 challenge.

https://letsencrypt.org/docs/challenge-types/#dns-01-challenge

Since Let’s Encrypt follows the DNS standards when looking up TXT records for DNS-01 validation, you can use CNAME records or NS records to delegate answering the challenge to other DNS zones. This can be used to delegate the _acme-challenge subdomain to a validation-specific server or zone.

[update on 8/30/2023]

The above workaround only partially supports setting up a wildcard cert with Cloudflare proxy mode.

tl;dr; Cloudflare also uses the same _acme-challenge DNS label for their cert issuance, which conflicts with this workaround, making them unable to issue certs correctly.

Therefore, we recommend not using Cloudflare proxy mode if you need to set up a wildcard cert on Vercel. Consider using DNS-only mode instead.

Otherwise, you will need to manipulate your DNS record periodically to make it work, or upload a custom cert to Cloduflare, which still requires you to update and upload the new cert manually periodically.

[sanderfish]

@smaeda-ks this looks promising! I've started setting this up. Without proxy, the wildcard subdomain works!

As soon as I turn on the proxy; domain verification in the project in Vercel fails.

This is what I've done so far

• Added wildcard domain to Cloudflare: CNAME | *.domain.com | cname.vercel-dns.com
• Added _acme-challenge NS records to Cloudflare
• Added wildcard domain to Domains *.domain.com
• Cloudflare SSL is set to full (APEX domain uses Cloudflare proxy and runs on Vercel without issue)

I don't see the "Enable Vercel Domains" button, which I think is the issue.

[smaeda-ks]

@sanderfish Vercel DNS is already enabled for that domain and that's why you don't see the button. Your wildcard cert seems to be available now: $ sslscan --sni-name="*.checkoutpage.co" cname.vercel-dns.com

[sanderfish]

@smaeda-ks thanks for the reply! I'm testing this on another domain and while it is working, with Cloudflare proxy turned on, I'm still seeing the following error in the dashboard.

With the proxy turned on, I'm also unable to verify custom domains via the CNAME record, such as:

checkout.otherdomain.com CNAME cname.checkoutfront.com

As soon as I turn the proxy off, the verification goes through.

[kaumac]

@sanderfish what solution did you decide on? Curious as I'm facing the same problem.

I'm subscribing to this to hopefully get updates when a solution rolls out. I'll be using the vercel nameservers for now as I don't think there's much benefit in using cloudflare without proxy.