Django 如何从 javascript 向数据库添加数据

Question

我在 django 中创建了一个页面，在这个页面上我创建了一个调用 JavaScript 函数的按钮，该函数反过来从 API 获取数据。 这部分代码按预期工作，因为它将响应数据写入控制台。 但是，我似乎无法将该数据插入到我在 django 中创建的模型中。

我不确定 python/javascript/models 是如何将所有链接在一起的。

模型.py

from django.db import models


class Set(models.Model):
    scry_id = models.CharField(max_length=255)
    code = models.CharField(max_length=255)
    name = models.CharField(max_length=255)
    set_type = models.CharField(max_length=255)
    release_date = models.DateField()
    card_count = models.IntegerField()
    block_code = models.CharField(max_length=255, null=True)
    block_name = models.CharField(max_length=255, null=True)
    parent_set_code = models.CharField(max_length=255, null=True)
    digital_only = models.BooleanField(default=False)
    foil_only = models.BooleanField(default=False)
    nonfoil_only = models.BooleanField(default=False)
    icon = models.CharField(max_length=255)
    status = models.BooleanField(default=False)

    def __str__(self):
        return self.name

集.html

{% extends "main/index.html "%}

{% block content %}
  <div class="background card">
    <div class="card-body">
      <button class="btn" id="setRefresh" style="border: 1px solid" onclick="setRefresh()"><i class="fas fa-sync"></i></button>

    </div>
  </div>
{% endblock%}

自定义.js

function setRefresh() {
  const Url="https://api.scryfall.com/sets";
  fetch(Url)
    .then(res => res.json())
    .then(data => obj = data.data)
    .then(() => obj.sort(function(a,b){return a.released_at.localeCompare(b.released_at);}))
    .then(() => {
      for (var i = 0; i < obj.length; i++) {
        //console.log(obj[i].name);
      }
    })
}

查看.py

def sets(request):
    return render(request,
                  "main/sets.html",
                  {"Sets": Set.objects.all})

Answer 1

有两种方法可以做到

1. 方法 1：检索数据后，将它们发送到您的 django 应用程序，而不是将它们登录到控制台。 有一个 django 视图来处理来自包含数据的 js 代码的相应请求，然后将它们添加到数据库中。 换句话说，您应该再次获取，但这次使用 post 请求到您的 django 应用程序。

.您的视图应如下所示：

    from .models import Set
    from django.http import HttpResponse
    import json
    
    def save(request):
        data=json.loads(request.body)
        for entry in data:
            s = Set()
            s.scry_id=entry["scry_id"]
            #in the next lines you map entry fields to Set fields



            s.save()
         return HttpResponse("ok")

2. 方法 2：您的按钮在单击时调用您的 django 应用程序，然后您的 django 应用程序从https://api.scryfall.com/sets自身检索数据，然后将它们保存到数据库中。 你的代码应该是这样的

   from .models import Set from django.http import HttpResponse import json import requests def save(request): response = requests.request("GET", "https://api.scryfall.com/sets") data=response.json() for entry in data: s = Set() s.scry_id=entry["scry_id"] #in the next lines you map entry fields to Set fields s.save() return HttpResponse("ok")

当然，无论哪种情况，都不要忘记将您的 urlconf 映射到保存视图

Answer 2

有两个缺失的部分。 首先，您需要有一个url来监听更改，然后您需要有一个view函数，您可以在其中设置数据。 并且您需要对代码的JS部分进行一些更改。下面的示例可以解决这一问题，并且它也可以正常工作：

views.py

@ajax_required
def views_name(request):
    try:
        if request.method == 'POST':
            post_id = request.POST.get('post')
            YourModel.objects.create(id=post_id)
    except Exception:   # pragma: no cover
        return HttpResponseBadRequest()

urls.py

urlpatterns = [
    url(r'^whatever/$', views.views_name, name='whatever'),
]

custom.js:

$(function () {
    $(".class-name").click(function () {
        var csrf = $(this).attr('csrf');
        var post = $(this).attr('page-id');
        $.ajax({
            url: '/whatever/',
            data: {
                'post': post,
                'csrfmiddlewaretoken': csrf
                },
            type: 'post',
            cache: false,
            success: function (returned_values) {
                // do whatever you want after success!                
                },
        });
    });
})