How to upload a custom javascript web file in Power Apps portals

So here I am back with another blog on portals and this time it’s about very basic requirements

• You want to refer external script libraries in your Power Apps portals pages.
• You want to upload a javascript file as web file in your Power Apps portal and reference it from your web pages or web templates.

If you have any of the requirements above, you are on the right blog. I am going to demo just that.

Power Apps has support for webfiles and we all know it. You can upload custom images/ files/ stylesheets and what not. But when it comes to upload a javascript file, you get the error below more often than not.

But why is that so? This is because webfiles are basically notes record with attachments. And these attachements are stored inside your DataVerse or your Dynamics 365 instance.

And more often than not, files with .js extension shall be blocked from upload. You may argue that this can be opened up. But trust me, it’s not that simple and you should not as well. I am with security team on this.

Then what’s the other way. It’s actually quite simple. Let me create a webfile.

As you can see from the above screenshot, I have created a web file and partial url I have put it to samplescript.js. It’s just a file name. I am still to upload the content.

The next step is to remove the extension from your javascript file. So if your javascript physical file name is samplescript.js, remove the .js extension.

In the next step, I will upload this as the content of my previously created web file.

That’s it. If I now want to refer it my web template, then I just need to use the below script reference.

<script type="text/javascript" src="~/samplescript.js" ></script>

Be careful about the path. My web file is under the Home page and hence I have used the path accordingly. However if your path is different, then you may need to change the src value accordingly.

Also notice that I have used the webfile name as src.

Well, that’s it. In this way you can reference you custom .js files or even external files like knockout, angular, react if you don’t want to use the CDN url’s.

Hope this helped!

Debajit Dutta
Business Solutions MVP