jandusek / twilio-phone-client

SMS & call web client for Twilio phone numbers
28 stars 14 forks source link

blank index page #8

Closed vishwajeetio closed 3 years ago

vishwajeetio commented 3 years ago

After successfully deploying it gave me a blank index page. Any idea what could be the issue? thank you

jandusek commented 3 years ago

Are you seeing any errors in the console?

vishwajeetio commented 3 years ago

Nah, It did not give me any errors.

jandusek commented 3 years ago

Hmm, not much to go on then. The build phase didn't report any issues?

vishwajeetio commented 3 years ago

On the first try, it gave me an error on the Twilio cli login step and keytar but after a bit of tweaking, it worked perfectly fine. I am going to try a fresh installation once again and see what happens. Any idea how can I make this service editable from Twilio GUI(probably by setting twilio_ui= true but not sure where can I add it)? I was also thinking about making it single click installable using docker-compose? thank you

vishwajeetio commented 3 years ago

index.html:1 GET https://phoneapp-xxxx-dev.twil.io/static/js/main.b669ad4c.chunk.js net::ERR_ABORTED 404 index.html:1 GET https://phoneapp-xxxx-dev.twil.io/static/css/main.40918d08.chunk.css net::ERR_ABORTED 404 index.html:1 GET https://phoneapp-xxxx-dev.twil.io/static/js/2.9e0a2b5c.chunk.js net::ERR_ABORTED 404 index.html:1 GET https://phoneapp-xxxx-dev.twil.io/static/js/main.b669ad4c.chunk.js net::ERR_ABORTED 404 manifest.json:1 GET https://phoneapp-xxxx-dev.twil.io/manifest.json 404 these are the error messages I am getting on browser console(with actual URL) after loading the index page

vishwajeetio commented 3 years ago

Hi @jandusek just got it working after adding the line below to the package.json file "homepage": "build", Everything is working great now. Any idea on where these SMS are stored so that I can get a backup of these? Also one this is worrying is that we don't see the actual callers number. I think it's their API. thank you

hugohhk commented 3 years ago

It also gives me blank index page or not found. Should the url be "https://twilio-phone-client-XXXX-dev.twil.io/index.html" or "https://twilio-phone-client-XXXX-dev.twil.io/build/index.html"?

And what is SECRET in the env file? It is not mentioned any where in the installation page. SECRET=some_password

hugohhk commented 3 years ago

Hi @jandusek just got it working after adding the line below to the package.json file "homepage": "build", Everything is working great now. Any idea on where these SMS are stored so that I can get a backup of these? Also one this is worrying is that we don't see the actual callers number. I think it's their API. thank you

@jandusek @odssh , can you please explain why did you add "homepage": "build" to the package.json file? And what are we supposed to define for SECRET variable? What is its use? I can't make it work.

Thanks.

jandusek commented 3 years ago

@odssh apologies for the late response

Any idea on where these SMS are stored so that I can get a backup of these?

These are stored both in Twilio's Programmable Messaging logs and in the Programmable Chat channels which is what the client uses to keep an easy to access thread history.

jandusek commented 3 years ago

@hugohhk

And what are we supposed to define for SECRET variable? What is its use?

Ah, sorry about that, I'll add this to the documentation. It's essentially a password. If it's provided, the app will ask for it when opened.

hugohhk commented 3 years ago

@jandusek , thanks for replying. Finally got it working.

I think my issue was due to the Twilio login profile using the API Key and Secret. Needed to explicitly declare env variables of TWILIO_ACCOUNT_SID and TWILIO_AUTH_TOKEN to get the final function deployment successful.

Besides, I found a weird behavior when loading the app. It starts with a blank page. I have to click on the blank space a few times to be able to see the login UI.

Anyway, a nice phone app!

dudeisbrendan03 commented 3 years ago

Is there anyway to deploy this outside of the Twilio runtime service, since it's kind of insecure we were going to demo using it behind Teleports app proxy for our service desk instead of publicly exposed on *.twil.io

cgoosen commented 3 years ago

I was also seeing the same blank page after a successful build. The issue relates to the paths of a few components referenced in the index.html

my project deployed with a index.html url of https://twilio-phone-client-XXXX-dev.twil.io/build/index.html <-- note the /build/ in the path. The index.html relies on these 3 files:

/static/css/main.6fd2da93.chunk.css /static/js/2.b97043b4.chunk.js /static/js/main.38231198.chunk.js

those files don't exist in the path specified and are actually in the same /build/ location as the index.html - updating the urls in the index.html fixed this for me:

/build/static/css/main.6fd2da93.chunk.css /build/static/js/2.b97043b4.chunk.js /build/static/js/main.38231198.chunk.js

for those asking about making this editable via the web console, you can do that via the twill cli with the following command: twilio api:serverless:v1:services:update --sid ZSXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX --ui-editable

@jandusek - this is a great project, I really like this client - thanks!

jandusek commented 3 years ago

Thank you for the PR @cgoosen, merged now. Just out of curiosity, from what OS were you doing the deploy?

cgoosen commented 3 years ago

No worries - I'm using Ubuntu 18.04.1 LTS

noamanag commented 3 years ago

@jandusek , thanks for replying. Finally got it working.

I think my issue was due to the Twilio login profile using the API Key and Secret. Needed to explicitly declare env variables of TWILIO_ACCOUNT_SID and TWILIO_AUTH_TOKEN to get the final function deployment successful.

Besides, I found a weird behavior when loading the app. It starts with a blank page. I have to click on the blank space a few times to be able to see the login UI.

Anyway, a nice phone app!

I am facing some authentication issues as well, when I try to deploy the app the second time around after all the config is done, it says

✖ Failed Deployment

│ ERROR Failed API Request 20003 │ │ Authenticate │ │ More info: https://www.twilio.com/docs/errors/20003

npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! phone-client@0.0.1 deploy: react-scripts build && rm -rf deploy/assets/ && mkdir deploy/assets/ && cp -r build/* deploy/assets/ && cd deploy && TWILIO_SERVERLESS_API_CONCURRENCY=1 twilio serverless:deploy npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the phone-client@0.0.1 deploy script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in: npm ERR! /Users/noaman_sarguroh/.npm/_logs/2021-05-07T10_05_22_038Z-debug.log

jandusek commented 3 years ago

@noamanag I've answered re error 20003 in https://github.com/jandusek/twilio-phone-client/issues/12

Closing this as the blank page issue should be solved in https://github.com/jandusek/twilio-phone-client/commit/9b2cd242b281a089d1f3db7dd7db7dae85a3e433

Sunilg1234 commented 2 years ago

Hello everyone, I followed the installation process line by line. After the last deploy, i went to this link right: https://twilio-phone-client-xxxx-dev.twil.io/index.html ? Do I have to do anything else? I run npm deploy. then go to the above link, it says 'Not Found' with white background. Please help. Thank you!

@jeetto @jandusek @cgoosen @hugohhk