Extending Dynamics 365 Business Central with Add In

Long ago, I read an article of how to create an add in: embedding Bing Maps, to Dynamics NAV. It was an official article from Microsoft of how Dynamics NAV can be extended using JavaScript instead of usual .NET Framework. You can find the article in here.

The article mentions creating a .DLL file, unfortunately, Dynamics 365 Business Central ditches the .NET Framework, in favor of stability. So I believed, an Add in would be impossible to be made for Dynamics 365 Business Central.

Thanks God, I was wrong. There’s official, though incomplete, documentation of how Add in survived into Dynamics 365 Business Central in here. And fortunately, many of Dynamics NAV technical peers have been giving guidance of how to utilize it. It’s great news, thanks to Kauffman here, and Vjeko, also has an older article in here along with his excellent video here.  So I have all my learning materials.

Reviving the Old Web Page Viewer

Web Page Viewer add ins first introduced into Dynamics NAV 2017. Its existence was simple: to help showing a website inside the Dynamics NAV.

What unfortunate is, this extension doesn’t survive to Dynamics 365 Business Central. It’s simply gone. Due to my need of showing external site into my tenant, I need to revive it again from the dead – or build from scratch if I have to.

The Revival

The WebPageViewer add in’s folder is still intact inside the Dynamics 365 Business Central on-premise, but I can assure you it’s NOT there in subscribe version.

WebPageViewer add-in in Dynamics 365 Business Central on-premise

I was hoping that my work would be as little as possible since it’s already there. However, turns out it wasn’t. My knowledge of JavaScript was little and I had no clue of how this thing works.

First, I need to build the extension components that I know how to: the Control Add-in and the pages. Then to simplify things, I use a setup table to store which site you want to show, and I decide to show it up under Customer Card as a proof concept it works. My extension hierarchy is show as below.

Extension hierarchy

I was able to copy paste the required WebPageViewer.js along with WebPageViewerHelper.js, but figuring out what the StartupScript should be, it’s another problem. The original WebPageViewer doesn’t provide any clue of it.  I tried to mimic the WebPageViewer.dll, but still, how to show the website was unclear.

Disassembled WebPageViewer.dll with ILSpy

So instead, I took a script that just showed a page using jQuery and slapped start.js with it. I supposed to includes all of those events and procedures inside the start.js, but my main concern was to get this up and running before doing anything more complex.

My finalized start.js for StartupScript

And, voila, it works! Though until this point still I have no clue about the Callback.html and Loader.gif. But I guess it will serve it purpose someday. The result is show as below.

It now shows my blog 😀

Thank God that Web Page Viewer is not totally dead. My revival process, though a bit crude, was succeeded.

You can always find the code in here. Feel free to comment about this.

4 thoughts on “Extending Dynamics 365 Business Central with Add In

  1. Nice Extension, but when I tried it (in various browsers) I get: ‘This content can’t be shown in a frame.
    There is supposed to be some content here, but the publisher doesn’t allow it to be displayed in a frame. This is to help protect the security of any information you might enter into this site’. Is this a security setting in modern browsers? Can it be overridden? The URL I was trying to display was an ‘outlook.com’ one.

    1. Hi Nick. I haven’t encountered this kind of problem. Please do note, I use this in subscribe/online version of BC. Make sure you’re accessing the same protocol as well (non secure http only to non secure http, and vice versa).

    1. I’ve read several sites indeed doesn’t allow embedding their site into an iframe (which I use to show the external site) for security reason. I believe that apply to those sites.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.