get user logged info and display in profile page

[signal pebble]

I’m struggling to implement this. I created a sign up and logged in with one of these users I then created a view to get the info. I checked the backend and this view contained the correct info. However in my UserProfile.Vue i am unable to retrieve the info

I am getting error fetching the profile: The string did not match the expected pattern

[real geyser]

You should copy paste the entire error and traceback. See #readme-1st for how to format code and errors.

[real geyser]

What line is causing this? SyntaxError: The string did not match the expected pattern.

[signal pebble]

I’m not sure because everything runs fine but In my console it says that. I don’t think I can send an image but I’ll try copy and paste my console more

[real geyser]

In that error it will link you to the code.

[signal pebble]

Ah ok I see I think

One sec

import UserProfile from './components/UserProfile.vue';

export default {
  components: {
    UserProfile,
  },
  data() {
    return {
      authenticated: false,
      user: null,
    };
  },
  mounted() {
    this.fetchUserProfile();
  },
  methods: {
    async fetchUserProfile() {
      try {
        const response = await fetch('/api/get_user_profile/');
        if (!response.ok) {
          throw new Error(`HTTP error! Status: ${response.status}`);
        }
        const data = await response.json();
        this.user = data;
        this.authenticated = true;
      } catch (error) {
        console.error('Error fetching user profile:', error);
      }
    },
  },
};
</script>```

This part more specifically

mounted() {
this.fetchUserProfile();
},

[real geyser]

Which part of that function?

[signal pebble]

Is there a way for me to send an image in this thread

[real geyser]

What is it an image of?

[signal pebble]

The console

[real geyser]

Copy and paste?

FYI: https://stackoverflow.com/questions/55681242/i-keep-getting-the-error-the-string-did-not-match-the-expected-pattern-for-my

[signal pebble]

I’m not sure which part

[signal pebble]

Ty I will read into this

My log shows that error just after this export default { components: { UserProfile, }, data() { return { authenticated: false, user: null, }; }, mounted() { this.fetchUserProfile(); },

[real geyser]

Check the response from the server in your network panel. It's not JSON

[signal pebble]

    async fetchUserProfile() {
      try {
        const response = await fetch('/api/get_user_profile/');
        if (!response.ok) {
          throw new Error(`HTTP error! Status: ${response.status}`);
        }
        const data = await response.json();
        this.user = data;
        this.authenticated = true;
      } catch (error) {
        console.error('Error fetching user profile:', error);
      }
    },
  },
};```

The line error fetching user profile : ‘, error is what I’m being linked to in the console

Though that’s just a a debug statement

My App.vue has a 304 not modified as the status in the network tab

[real geyser]

Welp a 304 is a redirect http response and won't have a body which means it wouldn't be convertable to JSON. That explains your error

[signal pebble]

Any idea how I could fix this it if there is an alternative method

[real geyser]

Why is /api/get_user_profile/ returning a 304?

[signal pebble]

That , UserProfile.vue , App.vue , bootstrap.min.css, main.js, client all have the 304 not modified

[signal pebble]

I’m not sure at all because in my backend when I run that in my :8000 local that path runs fine

And it displays they user information

It’s when I try to take that data and display it in my vue that I get a problem

[real geyser]

Oh. We're talking about different things. When your code runs await fetch('/api/get_user_profile/'), what is that corresponding request in your network panel of the developer tools?

[signal pebble]

In my network panel where exactly am I looking

Am I looking for a name

That has get_user_profile

I don’t see that

I have the columns name , domain , type , initiator , transfer size and time

I’m not sure where I’m looking

[real geyser]

Are you familiar with how that panel works?

[signal pebble]

I’m not sure to be honest but I’ve been debugging and added some more debug statements and you are correct api/get_user_profile is returning a html page instead of JSON data

[real geyser]

It might be worth researching a bit: https://www.youtube.com/watch?v=lhNIXaIv5vc
https://developer.chrome.com/docs/devtools/network

[signal pebble]

Appreciate it tim

And thank you for your time