search

langflow-ai / langflow

⛓️ Langflow is a visual framework for building multi-agent and RAG applications. It's open-source, Python-powered, fully customizable, LLM and vector store agnostic.
http://www.langflow.org
MIT License
18.48k stars 2.78k forks source link

Blank UI page after started #353

Closed shengxio closed 12 months ago

shengxio commented 1 year ago

Describe the bug After started the server, when I load into the localhost:7860, it gives a completely blank page.

Here is the console log:

langflow

[09:31:00] INFO [09:31:00] - INFO - Logger set up with log level: 20(info) logger.py:28 INFO [09:31:00] - INFO - Log file: logs\langflow.log logger.py:30 INFO: Started server process [15244] INFO: Waiting for application startup. INFO: Application startup complete. INFO: Uvicorn running on http://127.0.0.1:7860 (Press CTRL+C to quit) INFO: 127.0.0.1:28610 - "GET / HTTP/1.1" 200 OK INFO: 127.0.0.1:28610 - "GET /assets/index-e39661aa.js HTTP/1.1" 200 OK INFO: 127.0.0.1:28611 - "GET /assets/index-d5403acc.css HTTP/1.1" 200 OK INFO: 127.0.0.1:28612 - "GET / HTTP/1.1" 304 Not Modified INFO: 127.0.0.1:28612 - "GET /favicon.ico HTTP/1.1" 200 OK INFO: 127.0.0.1:28612 - "GET / HTTP/1.1" 304 Not Modified INFO: 127.0.0.1:30691 - "GET / HTTP/1.1" 304 Not Modified INFO: 127.0.0.1:30691 - "GET /assets/index-e39661aa.js HTTP/1.1" 304 Not Modified INFO: 127.0.0.1:30691 - "GET /assets/index-d5403acc.css HTTP/1.1" 304 Not Modified

Browser and Version

To Reproduce Not sure if it can be reproduced in other desktop, but here are the steps:

  1. Install langflow through pip install langflow
  2. Run langflow in the powershell
  3. Open URL at: localhost:7860
  4. See error

Screenshots here is the screen I got: image

Additional questions Is there anything I missed or I can check to see where I can start debug with?

carlosrcoelho commented 1 year ago

Hi @shengxio! I tried to reproduce it as you said on my Windows machine. I did like this:

  1. On Powershell I run pip install langflow in my langflow repo folder.
  2. Run langflow in the Powershell
  3. Open URL at: http://127.0.0.1:7860/
  4. It worked.

image

Try to access it with the following link given on your log: http://127.0.0.1:7860/

shengxio commented 1 year ago

Hey Carlos:

Thanks for attending my issue. I have tried with the url that you have provided, It still doesn't work. Is it possible for you to share your console response as well? I got this one, where the /HTTP/1.1 and /favicon.ico HTTP/1.1 were returned with 304 errors.

[image: image.png]

Would be great if I can get a comparable result to see how the normal log shall look like.

Thanks!

On Thu, May 25, 2023 at 12:13 PM Carlos Coelho @.***> wrote:

Hi @shengxio https://github.com/shengxio! I tried to reproduce it as you said on my Windows machine. I did like this:

1.On powershell I run pip install langflow in my langflow repo folder.

  1. Run langflow in the Powershell
  2. Open URL at: http://127.0.0.1:7860/
  3. It worked.

[image: image] https://user-images.githubusercontent.com/80289056/240999081-b2894442-1ca0-4ba0-aae9-6bcb16333908.png

Try to access it with the following link given on your log: http://127.0.0.1:7860/

— Reply to this email directly, view it on GitHub https://github.com/logspace-ai/langflow/issues/353#issuecomment-1563314306, or unsubscribe https://github.com/notifications/unsubscribe-auth/AHXRGEFN2CZ33JW3P5JIMYTXH6OMVANCNFSM6AAAAAAYPDCL5E . You are receiving this because you were mentioned.Message ID: @.***>

-- Roland Ding Founder of Lanterns

Phone: 780-952-1077 Meet with me: https://calendly.com/shengxio-d/30min

carlosrcoelho commented 1 year ago

image

image

Check if you have the latest version of LangFlow.

shengxio commented 1 year ago

I have the version 0.0.78. I believe that would be the latest version?

Name: langflow Version: 0.0.78 Summary: A Python package with a built-in web application Home-page: https://github.com/logspace-ai/langflow Author: Logspace Author-email: @.*** License: MIT

By the way here is my system info:

