Kaip rodyti vartotojo profilius ir įrašus iš Python API naudojant „JavaScript Fetch“.

„Python“ ir „JavaScript“ naudotojų profilių ir įrašų dinaminiam duomenų gavimui

Pagrindinė šio metodo idėja yra dinamiškai įkelti vartotojų profilius ir įrašus integruojant JavaScript sąsają su Python API vidiniu įrenginiu. Šis metodas naudoja „Django“ sistemą, skirtą „Python“ užpakalinėje programoje ir standartinį „JavaScript“.

// JavaScript Code to Fetch and Display Profile and Posts
function load_profile(author_id) {
    // Fetch profile and posts from the backend
    fetch(`/profile/${author_id}`)
        .then(response => response.json())
        .then(response => {
            // Create a profile section
            const content_profile = document.createElement('div');
            content_profile.className = "content_profile";
            const user = document.createElement('h3');
            user.innerHTML = response.prof.user;
            const followers = document.createElement('p');
            followers.innerHTML = `Followers: ${response.prof.followers}`;
            const following = document.createElement('p');
            following.innerHTML = `Following: ${response.prof.following}`;
            const followButton = document.createElement('button');
            followButton.className = "btn btn-primary";
            followButton.innerHTML = "Follow";
            content_profile.append(user, followers, following, followButton);
            document.querySelector('#profile').append(content_profile);

            // Display posts
            response.posts.forEach(post => {
                const postList = document.createElement('ul');
                const authorInfo = document.createElement('li');
                authorInfo.innerHTML = `${post.author} at ${post.timestamp} says:`;
                const content = document.createElement('li');
                content.innerHTML = post.content;
                const likes = document.createElement('li');
                likes.innerHTML = `${post.like} Likes`;
                postList.append(authorInfo, content, likes);
                document.querySelector('#postbox').append(postList);
            });
        })
        .catch(error => console.error('Error loading profile:', error));
}

„Python Django“ API rodinys, skirtas profiliui teikti ir duomenims skelbti

Lentelės „Profilis“ ir „Įrašai“ yra dvi susijusios lentelės, iš kurių šis Python Django rodinys nuskaito duomenis ir grąžina jį kaip JSON, kad būtų galima naudoti vartotojo sąsają.

from django.http import JsonResponse
from .models import Profile, Post
def profile_view(request, author_id):
    try:
        # Fetch profile and posts data
        profile = Profile.objects.get(user_id=author_id)
        posts = Post.objects.filter(author_id=author_id).values()
        # Prepare the JSON response
        return JsonResponse({
            'prof': {
                'user': profile.user.username,
                'followers': profile.followers.count(),
                'following': profile.following.count()
            },
            'posts': list(posts)
        })
    except Profile.DoesNotExist:
        return JsonResponse({'error': 'Profile not found'}, status=404)

„Python Django View“ vieneto testas

Siekiant užtikrinti, kad duomenys būtų tinkamai aptarnaujami, šis vieneto testas patikrina, ar „Django“ API teisingai gauna vartotojo profilį ir įrašus.

from django.test import TestCase
from .models import Profile, Post
class ProfileViewTest(TestCase):
    def setUp(self):
        # Create test data
        user = User.objects.create(username='testuser')
        profile = Profile.objects.create(user=user)
        Post.objects.create(author=user, content='Test post')

    def test_profile_view(self):
        # Make request to the API
        response = self.client.get('/profile/testuser')
        self.assertEqual(response.status_code, 200)
        data = response.json()
        # Check if profile data is correct
        self.assertEqual(data['prof']['user'], 'testuser')
        self.assertEqual(len(data['posts']), 1)
}

Dažni klausimai apie JSON duomenų tvarkymą naudojant „JavaScript“ ir „Python“.

1. Kas daro fetch() geriau nei kiti AJAX metodai?
2. fetch() siūlo šiuolaikišką, paprastą API HTTP užklausoms pateikti; pažadai naudojami asinchroninėms užduotims valdyti, todėl nereikia sudėtingų atgalinio ryšio mechanizmų.
3. Kodėl yra response.json() naudojamas gaunant informaciją iš API?
4. Norint paversti neapdorotą HTTP atsakymą į JSON objektą, kuris yra lengvai manipuliuojamas ir rodomas naudojant JavaScript, reikia atlikti 2 veiksmą.
5. Kaip veikia forEach padėti rodyti duomenis JavaScript?
6. forEach yra metodas, leidžiantis pereiti per masyvus, pvz., įrašų sąrašą, ir dinamiškai pridėti HTML elementus prie kiekvieno elemento.
7. Koks yra vaidmuo JsonResponse Django API?
8. Django įrankis vadinamas JsonResponse konvertuoja duomenis į JSON, kad sąsaja galėtų juos lengvai valdyti ir rodyti naudodama „JavaScript“.
9. Kaip galima išvengti „JavaScript“ saugos trūkumų naudojant innerHTML?
10. Norint apsisaugoti nuo XSS atakų, geriau naudoti JavaScript textContent arba 10 metodus, o ne suleisti potencialiai žalingą kodą.

Paskutinės mintys apie vartotojo duomenų gavimą ir rodymą

Dinaminėms svetainėms, integruojant JavaScript naudojant „Python“ užpakalinę programą duomenims nuskaityti ir rodyti yra veiksminga strategija. Visiškas puslapio įkėlimas iš naujo nėra būtinas norint garantuoti, kad vartotojo sąsaja atnaujinama efektyviai, kai naudojami tokie metodai atnešti Naudojami JSON atsakymai. Dėl to pagerėja bendra vartotojo patirtis.

Kuriant tokias programas reikia atsižvelgti į klaidų valdymą, saugumą ir optimizavimą. Programa bus atsparesnė, jei bus tvarkomi neišsamūs atsakymai ir bus užtikrinta duomenų valymas. Šis metodas suteikia tvirtą pagrindą ateityje į savo projektą įtraukti sudėtingesnių funkcijų.