First App is not loading

Hi, I am trying to create a Jira App and used the getting started with connect tutorial.
I followed all the steps in the tutorial and my app successfully installed on my development server. But when I want to open the app it is continually loading and crashing after around 30 seconds.

My code is copied out of the tutorial and I changed baseUrl to my ngrok Url.
I also used changed authtoken for ngrok as it was said in the tutorial.
How can I fix this?

Thank you for any help :slight_smile:

Hi @JohannesMarsch and welcome to our developer community here!

Is there anything that you can find in the browser developer console that can help here? Maybe the request timed out and that can be seen in the network tab or maybe there is a Javascript error? Do you see the request being received in the console that you are using where the app is running?
If there are no errors, is there anything shown in the response? What does “crash” mean?

Also, if you are new to developing using Atlassian in Cloud, you could check out the Forge tutorial instead of the connect one: https://developer.atlassian.com/platform/forge/build-a-hello-world-app-in-jira.

Let us know,

Caterina

1 Like

Hey,
thanks for the fast reply.

It gives out this error for 3 different sources:
Source map error: Error: NetworkError when attempting to fetch resource.

And after that it shows:
Add-on iframe timed out for add-on com.example.myapp

I don’t think it can be an error in the code because the code is the same as in the tutorial.

Johannes

:wave: Johannes,

Are you sure that the ngrok tunnel is still running? What happens if you try to open the app URL directly in a browser by going to the ngrok URL, which has been set as baseUrl directly. Does that open in the browser?

That would be <baseUrl>/helloworld.html.

You should also see a log request in the http-server -p 8000 console like this (when opening the URL directly from the browser, there will be additional parameters like xdm_e, xdm_c etc. when opening it from the Jira site.

[2022-07-21T01:22:08.582Z]  "GET /helloworld.html" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/86.0.4240.111 Safari/537.36"

Also to make sure, is this the tutorial that you are using or is it a different one?

Caterina

1 Like

Hello ccurti,

yes the ngrok tunnel was still running and I am also able to see the content of my file when I click on the baseUrl :+1:
I can also see the log request and everything works fine as it is written in the tutorial.

Yes this is the tutorial I was using. All steps work fine (also loading the app onto jira without any errors) only the last step, opening the app doesn’t work.

Johannes

Mmmhhh… could it be that the ngrok tunnel has been restarted and the baseUrl was not updated on the site?
After the baseUrl is updated in the atlassian-connect.json file, the app needs to be installed again by following these steps from the tutorial.

Any change to the Connect descriptor file require to re-install the app to become available.

If that’s the case, you should be able to see a 404 in the Network tab of the developer tools with a request being sent to an ngrok URL which is not the one defined in the baseUrl.
It would look like this:

Caterina

1 Like

I can confirm i get the same response. ngrok is running, the forwarding tunnel address is correct and if I navigate to that address in my browser I am able to get both my json file and html file (the names in the .json file all match the respective file names).

Update: I found the cause but I don’t know how to get around it. Digging through the network requests I found that the request to ngrok is returning the “You are about to visit . This website is served for free through ngrok.com. You should only visit this website if you trust whoever sent you this link”. If I navigate to that url i only get it when I clear my cache or visit for the first time in a new browser. Not sure how to bypass this in jira

For anyone that finds this. Its related to this: Ngrok agent < 3.1 no longer supported (affects out-of-box experience with ACE for non-paid ngrok plans) - #4 by SeanBourke

I got around it using cloudflare tunnel which is free and has pretty much the same functionality.