OS Name: Microsoft Windows 11 Pro OS Version: 10.0.22621 N/A Build 22621 OS Manufacturer: Microsoft Corporation OS Configuration: Standalone Workstation OS Build Type: Multiprocessor Free System Boot Time: 2023-05-24, 10:01:26 PM System Manufacturer: ASUSTeK COMPUTER INC. System Model: ZenBook Pro Duo UX581GV_UX581GV System Type: x64-based PC Processor(s): 1 Processor(s) Installed. [01]: Intel64 Family 6 Model 158 Stepping 10 GenuineIntel ~2592 Mhz BIOS Version: American Megatrends Inc. UX581GV.308, 2020-05-18

Not sure if it will help, but might as well?

On Thu, May 25, 2023 at 12:42 PM Carlos Coelho @.***> wrote:

[image: image] https://user-images.githubusercontent.com/80289056/241004259-a2001fa4-efc5-46f4-a3a3-0889e1f3f12c.png

[image: image] https://user-images.githubusercontent.com/80289056/241004525-eeddafa3-6ed6-45f2-8a8c-48342e59040a.png

Check if you have the latest version of LangFlow.

— Reply to this email directly, view it on GitHub https://github.com/logspace-ai/langflow/issues/353#issuecomment-1563339425, or unsubscribe https://github.com/notifications/unsubscribe-auth/AHXRGECHHRFFGUPUZQ52ZL3XH6RYJANCNFSM6AAAAAAYPDCL5E . You are receiving this because you were mentioned.Message ID: @.***>

-- Roland Ding Founder of Lanterns

Phone: 780-952-1077 Meet with me: https://calendly.com/shengxio-d/30min

NetRxn commented 1 year ago

same issue

Loading failed for the module with source “http://127.0.0.1:7860/assets/index-e39661aa.js”.

Loading module from “http://127.0.0.1:7860/assets/index-e39661aa.js” was blocked because of a disallowed MIME type (“text/plain”).

bartanderson commented 1 year ago

I have a similar issue. I used http://localhost:7860 In tools saw this output first line related to http://127.0.0.1:7860/assets/index-e39661aa.js as above Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/plain". Strict MIME type checking is enforced for module scripts per HTML spec.

cxspi commented 1 year ago

I have the exact same issue as described above. Having issues with the same files. I also have a similar build to @shengxio

lucaseduoli commented 1 year ago

Can you guys please test with another browser and see if the issue persists?

bartanderson commented 1 year ago

Just tried on edge, no go. Same on mozilla (fresh install cause its not one I normally use) with error in dev tools Loading failed for the module with source “http://127.0.0.1:7860/assets/index-e39661aa.js”. This is the link Mozilla sends me to for more information on the error https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Content-Type-Options?utm_source=mozilla&utm_medium=firefox-console-errors&utm_campaign=default

BestDarkHorse commented 1 year ago

same issue

shengxio commented 1 year ago

Hey, just a quick question. To help improve with this problem, is there anyway that we can get the debug log? I am really curious what caused the 304 not modified error for the get operation.

Thanks

On Tue, May 30, 2023 at 7:12 PM BestDarkHorse @.***> wrote:

same issue

— Reply to this email directly, view it on GitHub https://github.com/logspace-ai/langflow/issues/353#issuecomment-1569348077, or unsubscribe https://github.com/notifications/unsubscribe-auth/AHXRGEFMBWA64EQQ7JZZL6TXI2LGLANCNFSM6AAAAAAYPDCL5E . You are receiving this because you were mentioned.Message ID: @.***>

-- Roland Ding Founder of Lanterns

Phone: 780-952-1077 Meet with me: https://calendly.com/shengxio-d/30min

GarmischWg commented 12 months ago
I have the same issuse. I tired using anaconda to create python 3.9 env to run it, gets a blank page. I also used pip venv to create 3.11 environment, it is also a blank page. I am no windows 11. Python version Langflow version result
3.9.16 0.0.81 Blank UI
3.10.11 0.0.81 Blank UI
3.11.0 0.0.81 Blank UI
3.11.0 0.0.79 Blank UI
3.11.0 0.0.76 Blank UI

All of them shows a blank screen.

GarmischWg commented 12 months ago

On the same computer, i used docker to host the app and then it worked.

allen7u commented 12 months ago

image image image After searching: pected a JavaScript module script but the server responded with a MIME type of "text/plain". Strict MIME type checking is enforced for module scripts per HTML spec. I got this: https://stackoverflow.com/questions/67286882/failed-to-load-module-script-the-server-responded-with-a-non-javascript-mime-ty https://blog.csdn.net/SunFlower914/article/details/126461682 Anyone has any clue?

