CompositionalIT / SAFE-Dojo

An introductory dojo to learn how to develop full stack web applications in F#
378 stars 126 forks source link

Error calling server API #164

Closed obiwanjacobi closed 1 year ago

obiwanjacobi commented 1 year ago

I have cloned the repo locally and followed the instructions. I get the client frontend at localhost:8080 but calling the server results in:

Http error (504) from server occured while making request to /api/IDojoApi/GetDistance

I also see periodically this error in the web (client) console (F12 in the browser): WebSocket connection to 'ws://localhost:8000/socketcluster/' failed:

There is nothing running on port 8000 so... what gives?

Please help ;-)

mattgallagher92 commented 1 year ago

Hi @obiwanjacobi, thanks for reporting this issue. Unfortunately, I'm not able to reproduce it.

Triggering a call to the server via interacting with the application in the browser works fine for me when running from master:

image

And I don't see any of the socketcluster errors either

image

Are you able to give any more details, for example any error logs that you see in the terminal you launch the application from (using dotnet run)?

obiwanjacobi commented 1 year ago

dotnet run command output:

C:\Users\marc\source\repos\SAFE-Dojo>dotnet run
run Run
Building project with version: LocalBuild
Shortened DependencyGraph for Target Run:
<== Run
   <== InstallClient
      <== Clean

The running order is:
Group - 1
  - Clean
Group - 2
  - InstallClient
Group - 3
  - Run
Starting target 'Clean'
C:\Users\marc\source\repos\SAFE-Dojo\src\Client> "dotnet" fable clean --yes (In: false, Out: false, Err: false)
Fable: F# to JS compiler 3.7.20
Thanks to the contributor! @eugene-g
Stand with Ukraine! https://standwithukraine.com.ua/

This will recursively delete all *.fs.js[.map] files in C:\Users\marc\source\repos\SAFE-Dojo\src\Client
Deleted output\fable_modules
Clean completed! Files deleted: 0
Finished (Success) 'Clean' in 00:00:00.4933799
Starting target 'InstallClient'
.> "C:\Program Files (x86)\nodejs\npm.CMD" install (In: false, Out: false, Err: false)

up to date, audited 460 packages in 3s

60 packages are looking for funding
  run `npm fund` for details

6 vulnerabilities (3 moderate, 2 high, 1 critical)

To address issues that do not require attention, run:
  npm audit fix

To address all issues (including breaking changes), run:
  npm audit fix --force

Run `npm audit` for details.
Finished (Success) 'InstallClient' in 00:00:04.4369324
Starting target 'Run'
C:\Users\marc\source\repos\SAFE-Dojo\src\Shared> "dotnet" build (In: false, Out: false, Err: false)
Microsoft (R) Build Engine version 17.2.2+038f9bae9 for .NET
Copyright (C) Microsoft Corporation. All rights reserved.

  Determining projects to restore...
  Paket version 7.2.0+bb14ab674b2748070a624f394cd6796e11aaffa8
  Restoring C:\Users\marc\source\repos\SAFE-Dojo\src\Shared\Shared.fsproj
  Starting restore process.
  Total time taken: 0 milliseconds
  Restored C:\Users\marc\source\repos\SAFE-Dojo\src\Shared\Shared.fsproj (in 191 ms).
  Paket version 7.2.0+bb14ab674b2748070a624f394cd6796e11aaffa8
  Restoring C:\Users\marc\source\repos\SAFE-Dojo\src\Shared\Shared.fsproj
  Starting restore process.
  Total time taken: 0 milliseconds
  Shared -> C:\Users\marc\source\repos\SAFE-Dojo\src\Shared\bin\Debug\net6.0\Shared.dll

Build succeeded.
    0 Warning(s)
    0 Error(s)

