Issues displaying a PDF in Streamlit App

[Helen_Park]

Hello!
Around a month ago, I believe my app was working in displaying a PDF from my desktop. At the moment, I’m attempting to read a file in, save it to my desktop, then read the file from my desktop and show it as a PDF. (Perhaps there is an easier way to do this, but that’s the best I could find!)
The code that is doing this is below:

elif choice == ‘MAP’:

#outdir = st.text_input("Please enter the pathway to you documents folder, in order to generate KEGG file",value="/Users/hellpark/Desktop/",help='Ex: /Users/hellpark/Desktop/')
outdir = "/Users/hellpark/Desktop/"
pathinput = st.text_input("To generate Halomonas map of genes in KEGG, please enter pathway of interest",value='hel00010',help='type pathway like, hel00010 after the path:')
img_filename = "%s.pdf" % pathinput
draw_kegg_map(pathinput,outdir)

with open(os.path.join(outdir, img_filename),"rb") as f:
     base64_pdf = base64.b64encode(f.read()).decode('utf-8')
     pdf_display = F'<iframe src="data:application/pdf;base64,{base64_pdf}" width="900" height="700" type="application/pdf"></iframe>'
     st.markdown(pdf_display, unsafe_allow_html=True)

Also, here is the link to my GitHub and the app:
https://share.streamlit.io/helloftroy/omics_td1.0/main/Streamlit.py (select ‘MAP’)
Omics_TD1.0/Streamlit.py at main · helloftroy/Omics_TD1.0 · GitHub

And, my issue is in the screenshot below!

If you can help at all that would be amazing! It did used to work, and I haven’t changed the code!

Helen

[randyzwitch]

Hi @Helen_Park -

It’s important to remember that once an app is published on Streamlit Cloud or any other deployment platform, the file paths now refer to where the Python code is running, not the browser where the user is sitting. So this line in your code won’t work:

helloftroy/Omics_TD1.0/blob/main/Streamlit.py#L198

You would need to have that directory in your GitHub repo and refer to it by a path reference to make this app work on Streamlit Cloud.

Best,
Randy

[Helen_Park]

Continuing the discussion from Issues displaying a PDF in Streamlit App:

@randyzwitch

refer to it by a path reference

@randyzwitch Thank you so much for the help
What you’ve explained makes sense! Unfortunately, I’ve tried a few things and the app is still not displaying anything. Specifically, I can’t get the app to (1) write the pdf to github, and (2) display the pdf in the app. I tried uploading an example PDF (ko00020.pdf) and there is no longer an error, but unfortunately nothing is being displayed!
Do you have any more wisdom for me
Here is my current code:

outdir = ‘…/omics_td1.0/outputdata/’
img_filename = ‘ko00020.pdf’
canvas.draw(os.path.join(outdir, img_filename))

with open(os.path.join(outdir, img_filename),“rb”) as f:
base64_pdf = base64.b64encode(f.read()).decode(‘utf-8’)
pdf_display = F’’
st.markdown(pdf_display, unsafe_allow_html=True)

[Helen_Park]

Hello!
I’ve been struggling to get the app to display this PDF, I believe the path reference is working properly now! The PDF displays as blank on the live streamlit, though it works perfectly in my local machine. At the moment, the app should just be showing a PDF uploaded to the GitHub page, nothing fancy.
Are you able to help me figure this out? All help is much much appreciated!