allen7u commented 12 months ago

and here is what GPT4 said: https://poe.com/s/nelDLnBqf0RNpe6rMqbp

ogabrielluiz commented 12 months ago

@GarmischWg could you try clearing the cookies and cache, please?

Acidbuk commented 12 months ago

Just updated to the latest version using Miniconda3 venv, cleared cache and cookies, still the same problem, in Firefox Developer Edition 64-Bit V 114.0b9, Firefox Regular 64-Bit v113.0.2 & Edge v114.0.1823.37 64-Bit (Official Build). Also getting the same MIME error as others.

image

ogabrielluiz commented 12 months ago

We just merged #455 . This might fix this issue, so update to version 0.0.85 or higher to get the fix.

Acidbuk commented 12 months ago

Just updated to version 0.085 using Miniconda; still the same error across Firefox, Firefox Dev and Edge. Blank UI, and

Loading module from “http://127.0.0.1:7860/assets/index-639f6f6b.js” was blocked because of a disallowed MIME type (“text/plain”). 127.0.0.1:7860 Loading failed for the module with source “http://127.0.0.1:7860/assets/index-639f6f6b.js”. 127.0.0.1:7860:9:68

shengxio commented 12 months ago

Just updated version 0.085 along with all the updated dependencies. I no longer have the issue of the 304 error in the log.

However, my langflow UI is still empty across all browsers.

On Wed, Jun 7, 2023 at 3:27 PM Acidbuk @.***> wrote:

Just updated to version 0.085 using Miniconda; still the same error across Firefox, Firefox Dev and Edge. Blank UI, and

Loading module from “http://127.0.0.1:7860/assets/index-639f6f6b.js” was blocked because of a disallowed MIME type (“text/plain”). 127.0.0.1:7860 Loading failed for the module with source “ http://127.0.0.1:7860/assets/index-639f6f6b.js”. 127.0.0.1:7860:9:68 http://127.0.0.1:7860/

— Reply to this email directly, view it on GitHub https://github.com/logspace-ai/langflow/issues/353#issuecomment-1581535498, or unsubscribe https://github.com/notifications/unsubscribe-auth/AHXRGEAXCBD5HRSSPZ66PETXKDW5BANCNFSM6AAAAAAYPDCL5E . You are receiving this because you were mentioned.Message ID: @.***>

-- Roland Ding Founder of Lanterns

Phone: 780-952-1077 Meet with me: https://calendly.com/shengxio-d/30min

shuvracse03 commented 11 months ago

Just updated to 0.087 version and the UI is empty. I am using Ubuntu. When I gave right click on the loaded page and checked the page source- it says . But I checked that js in enable in my chrome. I also tried from firefox and failed. Did anyone built and run the dockerized version[with proper interface loaded]. Please help!!!

bartanderson commented 11 months ago

Did a clean build of langchain and langflow from source using python 3.10.11 I found this error that I fixed by creating the missing directory image

Then running I get this image

This is what I found in firefox image

bartanderson commented 11 months ago

I've been looking around and could it at all be related to this? https://stackoverflow.com/questions/1321878/how-to-prevent-favicon-ico-requests#

Acidbuk commented 11 months ago

has no one got a fix for this yet?. why was this closed?

Godplayer commented 11 months ago

Is there any solution for this ? This should not be closed

rxsi commented 11 months ago

same error

NetRxn commented 11 months ago

Agree, this is not resolved.

rxsi commented 11 months ago

I solve this by change my register -> HKEY_CLASSES_ROOT.js -> Content_Type=application/javascript

bartanderson commented 11 months ago

I was finally able to get this to run after the 0.2 release. image

Acidbuk commented 11 months ago

Which Browser are you using Bart?

bartanderson commented 11 months ago

I'm using chrome

On Sun, Jun 25, 2023, 11:24 AM Acidbuk @.***> wrote:

Which Browser are you using Bart?

— Reply to this email directly, view it on GitHub https://github.com/logspace-ai/langflow/issues/353#issuecomment-1606149828, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAMXAKEZHRUDNCUHTCMDDPDXNBQ2FANCNFSM6AAAAAAYPDCL5E . You are receiving this because you commented.Message ID: @.***>

Anthony-Lingjun commented 11 months ago

Hey guys, I think I fix it by editing the index.html directly...

I change this line <script type="module" crossorigin src="/assets/index-baa2e6b2.js"></script> to <script type="text/javascript" crossorigin src="/assets/index-baa2e6b2.js"></script>