Time Elapsed 00:00:04.95
server: C:\Users\marc\source\repos\SAFE-Dojo\src\Server> dotnet watch run
client: C:\Users\marc\source\repos\SAFE-Dojo\src\Client> dotnet fable watch -o output -s --run npm run start
C:\Users\marc\source\repos\SAFE-Dojo\src\Client> "dotnet" fable watch -o output -s --run npm run start (In: false, Out: true, Err: true)
C:\Users\marc\source\repos\SAFE-Dojo\src\Server> "dotnet" watch run (In: false, Out: true, Err: true)
client: Fable: F# to JS compiler 3.7.20
client: Thanks to the contributor! @do-wa
client: Stand with Ukraine! https://standwithukraine.com.ua/
client: Parsing Client.fsproj...
client: .> cmd /C dotnet restore Client.fsproj -p:FABLE_COMPILER=true
client:   Determining projects to restore...
client:   Paket version 7.2.0+bb14ab674b2748070a624f394cd6796e11aaffa8
client:   Restoring C:\Users\marc\source\repos\SAFE-Dojo\src\Shared\Shared.fsproj
client:   Starting restore process.
client:   Total time taken: 0 milliseconds
server: dotnet watch ?? Started
client:   Restored C:\Users\marc\source\repos\SAFE-Dojo\src\Client\Client.fsproj (in 206 ms).
client:   1 of 2 projects are up-to-date for restore.
client: Some Nuget packages contain information about NPM dependencies that can be managed by Femto: https://github.com/Zaid-Ajaj/Femto
client: Project and references (162 source files) parsed in 3997ms
client: Loaded Feliz.HookAttribute from ..\..\..\..\..\.nuget\packages\feliz.compilerplugins\1.5.0\lib\netstandard2.0\Feliz.CompilerPlugins.dll
client: Loaded Feliz.ReactComponentAttribute from ..\..\..\..\..\.nuget\packages\feliz.compilerplugins\1.5.0\lib\netstandard2.0\Feliz.CompilerPlugins.dll
client: Started Fable compilation...
server: C:\Users\marc\source\repos\SAFE-Dojo\src\Server\DataAccess.fs(90,26): warning FS0044: This construct is deprecated. WebRequest, HttpWebRequest, ServicePoint, and WebClient are obsolete. Use HttpClient instead. [C:\Users\marc\source\repos\SAFE-Dojo\src\Server\Server.fsproj]
server: info: Microsoft.Hosting.Lifetime[14]
server:       Now listening on: http://0.0.0.0:8085
server: info: Microsoft.Hosting.Lifetime[0]
server:       Application started. Press Ctrl+C to shut down.
server: info: Microsoft.Hosting.Lifetime[0]
server:       Hosting environment: Development
server: info: Microsoft.Hosting.Lifetime[0]
server:       Content root path: C:\Users\marc\source\repos\SAFE-Dojo\src\Server
client: Fable compilation finished in 8570ms
client: .> cmd /C npm run start
client: Watching ..
client: > start
client: > webpack-dev-server --mode development
client: Bundling for development...
client: <w> [webpack-dev-server] "hot: true" automatically applies HMR plugin, you don't have to add it manually to your webpack configuration.
client: <i> [webpack-dev-server] [HPM] Proxy created: /api/**  -> http://localhost:8085
client: <i> [webpack-dev-server] [HPM] Proxy created: /socket/**  -> http://localhost:8085
client: <i> [webpack-dev-server] Project is running at:
client: <i> [webpack-dev-server] Loopback: http://localhost:8080/
client: <i> [webpack-dev-server] On Your Network (IPv4): http://192.168.178.20:8080/
client: <i> [webpack-dev-server] Content not from webpack is served from 'C:\Users\marc\source\repos\SAFE-Dojo\src\Client\public' directory
client: <i> [webpack-dev-server] 404s will fallback to '/index.html'
client: asset vendors-node_modules_pigeon-maps_lib_index_esm_js-node_modules_recharts_es6_cartesian_Cartesi-9014ff.js 7.06 MiB [emitted] (id hint: vendors)
client: asset app.js 3.33 MiB [emitted] (name: app)
client: asset index.html 582 bytes [emitted]
client: Entrypoint app 10.4 MiB = vendors-node_modules_pigeon-maps_lib_index_esm_js-node_modules_recharts_es6_cartesian_Cartesi-9014ff.js 7.06 MiB app.js 3.33 MiB
client: orphan modules 395 KiB [orphan] 161 modules
client: runtime modules 29.4 KiB 14 modules
client: modules by path ./node_modules/ 2.43 MiB 470 modules
client: modules by path ./src/Client/output/ 1.01 MiB
client:   modules by path ./src/Client/output/fable_modules/ 993 KiB 80 modules
client:   modules by path ./src/Client/output/*.js 31.9 KiB
client:     ./src/Client/output/App.js 10.5 KiB [built] [code generated]
client:     ./src/Client/output/Index.js 21.4 KiB [built] [code generated]
client:   ./src/Client/output/Shared/Shared.js 8 KiB [built] [code generated]
client: webpack 5.75.0 compiled successfully in 2497 ms
client: <e> [webpack-dev-server] [HPM] Error occurred while proxying request localhost:8080/api/IDojoApi/GetDistance to http://localhost:8085/ [ECONNREFUSED] (https://nodejs.org/api/errors.html#errors_common_system_errors)

Browser Console image

theprash commented 1 year ago

I can't reproduce this issue either. I've got no errors at all.

I'm sure I've had the WebSocket error at times when working on SAFE projects but it hasn't actually caused a problem.

mzvonar commented 1 year ago

I had the same problem on M1 Macbook with Node 18. For me the solution was:

obiwanjacobi commented 1 year ago

I'm on Node 18.15.0. I changed the localhost to IP address and that made it work. Thank you very much @mzvonar!