Django and Vue:我一直在加载资源:服务器的状态为500(内部服务器错误);在我的网站中

发布于 2025-01-31 22:54:32 字数 3194 浏览 0 评论 0原文

我正在使用Vue和Django进行此项目,但是当我运行代码时,我会遇到此错误,

"Failed to load resource: the server responded with a status of 500 (Internal Server Error)

127.0.0.1:8000/api/v1/products/winter/yellow-jacket-with-no-zipper:1"

我一直在重新加载,并等待30分钟才能消失,但是它一直出现。 我不知道我的JavaScript中是否有问题,因为运行VUE项目时没有任何错误。

这是我认为有问题的代码。

后端:

产品软件包中的urls.py模块:

from django.urls import path, include

from product import views

urlpatterns = [
  path('latest-products/', views.LatestProductsList.as_view()),
  path('products/<slug:category_slug>/<slug:product_slug>', views.ProductDetail.as_view()),
]

产品

<template>
  <div class="page-product">
    <div class="columns is-multiline">
      <div class="column is-9">
        <figure class="image mb-6">
          <img v-bind:src="product.get_image">
        </figure>

        <h1 class="title">{{ product.name }}</h1>

        <p>{{ product.description }}</p>
      </div>

      <div class="column is-3">
        <h2 class="subtitle">Information</h2>

        <p>Price: <strong>{{ product.price }}</strong></p>

        <div class="field has-addons mt-6">
          <div class="control">
            <input type="number" class="input" min="1" v-model="quantity">
          </div>

          <div class="control">
            <a class="button is-dark">Add to Carts</a>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import axios from 'axios'

export default {
  name: 'Product',
  data() {
    return {
      product: {},
      quantity: 1
    }
  },
  mounted() {
    this.getProduct()
  },
  methods: {
    getProduct() {
      const category_slug = this.$route.params.category_slug
      const product_slug = this.$route.params.product_slug

      axios
        .get(`/api/v1/products/${category_slug}/${product_slug}`)
        .then(response => {
          this.product = response.data
        })
        .catch(error => {
          console.log("error")
        })
    }
  }
}
</script>

前端

from django.http import Http404

from rest_framework.views import APIView
from rest_framework.response import Response

from .models import Product
from .serializers import ProductSerializer

class LatestProductsList(APIView):
  def get(self, request, format=None):
    products = Product.objects.all()[0:4]
    serializer = ProductSerializer(products, many=True)
    return Response(serializer.data)

#I think its this line of code
class ProductDetail(APIView):
  def get_object(self, category_slug, product_slug):
    try:
      return Product.objects.filter(category_slug=category_slug).get(slug=product_slug)
    except Product.DoesNotExist:
      raise Http404

  def get(self, request, category_slug, product_slug, format=None):
    product = self.get_object(category_slug, product_slug)
    serializer = ProductSerializer(product)
    return Response(serializer.data)

I'm doing this project using Vue and Django, but when I run my code, I keep getting this error

"Failed to load resource: the server responded with a status of 500 (Internal Server Error)

127.0.0.1:8000/api/v1/products/winter/yellow-jacket-with-no-zipper:1"

I kept reloading and waited 30 minutes for this error to go away, but it keeps appearing.
I don't know if there is a problem in my javascript, because I don't have any errors when I run the vue project.

Here's my code I think has the problem.

Back end:

urls.py module in product package:

from django.urls import path, include

from product import views

urlpatterns = [
  path('latest-products/', views.LatestProductsList.as_view()),
  path('products/<slug:category_slug>/<slug:product_slug>', views.ProductDetail.as_view()),
]

Front end:

Product.vue script:

<template>
  <div class="page-product">
    <div class="columns is-multiline">
      <div class="column is-9">
        <figure class="image mb-6">
          <img v-bind:src="product.get_image">
        </figure>

        <h1 class="title">{{ product.name }}</h1>

        <p>{{ product.description }}</p>
      </div>

      <div class="column is-3">
        <h2 class="subtitle">Information</h2>

        <p>Price: <strong>{{ product.price }}</strong></p>

        <div class="field has-addons mt-6">
          <div class="control">
            <input type="number" class="input" min="1" v-model="quantity">
          </div>

          <div class="control">
            <a class="button is-dark">Add to Carts</a>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import axios from 'axios'

export default {
  name: 'Product',
  data() {
    return {
      product: {},
      quantity: 1
    }
  },
  mounted() {
    this.getProduct()
  },
  methods: {
    getProduct() {
      const category_slug = this.$route.params.category_slug
      const product_slug = this.$route.params.product_slug

      axios
        .get(`/api/v1/products/${category_slug}/${product_slug}`)
        .then(response => {
          this.product = response.data
        })
        .catch(error => {
          console.log("error")
        })
    }
  }
}
</script>

Edit:

After some revision, I think the problem is caused by the views.py module in the product package

from django.http import Http404

from rest_framework.views import APIView
from rest_framework.response import Response

from .models import Product
from .serializers import ProductSerializer

class LatestProductsList(APIView):
  def get(self, request, format=None):
    products = Product.objects.all()[0:4]
    serializer = ProductSerializer(products, many=True)
    return Response(serializer.data)

#I think its this line of code
class ProductDetail(APIView):
  def get_object(self, category_slug, product_slug):
    try:
      return Product.objects.filter(category_slug=category_slug).get(slug=product_slug)
    except Product.DoesNotExist:
      raise Http404

  def get(self, request, category_slug, product_slug, format=None):
    product = self.get_object(category_slug, product_slug)
    serializer = ProductSerializer(product)
    return Response(serializer.data)

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

盗梦空间 2025-02-07 22:54:32

修订了我的代码后,我发现自己是对的。问题是产品包中的Views.py模块。可以在位于ProductDetail类中的get_object函数中看到。

原始:

 class ProductDetail(APIView):
  def get_object(self, category_slug, product_slug):
    try:
      return Product.objects.filter(category_slug=category_slug).get(slug=product_slug)
    except Product.DoesNotExist:
      raise Http404

问题是我需要在定义类别slug时添加另一个下划线/下划线(此件:_),因此

category_slug=category_slug 

成为

category__slug=category_slug

新版本:

class ProductDetail(APIView):
      def get_object(self, category_slug, product_slug):
        try:
          return Product.objects.filter(category__slug=category_slug).get(slug=product_slug)
        except Product.DoesNotExist:
          raise Http404

After revision of my code, I found out that I was right. The problem was the views.py module in the product package. It can be seen in the get_object function located in the ProductDetail class.

Original:

 class ProductDetail(APIView):
  def get_object(self, category_slug, product_slug):
    try:
      return Product.objects.filter(category_slug=category_slug).get(slug=product_slug)
    except Product.DoesNotExist:
      raise Http404

The problem was I needed to add another underscore/underline( this thing: _ ) when defining the category slug, so

category_slug=category_slug 

becomes

category__slug=category_slug

New version:

class ProductDetail(APIView):
      def get_object(self, category_slug, product_slug):
        try:
          return Product.objects.filter(category__slug=category_slug).get(slug=product_slug)
        except Product.DoesNotExist:
          raise Http404
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文