# Newbie question running Zoom Apps sample

**URL:** <https://devforum.zoom.us/t/newbie-question-running-zoom-apps-sample/70967>\
**Category:** Zoom Apps\
**Created:** [June 22, 2022, 11:14pm UTC](https://devforum.zoom.us/t/newbie-question-running-zoom-apps-sample/70967 "2022-06-22T23:14:21Z")\
**Posts on this page:** 14\
**Page:** 1

<div class="post-metadata">

**Author:** ![amunje](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/amunje/32/38019_2.png) [@amunje](https://devforum.zoom.us/u/amunje)\
**Post date:** [June 22, 2022, 11:14pm UTC](https://devforum.zoom.us/t/newbie-question-running-zoom-apps-sample/70967/1 "2022-06-22T23:14:21Z")

</div>

Here is what I was able to do:

- Create an app, configured the sample code with client secrets etc. I can install the app and it shows up in my Zoom Apps tab on client. I see the name and description correctly
- I got the ngrok setup and can see the Hello Browser page when I go directly to the browser with the [ngrok.io](http://ngrok.io) url

What doesn’t work:

- When I open the app in my zoom client, it opens and empty page
- When I open the app in meeting, it opens and empty page

I was expecting to see “Welcome to your Zoom App” within Zoom client/meeting.

What am I missing? and how can I debug further.

PS: I followed these videos-

[![](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/3X/a/1/a1180b9436477545ee3ff36bce31b1194b804ee6.jpeg "How To Create a Zoom App") ](https://www.youtube.com/watch?v=otlyDxnU-RI)

[![](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/3X/f/2/f29e05d61c83dfade482b1f509872ebb1b5a8a63.jpeg "How To Configure the Basic Zoom App Sample") ](https://www.youtube.com/watch?v=SS87nqO9ScQ)

---

<div class="post-metadata">

**Author:** ![donte.zoom](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/donte.zoom/32/24412_2.png) [@donte.zoom](https://devforum.zoom.us/u/donte.zoom)\
**Post date:** [June 23, 2022, 12:59am UTC](https://devforum.zoom.us/t/newbie-question-running-zoom-apps-sample/70967/2 "2022-06-23T00:59:16Z")

</div>

Welcome, @amunje,

Thank you for posting in the Developer Forum. Great question! To debug further, it is recommended to enable developer tools for the Zoom Client. You can check out the help documentation for instructions on that: [Zoom Developer Docs](https://marketplace.zoom.us/docs/zoom-apps/referenceapp)

 ![Screen Shot 2022-06-22 at 8.53.45 PM](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/3X/d/9/d9e2b683f4c13071aa769de232551c53faf17c30.png)

For sanity check, have you reloaded the App? I’ve had success getting "Welcome to your Zoom App” to render within Zoom client/meeting by doing so.

---

<div class="post-metadata">

**Author:** ![amunje](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/amunje/32/38019_2.png) [@amunje](https://devforum.zoom.us/u/amunje)\
**Post date:** [June 23, 2022, 3:31am UTC](https://devforum.zoom.us/t/newbie-question-running-zoom-apps-sample/70967/3 "2022-06-23T03:31:44Z")

</div>

I tried refreshing the app, restart Zoom client no luck.

Thanks for the tip on enabling dev tools. I now see the error as:

> Missing OWASP Secure Headers: [“Strict-Transport-Security”,“X-Content-Type-Options”,“Content-Security-Policy”]

I double checked that in “App Credentials” field, I have latest [xyz.ngrok.io/auth](http://xyz.ngrok.io/auth) URLs in OAuth allow list (though I assume no code/config change is needed on the code side).

---

<div class="post-metadata">

**Author:** ![amunje](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/amunje/32/38019_2.png) [@amunje](https://devforum.zoom.us/u/amunje)\
**Post date:** [June 23, 2022, 4:13am UTC](https://devforum.zoom.us/t/newbie-question-running-zoom-apps-sample/70967/4 "2022-06-23T04:13:46Z")

</div>

An additional observation, when I check [http://127.0.0.1:4040/inspect/http](http://127.0.0.1:4040/inspect/http) it shows “302 Found” for the GET /auth request. Not sure if this is relevant, but I am posting just in case.

---

<div class="post-metadata">

**Author:** ![donte.zoom](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/donte.zoom/32/24412_2.png) [@donte.zoom](https://devforum.zoom.us/u/donte.zoom)\
**Post date:** [June 23, 2022, 2:47pm UTC](https://devforum.zoom.us/t/newbie-question-running-zoom-apps-sample/70967/5 "2022-06-23T14:47:00Z")

</div>

> [@amunje](#):
>
> Missing OWASP Secure Headers: [“Strict-Transport-Security”,“X-Content-Type-Options”,“Content-Security-Policy”]

@amunje I believe that Zoom only checks that the [Content-Security-Policy header](https://owasp.org/www-project-secure-headers/) is present, but it does not actually validate the values of any OWASP recommended headers. Have you tried to move policies into actual web-server headers?

---

<div class="post-metadata">

**Author:** ![amunje](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/amunje/32/38019_2.png) [@amunje](https://devforum.zoom.us/u/amunje)\
**Post date:** [June 23, 2022, 6:21pm UTC](https://devforum.zoom.us/t/newbie-question-running-zoom-apps-sample/70967/6 "2022-06-23T18:21:07Z")

</div>

I was trying to stay within the documented setup. Are you suggesting I use my own web servers (run locally) instead of the provided sample code? I did try running my own simple http server, with and without sending hardcoded 3 response headers. Still same issue.

BTW, my problem seems same as: [https://devforum.zoom.us/t/unable-to-run-sample-web-app-with-zoom-sdk/69620](https://devforum.zoom.us/t/unable-to-run-sample-web-app-with-zoom-sdk/69620)

---

<div class="post-metadata">

**Author:** ![JonStewart](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/jonstewart/32/36192_2.png) [@JonStewart](https://devforum.zoom.us/u/JonStewart)\
**Post date:** [June 23, 2022, 6:33pm UTC](https://devforum.zoom.us/t/newbie-question-running-zoom-apps-sample/70967/7 "2022-06-23T18:33:02Z")

</div>

Recommend checking that your ngrok service is forwarding all your headers. Also, after you turn on the dev tools you will be able to examine the headers that are actually delivered to the embedded client. Take a look there (and also look at the same headers in the system browser you’re looking at).

---

<div class="post-metadata">

**Author:** ![amunje](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/amunje/32/38019_2.png) [@amunje](https://devforum.zoom.us/u/amunje)\
**Post date:** [June 23, 2022, 7:03pm UTC](https://devforum.zoom.us/t/newbie-question-running-zoom-apps-sample/70967/8 "2022-06-23T19:03:54Z")

</div>

This seems to be the clue. Even for browser case, it seems ngrok is changing the case of the headers, e.g.

direct link has:  
X-Content-Type-Options: nosniff

through ngrok:  
x-content-type-options: nosniff

I am new to ngrok, still trying to figure how to tell it to deliver as is.

---

<div class="post-metadata">

**Author:** ![JonStewart](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/jonstewart/32/36192_2.png) [@JonStewart](https://devforum.zoom.us/u/JonStewart)\
**Post date:** [June 24, 2022, 1:02am UTC](https://devforum.zoom.us/t/newbie-question-running-zoom-apps-sample/70967/9 "2022-06-24T01:02:12Z")

</div>

For what it’s worth, we on the Zoom Apps team haven’t seen this (ngrok lowercasing your headers and impacting embedded browser security controls). Are you able to see the request to the server backend itself from within the Network tab of the embedded browser dev tools console? That might tell us something.

Another thought is this: have you correctly pasted your ‘Home URL’ (which includes your ngrok origin) into the build flow? I’m asking because a misspelling here would cause the server to handle a request for a url it does not support (or it might go somewhere else altogether, if the origin is incorrect). If the request goes to an endpoint on your server it doesn’t support, it would thereby not apply the correct headers (and also possibly return a 500, which might be ignored by the embedded browser anyway, owing to missing headers).

---

<div class="post-metadata">

**Author:** ![amunje](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/amunje/32/38019_2.png) [@amunje](https://devforum.zoom.us/u/amunje)\
**Post date:** [June 24, 2022, 5:02am UTC](https://devforum.zoom.us/t/newbie-question-running-zoom-apps-sample/70967/10 "2022-06-24T05:02:41Z")

</div>

When clicking within Zoom App, there seems no activity on the server. The inspect element Network tab, does not show any activity other than a about:blank entry, which is empty. The console shows the error of Missing OWASP Secure Headers, and it shows the right [xxxx.ngrok.io](http://xxxx.ngrok.io) url in the log.

I have made sure the “Home URL” is updated in “App credentials” to match the https url I get from ngrok. Have tried restarting ngrok to get new and updating it in Home URL, Redirect URL, OATH Allow list, Domain allow list. Also made sure ZM\_REDIRECT\_URL in .env matches the URL. No luck yet.

how does the sample code respond to url/auth queries? Is there any config I need to do in the server side? If I were to write my own server instead of sample, what calls do I need to respond to and what headers to include/check? Is there a document that I could refer to for that?

---

<div class="post-metadata">

**Author:** ![kiko](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/kiko/32/29907_2.png) [@kiko](https://devforum.zoom.us/u/kiko)\
**Post date:** [June 24, 2022, 4:45pm UTC](https://devforum.zoom.us/t/newbie-question-running-zoom-apps-sample/70967/11 "2022-06-24T16:45:46Z")

</div>

With ngrok’s free plan, the below page is displayed the first time you visit website([https://xxxx.ngrok.io](https://xxxx.ngrok.io)), so the OWASP header is not sent.

 ![2022_06_25_1_25](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/3X/2/c/2c0ffd74d6ccbd0136b699461934a130c98ce60e.jpeg)

You can remove this page by upgrade to any paid plan then it will be displayed correctly.

---

<div class="post-metadata">

**Author:** ![MaxM](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/maxm/32/42303_2.png) [@MaxM](https://devforum.zoom.us/u/MaxM)\
**Post date:** [June 24, 2022, 4:58pm UTC](https://devforum.zoom.us/t/newbie-question-running-zoom-apps-sample/70967/12 "2022-06-24T16:58:49Z")

</div>

@amunje Try adding the following to the domain allow list:

```auto
appssdk.zoom.us

```

We updated our guides [here](https://dev.to/zoom/setting-up-your-zoom-app-4h35#:~:text=The%20Sample%20Apps%20also%20use%20our%20CDN%20for%20the%20SDK%20to%20make%20sure%20you%20add%20the%20domain%20for%20that%20CDN%3A) to reference this change.

> [@amunje](#):
>
> how does the sample code respond to url/auth queries?

The /auth route is defined in Express and used as a callback when the authorization is successful.

> [@amunje](#):
>
> Is there any config I need to do in the server side? If I were to write my own server instead of sample, what calls do I need to respond to and what headers to include/check? Is there a document that I could refer to for that?

There shouldn’t be any extra server-side configuration that you need. There may be some issues with using a free Ngrok plan as @kiko pointed out.

I’ll check with our team to see if that’s something they’ve seen.

---

<div class="post-metadata">

**Author:** ![amunje](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/amunje/32/38019_2.png) [@amunje](https://devforum.zoom.us/u/amunje)\
**Post date:** [June 25, 2022, 5:18am UTC](https://devforum.zoom.us/t/newbie-question-running-zoom-apps-sample/70967/13 "2022-06-25T05:18:16Z")

</div>

ok. Thanks for the tips. So I skipped ngrok and am running the sample app directly on a server, and I am able to get “Hello Zoom” so looks like one hurdle crossed.

Now I added a link to an existing page that we host (and added that to allowed domains), and clicking that link now gives the “Missing OWASP Secure Headers” error. I think I have to modify our existing page to return more headers for Zoom, right?

---

<div class="post-metadata">

**Author:** ![MaxM](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/maxm/32/42303_2.png) [@MaxM](https://devforum.zoom.us/u/MaxM)\
**Post date:** [June 27, 2022, 10:27pm UTC](https://devforum.zoom.us/t/newbie-question-running-zoom-apps-sample/70967/14 "2022-06-27T22:27:11Z")

</div>

@amunje That’s right, you’ll want to make sure that your existing page is using the OWASP headers.

> **[Zoom Developer Docs](https://marketplace.zoom.us/docs/zoom-apps/architecture/)**
>
> The Zoom Developer Platform is an open platform that allows third-party developers to build applications and integrations upon Zoom’s video-first unified communications platform.
