Custom admin link in Ghost causes refuse to connect error

I am using Ghost Version 4+.

I created a custom admin link by customizing my config.production and now I am successfully redirected to my subdomain admin.mysite.com, but the problem is that everything is working fine but it refuses to connect in editing sections. I have attached a screenshot for reference.

Reference image to the error being shown

It's basically a frame showing "refused to connect" earlier which was working fine and showing a preview of all functions of the site in real time. This was working fine on my main link - mysite.com/ghost but refuses to connect since I changed my config to a new link admin.mysite.com

This is my config file ->

{
  "url": "https:/mysite.com",
  "admin": {
    "url": "https://admin.mysite.com/"
  },
  "server": {
    "port": 2369,
    "host": "127.0.0.1"
  },

Important notes to consider :

When I open my subdomain(admin.mysite.com) it shows default Nginx page, so I used Cloudflare redirect to point it to admin.mysite.com/ghost which holds the admin area after changing my configuration above.
I have set my subdomain by an A record pointing to the IP address of my server. What I have not done is configuring Nginx. This is reference information hope anyone finds any solution to why I am facing this.

My assumption is that ghost is designed to connect everything at the default link which is mysite.com/ghost, the forum of ghost shows a way to do it Ghost Admin Security: Is there any way to redirect Admin-URL (Redirection Alternative)

I am not sure if I have to configure Nginx, DNS, or Config.

Solution

If you are using Nginx :

location / {
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header Host $http_host;
    proxy_pass http://127.0.0.1:2369;
    add_header X-Frame-Options "ALLOW-FROM URI";
    
}

Add this line

add_header X-Frame-Options "ALLOW-FROM URI";

If you are using Apache

Header always set X-Frame-Options "ALLOW-FROM URI"

For reference : X-Frame-Options Mozzila

Adding this header shall add a vulnerability of embedding a webpage within an Iframe despite being from the same origin.