Blocked a frame with origin JS Error when accessing SharePoint page in another web application

Hi ,

We have two web applications in our SharePoint 2016 farm(e.g. http://abc:40109).

We have to display SharePoint Page(e.g. http://abc:40109( of web application (http://abc:40109) into another web application in Modal Dialog box(which renders the page in iframe).

The page is display correctly and worked as expected. Moreover ,AllowFraming control is already added. 

When page is getting open and looking into console , it is showing below error 

init.js?rev=X4eySfc6naagwmlfS0Ythw%3D%3DTAG0:1 Uncaught DOMException: Blocked a frame with origin "http://abc:40109" from accessing a cross-origin frame.
at SPLoggers_module_def (http://abc:40109/_layouts/15/init.js?rev=X4eySfc6naagwmlfS0Ythw%3D%3DTAG0:1:259782)
at $_global_init (http://abc:40109/_layouts/15/init.js?rev=X4eySfc6naagwmlfS0Ythw%3D%3DTAG0:1:42807)
at http://abc:40109/_layouts/15/init.js?rev=X4eySfc6naagwmlfS0Ythw%3D%3DTAG0:1:280218
SPLoggers_module_def @ init.js?rev=X4eySfc6naagwmlfS0Ythw%3D%3DTAG0:1
$_global_init @ init.js?rev=X4eySfc6naagwmlfS0Ythw%3D%3DTAG0:1
(anonymous) @ init.js?rev=X4eySfc6naagwmlfS0Ythw%3D%3DTAG0:1
 

The code line in init.js (if(window.parent!=null&&typeof window.parent.SP=="object"&&typeof window.parent.SP.CacheLogger=="object"&&window.parent.location.protocol==window.location.protocol) is trying access parent object.  

We have tried different solutions but nothing worked to remove that error. Below are some solutions we tried 

1. Adding Custom Headers like X-FrameOptions , Content-Security-Policy , Access-Control-Allow-Origin etc.

2. Configured URL Writing .

3. Setting Allow external iframes in Html Field Security options

Any help  will be appreciated.

Thanks

Ankur Parmar