I am trying to make a get request in my js/svelte application. The REST-API works perfectly fine in the browser or when testing with postman.
When I click the Go button on the website then the following error ocours in the console from the inspection tool.
Uncaught TypeError: can't convert undefined to object
mergeConfig mergeConfig.js:92 request Axios.js:39 method Axios.js:129 wrap bind.js:9 login Login.svelte:11 listen index.mjs:412 listen_dev index.mjs:1961 mount bundle.js:3413 mount_component index.mjs:1745 update bundle.js:765 update bundle.js:931 update index.mjs:1075 flush index.mjs:1042 promise callback*schedule_update index.mjs:1000 make_dirty index.mjs:1777 ctx index.mjs:1815 unsubscribeLoc bundle.js:1442 subscribe index.mjs:50 instance$3 Router.svelte:493 init index.mjs:1809 Router bundle.js:1583 create_fragment bundle.js:3583 init index.mjs:1824 App bundle.js:3655 app main.js:3 bundle.js:3675
And this is the code.
<script>
import {replace} from 'svelte-spa-router'
import {LoginDto} from "../scripts/data_transfer_objects/LoginDto";
import axios from "axios";
let loginTemplate = new LoginDto();
function login(){
console.log(loginTemplate.password);
axios.get("http://localhost:5000/login", {
auth: {
username: "test",
password: "1234"
}
});
replace("#/activities");
}
</script>
<div>
<input type="password" placeholder="Password" bind:value={loginTemplate.password}>
<button on:click={login}>Go</button>
</div>
Does someone have a idea what the problem is?
Thanks in advance!
EDIT
I tryied it with a even simpler example.
<script>
import axios from "axios";
axios.get("localhost:5000/activities");
</script>
This does not work either. I prduces the same error as described above.
The problem may come from an outdated dependency on @rollup/plugin-commonjs. Upgrading from 17.0.0 to 21.0.1 solved it for me.
Try to log what the server return. You might know what happened.
axios.get("http://localhost:5000/login", {
auth: {
username: "test",
password: "1234"
}
}).then(response => console.log(response));