# Nginx issue with local server url **URL:** \ **Category:** Visual Editor Help\ **Tags:** visual-editor, api, nextjs\ **Created:** [October 8, 2025, 4:20pm UTC](https://forum.builder.io/t/nginx-issue-with-local-server-url/15846 "2025-10-08T16:20:03Z")\ **Posts on this page:** 2\ **Page:** 1
**Author:** ![vinzcool](https://avatars.discourse-cdn.com/v4/letter/v/a4c791/32.png) [@vinzcool](https://forum.builder.io/u/vinzcool)\ **Post date:** [October 8, 2025, 4:20pm UTC](https://forum.builder.io/t/nginx-issue-with-local-server-url/15846/1 "2025-10-08T16:20:04Z")
_Please fill out as many of the following questions as possible so we can help you promptly! If you don’t know how to answer or it does not apply, feel free to remove it or leave it blank._ **Builder content link** _e.g. [Builder.io: Visual Development Platform](http://builder.io/content/4cab34394e684fe7b93d6ef5493a8a51)_ **Builder public api key** _go to [Builder.io: Visual Development Platform](https://builder.io/account/organization) and copy your PUBLIC api key_ **What are you trying to accomplish** \*My project is currently set up with the latest NextJS, am using Nginx to serve the local URL: (\*[https://local.merchant-xxx.xyz](https://local.merchant-xxx.xyz)), so my authentication and all api calls are served under this Nginx. Now I am trying to use [Builder.io](http://Builder.io) - Visual AI Code Editor plugin with vs-code and below is my builder.config.json file. Normally, if login in browser with this URL \*(\*[https://local.merchant-xxx.xyz](https://local.merchant-xxx.xyz)), it works fine. If the same, try to log in with preview, I’m getting the error. { _“command”_: “yarn dev”, _“serverUrl”_: “[http://localhost:3000](http://localhost:3000)”, _“authenticateProxy”_: false, _“commitMode”_: “commits” } \*\*Error: \*\* Warning: [antd: message] Static function can not consume context like dynamic theme. Please use ‘App’ component instead. Error sending OTP: Error: Invalid phone number format at Object.sendOtp [as current] (webpack-internal:///(app-pages-browser)/./src/store/services/auth.ts:15:19) at async mutateByKey (webpack-internal:///(app-pages-browser)/../../node\_modules/swr/dist/\_internal/config-context-client-BoS53ST9.mjs:352:20) at async eval (webpack-internal:///(app-pages-browser)/../../node\_modules/swr/dist/mutation/index.mjs:119:30) at async Object.eval [as onClick] (webpack-internal:///(app-pages-browser)/./src/components/auth/Login.tsx:50:25) \*\*ENV config \*\* _const_ currentEnv = process.env.NEXT\_PUBLIC\_APP\_ENV || ‘development’; _const_ isBuilderPreview = typeof window !== ‘undefined’ && (window.location.hostname.includes(‘[builder.io](http://builder.io)’) || window.location.href.includes(‘[builder.io](http://builder.io)’)); _// Define API base URLs for each environment_ _const_ API\_BASE\_URLS = { development: isBuilderPreview ? ‘[https://merchant-xxx.xyz](https://merchant-xxx.xyz)’ : ‘[https://local.merchant-xxx.xyz](https://local.merchant-xxx.xyz)’, }; \*\*Nginx Config \*\* server { ``` listen 443 ssl*;* ssl_protocols TLSv1.2*;* ssl_ciphers 'EECDH+AESGCM:EDH+AESGCM:AES256+EECDH:AES256+EDH'*;* ssl_prefer_server_ciphers on*;* ssl_certificate /Users/xxxx/certs/local.merchant-xxxx.xyz.pem*;* ssl_certificate_key /Users/xxxx/certs/local.merchant-xxx.xyz-key.pem*;* server_name local.merchant-xxx.xyz*;* add_header 'Access-Control-Allow-Origin' '\*'*;* add_header 'Referrer-Policy' 'strict-origin-when-cross-origin'*;* add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, DELETE, PUT'*;* client_max_body_size 50M*;* location \~ /(auth/|bulk/) { proxy_pass https://merchant-xxxx.xyz*;* proxy_ssl_name $proxy_host*;* proxy_ssl_server_name on*;* proxy_http_version 1.1*;* } location / { proxy_pass http://127.0.0.1:3000*;* proxy_http_version 1.1*;* proxy_set_header Upgrade $http_upgrade*;* proxy_set_header Connection 'upgrade'*;* 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_cache_bypass $http_upgrade*;* } error_page 500 502 503 504 /50x.html*;* ``` location = /50x.html { ``` root html*;* } ``` } **Screenshots or video link** **Code stack you are integrating Builder with** _e.g. NextJS,_ **Reproducible code example** ---
**Author:** ![manish-sharma](https://avatars.discourse-cdn.com/v4/letter/m/8797f3/32.png) [@manish-sharma](https://forum.builder.io/u/manish-sharma)\ **Post date:** [October 9, 2025, 9:48am UTC](https://forum.builder.io/t/nginx-issue-with-local-server-url/15846/2 "2025-10-09T09:48:15Z")
Hello @vinzcool, It looks like your issue is related to how the [Builder.io](http://Builder.io) VS Code plugin connects to your app when using a local HTTPS domain with Nginx. By default, the Builder plugin uses `http://localhost:3000` as the `serverUrl`, but in your setup, all authentication and API traffic are handled through the Nginx proxy at `https://local.merchant-xxx.xyz`. Because of that mismatch, cookies and CORS headers don’t align properly, and the authentication flow (including OTP) fails in Builder’s preview mode. You can fix this by updating your `builder.config.json` to point the plugin directly to your Nginx-served domain and enable proxy authentication: ```auto { "command": "yarn dev", "serverUrl": "https://local.merchant-xxx.xyz", "authenticateProxy": true, "commitMode": "commits" } ``` Also, make sure your local SSL certificate for `local.merchant-xxx.xyz` is trusted by your OS/browser, and if you’re using cookies for auth, include the following headers in your API responses: ```auto Access-Control-Allow-Origin: https://local.merchant-xxx.xyz Access-Control-Allow-Credentials: true ``` This configuration ensures that Builder’s preview environment routes requests through your Nginx proxy correctly and that login and API calls work as expected. Thanks,