and then put it under <div style="width: 100vw; height:100vh" id='root'></div>

then restart everything and it works.

Acidbuk commented 11 months ago

Yep, that fixes it. Tested in Firefox, Firefox Development and Edge.

Thanks Anthony!

adp60 commented 9 months ago

Hey guys, I think I fix it by editing the index.html directly...

I change this line <script type="module" crossorigin src="/assets/index-baa2e6b2.js"></script> to <script type="text/javascript" crossorigin src="/assets/index-baa2e6b2.js"></script>

and then put it under <div style="width: 100vw; height:100vh" id='root'></div>

then restart everything and it works.

Where is this file located? I installed it the regular way. Trying to fix the issue above as well.

ryanfw commented 8 months ago

Hey guys, I think I fix it by editing the index.html directly... I change this line <script type="module" crossorigin src="/assets/index-baa2e6b2.js"></script> to <script type="text/javascript" crossorigin src="/assets/index-baa2e6b2.js"></script> and then put it under <div style="width: 100vw; height:100vh" id='root'></div> then restart everything and it works.

Where is this file located? I installed it the regular way. Trying to fix the issue above as well. When using a virtual environment it is in the virtual environment directory (in my case .venv) in the Lib/site-packages/langflow/frontend directory

UN-O commented 7 months ago

Hey guys, I think I fix it by editing the index.html directly... I change this line <script type="module" crossorigin src="/assets/index-baa2e6b2.js"></script> to <script type="text/javascript" crossorigin src="/assets/index-baa2e6b2.js"></script> and then put it under <div style="width: 100vw; height:100vh" id='root'></div> then restart everything and it works.

Where is this file located? I installed it the regular way. Trying to fix the issue above as well.

langflow\frontend\index.html

edit this file as

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="icon" href="/favicon.ico" />
    <title>LangFlow</title>
  <link rel="stylesheet" href="/assets/index-59b24323.css">
</head>
<body id='body' style="width: 100%; height:100%">
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div style="width: 100vw; height:100vh" id='root'></div>
    <script type="text/javascript" crossorigin src="/assets/index-baa2e6b2.js"></script>
  </body>
</html>
neocao123 commented 7 months ago

the problem solvoed by simplely turn format of "index-XXXXXXX.js" from ".js"to ".mjs", both in html file and in folder.

could fix it

roy3142 commented 7 months ago

same issue with a pip install a few days ago

AzhureRaven commented 6 months ago

Hey guys, I think I fix it by editing the index.html directly... I change this line <script type="module" crossorigin src="/assets/index-baa2e6b2.js"></script> to <script type="text/javascript" crossorigin src="/assets/index-baa2e6b2.js"></script> and then put it under <div style="width: 100vw; height:100vh" id='root'></div> then restart everything and it works.

Where is this file located? I installed it the regular way. Trying to fix the issue above as well.

langflow\frontend\index.html

edit this file as

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="icon" href="/favicon.ico" />
    <title>LangFlow</title>
  <link rel="stylesheet" href="/assets/index-59b24323.css">
</head>
<body id='body' style="width: 100%; height:100%">
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div style="width: 100vw; height:100vh" id='root'></div>
    <script type="text/javascript" crossorigin src="/assets/index-baa2e6b2.js"></script>
  </body>
</html>

Tried this solution, it still doesn't work

Chippred commented 6 months ago

the problem solvoed by simplely turn format of "index-XXXXXXX.js" from ".js"to ".mjs", both in html file and in folder.

could fix it

This worked like a charm for me, thanks man! @neocao123

Acsisi commented 3 weeks ago

the problem solvoed by simplely turn format of "index-XXXXXXX.js" from ".js"to ".mjs", both in html file and in folder.

could fix it

The above edit the index.html didn't work for me. But this worked for me.

shuvracse03 commented 3 weeks ago

Thank you for your kind gesture... Shuvra kanti nath.

On Fri, 10 May 2024, 14:50 Acsisi, @.***> wrote:

the problem solvoed by simplely turn format of "index-XXXXXXX.js" from ".js"to ".mjs", both in html file and in folder.

could fix it

The above edit the index.html didn't work for me. But this worked for me.

— Reply to this email directly, view it on GitHub https://github.com/langflow-ai/langflow/issues/353#issuecomment-2104212385, or unsubscribe https://github.com/notifications/unsubscribe-auth/AZK5SG4MGEWPXDDB2FAKMATZBSC5PAVCNFSM6AAAAAAYPDCL5GVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDCMBUGIYTEMZYGU . You are receiving this because you commented.Message ID: @.***>