Я хочу получить свои данные из остальных API по ajax на домашней странице. Но ajax вызов не работает. Я не получаю никаких данных. просмотр сериализаторов API моего блога:
from rest_framework import serializers
from accounts.api.serializers import UserDisplaySerializer
from blog.models import post
class postModelSerializer(serializers.ModelSerializer):
author = UserDisplaySerializer()
class Meta:
model = post
fields = [
'author',
'content'
]
URL-адреса API моего блога:
from django.urls import path, re_path
from .views import postListAPIView
from . import views
urlpatterns = [
path('', postListAPIView.as_view(), name='blog-home'), #api/blog
URL-адреса mysite api для блога:
from django.contrib import admin
from django.contrib.auth import views as auth_views
from django.urls import path, include
from users import views as user_views
from blog import views
from django.conf import settings
from django.conf.urls.static import static
urlpatterns = [
path('', include('blog.urls')),
path('api/', include('blog.api.urls')),
]
мой главный дом. html шаблон:
{% extends "blog/base.html" %}
<style>
#post-container{
}
</style>
{% block script %}
<script type="text/javascript">
$(document).ready(function(){
console.log("working")
$.ajax({
url: "/api/",
method: "GET",
sucess: function(data){
console.log(data)
},
error: function(data){
console.log("error")
console.log(data)
}
})
});
</script>
{% endblock script %}
{% block content %}
<div id='post-container'>
</div>
<article class="content-section">
<div class="post-bar">
<a href="" class="mdl-button mdl-js-button mdl-button--fab">
<i class="material-icons">add</i>
</a>
<p class="text">Tab the button for write a post</p>
</div>
<div class="post-icons">
<a href="" class="material-icons-outlined md-48">burst_mode</a>
<a href="" class="material-icons-outlined md-48 video">video_call</a>
<a href="" class="material-icons-outlined md-48 audio">music_note</a>
<a href="" class="material-icons-outlined md-48 audio">gif</a>
</div>
</article>
{% for post in posts %}
<article class="content-section">
<div class="article-metadata">
<div class="img">
<img class="article-img rounded-circle" src="{{ post.author.profile.image.url }}">
</div>
<div class="profile-info">
<a class="h2" href="">{{ post.author }}</a>
<div class="text-muted">{{ post.date_posted }}</div>
</div>
<div class="options">
<button id="demo-menu-lower-right" class="mdl-button mdl-js-button mdl-button--icon mdl-js-ripple-effect">
<i class="material-icons">more_vert</i>
</button>
<ul class="mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect"
for="demo-menu-lower-right">
{% if post.author == user %}
<a href="{% url 'post-update' pk=post.pk %}">
<li class="mdl-menu__item">update</li>
</a>
<a href="{% url 'post-delete' pk=post.pk %}">
<li class="mdl-menu__item">delete</li>
</a>
{% endif %}
</ul>
</div>
</div>
{% endfor %}
{% endblock content %}
данные API: 
база html:
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<script defer src="https://code.getmdl.io/1.3.0/material.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js" type="text/javascript"></script>
{% block script %}{% endblock script %}
<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/jquery-ui.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('.reply-btn').click(function() {
$(this).parent().parent().next('.replied-comments').fadeToggle()
});
});
$(document).on('click', '#like', function(event){
event.preventDefault();
var pk = $(this).attr('value');
$.ajax({
type: 'POST',
url: '{% url "like_post" %}',
data: {'id':pk, 'csrfmiddlewaretoken': '{{ csrf_token }}'},
dataType: 'json',
success: function(response){
$('#like-section').html(response['form'])
console.log($('#like-section').html(response['form']));
},
error: function(rs, e){
console.log(rs.responseText);
},
});
});
$(document).on('submit', '.comment-form', function(event){
event.preventDefault();
console.log($(this).serialize());
$.ajax({
type: 'POST',
url: $(this).attr('action'),
cache: false,
data: $(this).serialize(),
dataType: 'Json',
success: function(response) {
$('.main-comment-section').html(response['form']);
$('textarea').val('');
$('.reply-btn').click(function() {
$(this).parent().parent().next('.replied-comments').fadeToggle()
$('textarea').val('');
});
},
error: function(rs, e) {
console.log(rs.responseText)
},
});
});
$(document).on('submit', '.reply-form', function(event){
event.preventDefault();
console.log($(this).serialize());
$.ajax({
type: 'POST',
url: $(this).attr('action'),
cache: false,
data: $(this).serialize(),
dataType: 'Json',
success: function(response) {
$('.main-comment-section').html(response['form']);
$('textarea').val('');
$('.reply-btn').click(function() {
$(this).parent().parent().next('.replied-comments').fadeToggle()
$('textarea').val('');
});
},
error: function(rs, e) {
console.log(rs.responseText)
},
});
});
</script>
Я хочу получить данные как объект, но он не показывает данные в объектах ... если он показывает, что я могу заменить содержимое и пользователей через forl oop.
, и консоль выглядит следующим образом : 