Internal Server Error when using useFrappeGetDocList

[bryanreyeslanexcorp]

At first it works fine, however after a few testing it produces Internal Server Error. I tried to create from scratch however it is no longer working.

Sample Code usage:

  const {data, isLoading, error} = useFrappeGetDocList<IRandomPeople>('Random People');
  console.log({data, isLoading, error})

common_site_config.json

{
 "allow_cors": "*",
 "background_workers": 1,
 "db_port": 3808,
 "default_site": "sampleproject.test",
 "developer_mode": 1,
 "file_watcher_port": 6788,
 "frappe_types_pause_generation": 0,
 "frappe_user": "sampleproj",
 "gunicorn_workers": 25,
 "ignore_csrf": 1,
 "live_reload": true,
 "rebase_on_pull": false,
 "redis_cache": "redis://localhost:13001",
 "redis_queue": "redis://localhost:11001",
 "redis_socketio": "redis://localhost:13001",
 "restart_supervisor_on_update": false,
 "restart_systemd_on_update": false,
 "serve_default_site": true,
 "shallow_clone": true,
 "socketio_port": 9001,
 "use_redis_auth": false,
 "webserver_port": 8001
}

[nikkothari22]

Hi @bryanreyeslanexcorp

Can you share what the Internal Server Error is? You'll need to provide the error message obtained in the bench console. This does not seem to be an issue with the library. Can you also share the parameters you have passed to FrappeProvider?

Thanks.

[bryanreyeslanexcorp]

Hello @nikkothari22 Thanks for prompt response. I think I just resolved this issue by adding a value on url. I just followed on what you did in your live session with BuildWithHussain. It works for the first time but for some reason, it wasn't. So I tried to add the a value on url and now it works.

    <FrappeProvider socketPort={import.meta.env.VITE_PORT ?? ''} url='http://localhost:8001'>
      <BrowserRouter basename={import.meta.env.VITE_BASE_PATH}>
        <Routes>
          <Route path='/' element={<RandomPeople />} />
        </Routes>
      </BrowserRouter>
    </FrappeProvider>

Just a question, Is it possible just to have a react alone and not under on the bench-app structure?

[sourabhmandal]

Hi, I faced the same issue today but with different mistakes in the program. Thought to share since, it can help others

here is my main.tsx file. applied the above solution unfortunately, It didn't work for me

ReactDOM.createRoot(document.getElementById("root")!).render(
  <React.StrictMode>
    <FrappeProvider socketPort={import.meta.env.VITE_SOCKET_PORT ?? ""}>
      <BrowserRouter basename={import.meta.env.VITE_BASE_PATH}>
        <Routes>
          <Route path="/" element={<App />} />
        </Routes>
      </BrowserRouter>
    </FrappeProvider>
  </React.StrictMode>
);

Assuming common_site_config.json is having "allow_cors": "*" and "ignore_csrf": 1 as mentioned above.The following checks will help -

• check the console tab of browser for any errors generated by the library
• run the following bench command in bench folder

  bench use <site-name-without-port-number>

• check code generated by doppio Usually, for me 500 errors occur when I changed target value in proxy settings If you used doppio, check the proxyOptions.js file is in the following format

  
  const common_site_config = require('../../../sites/common_site_config.json');
  const { webserver_port } = common_site_config;

export default { '^/(app|api|assets|files|private)': { target: http://localhost:${webserver_port}, ws: true, router: function (req) { const site_name = req.headers.host.split(':')[0]; return http://${site_name}:${webserver_port}; } }, };

Finally, running `bench use <site-name-without-port-number>` did the trick

[nikkothari22]

Just a question, Is it possible just to have a react alone and not under on the bench-app structure?

Yeah, it's possible to do that. You would need to pass the URL for it to work.

If your domains (React app and frappe backend) are going to be different, then cookie based authentication won't work since SameSite is set to Lax/Strict in Frappe. In that case, you would need to use Token based auth (which the SDK supports).