How to Serve Apple Pay Domain Association File Using NGINX and Nuxt 3

Steps to Serve the Apple Pay Domain Association File Using NGINX and Nuxt 3

1. Proxy the File to the Nuxt Dev Server

Since the Nuxt 3 development server is already serving the file correctly on localhost:3000, we can configure NGINX to proxy just this specific request to the dev server.

Here’s how you can do it:

NGINX Configuration:

In your NGINX configuration file, add the following block to proxy requests for the Apple Pay domain association file:

location = /.well-known/apple-developer-merchantid-domain-association.txt {
    proxy_pass http://localhost:3000/.well-known/apple-developer-merchantid-domain-association.txt;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;
}

This configuration ensures that when a request is made to access the Apple Pay domain association file, NGINX will proxy that specific request to the Nuxt dev server, where the file is already correctly served.

2. Reload NGINX

After making changes to the NGINX configuration file, you will need to reload NGINX for the changes to take effect. Use the following command to reload NGINX:

sudo systemctl reload nginx

This will restart the NGINX server and apply your new configuration without any downtime.

3. Access the File via Your Domain

Once your NGINX configuration is updated and reloaded, you can verify that the file is being served correctly by navigating to:

https://yourdomain.com/.well-known/apple-developer-merchantid-domain-association.txt

With just a few lines added to your NGINX configuration, you can easily serve the apple-developer-merchantid-domain-association.txt file during the Apple Pay domain verification process. This method works seamlessly with a Nuxt 3 development server, keeping your setup simple and efficient. However, don’t forget to adjust the configuration for production environments when necessary.

By following this guide, you’ll be able to quickly verify your domain for Apple Pay, ensuring that you can securely process payments on your Nuxt-powered site.