[英]DJANGO Templates dont share static files
I have a currently have a problem.我有一个目前有问题。 I got two django templates:
cart.html
and index.html
.我有两个 django 模板:
cart.html
和index.html
。 In the cart.html
there is a javascript file linked.在
cart.html
中有一个 javascript 文件链接。 Both of these files should acces the static files in the static
folder.这两个文件都应该访问 static 文件夹中的
static
文件。 The problem now is that, when I try to acces the static files from the linked cart.html
javascript file it gives me this error: [15/Aug/2022 20:14:40] "GET /cart/images/fruits/Kornknacker.jpg HTTP/1.1" 404 2419 These are my settings: STATIC_URL = 'static/' The problem now is that, when I try to acces the static files from the linked
cart.html
javascript file it gives me this error: [15/Aug/2022 20:14:40] "GET /cart/images/fruits/Kornknacker .jpg HTTP/1.1" 404 2419这些是我的设置:STATIC_URL = 'static/'
STATICFILES_DIRS = (os.path.join(BASE_DIR, 'static'),) STATICFILES_DIRS = (os.path.join(BASE_DIR, 'static'),)
Here is the project structure: Project这是项目结构:项目
Here is the javascript file:这是 javascript 文件:
{% load static %}
function loadCart() {
let productsSection = document.getElementById("products_section");
productsSection.innerHTML = '';
let productHTML = '';
let totalPrice = 0;
let cartItems = JSON.parse(localStorage.getItem('cart'));
if (cartItems && cartItems.length > 0) {
for (let item of cartItems) {
totalPrice = totalPrice + (item.quantity * item.price);
productHTML = productHTML + `
<div class="product-card" data-name="${item.itemName}" data-price="${item.price}" data-id="${item.itemId}">
<div>
<img src="{%static '/images/fruits/${item.itemName}.jpg'%}" alt="FRUIT" width="180">
</div>
<h3>
${item.itemName}
</h3>
<div>
Anzahl: ${item.quantity}
</div>
<div>
Preis: ${item.quantity * item.price}€
</div>
</div>
`;
}
document.getElementById("total_price_container").style.display = 'block';
document.getElementById("total_price").innerHTML = totalPrice;
document.getElementById("no-products_section").style.display = 'none';
document.getElementById("checkout-section").style.display = 'flex';
document.getElementById("order-process_section").style.display = 'none';
productsSection.innerHTML = productHTML;
}
else {
document.getElementById("no-products_section").style.display = 'block';
document.getElementById("checkout-section").style.display = 'none';
document.getElementById("total_price_container").style.display = 'none';
}
};
loadCart();
document.getElementById('checkout_cart').addEventListener('click', function () {
console.log(localStorage);
localStorage.removeItem('cart');
document.getElementById("products_section").innerHTML = '';
document.getElementById("order-process_section").style.display = 'block';
document.getElementById("checkout-section").style.display = 'none';
})
document.getElementById('clear_cart').addEventListener('click', function () {
localStorage.removeItem('cart');
loadCart();
})
Here is the project structure: Project这是项目结构:项目
""" Django settings for SemmelBrothers project. """ SemmelBrothers 项目的 Django 设置。
Generated by 'django-admin startproject' using Django 4.1.由“django-admin startproject”使用 Django 4.1 生成。
For more information on this file, see https://docs.djangoproject.com/en/4.1/topics/settings/有关此文件的更多信息,请参阅https://docs.djangoproject.com/en/4.1/topics/settings/
For the full list of settings and their values, see https://docs.djangoproject.com/en/4.1/ref/settings/ """有关设置及其值的完整列表,请参阅https://docs.djangoproject.com/en/4.1/ref/settings/ """
from pathlib import Path
import os
# Build paths inside the project like this: BASE_DIR / 'subdir'.
BASE_DIR = Path(__file__).resolve().parent.parent
# Quick-start development settings - unsuitable for production
# See https://docs.djangoproject.com/en/4.1/howto/deployment/checklist/
# SECURITY WARNING: keep the secret key used in production secret!
SECRET_KEY = 'django-insecure-8m8i&272_!1*)94x$fgvqjd_is%!l1loejjzqexxi^4a(ebm)+'
# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = True
ALLOWED_HOSTS = []
# Application definition
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
]
MIDDLEWARE = [
'django.middleware.security.SecurityMiddleware',
'django.contrib.sessions.middleware.SessionMiddleware',
'django.middleware.common.CommonMiddleware',
'django.middleware.csrf.CsrfViewMiddleware',
'django.contrib.auth.middleware.AuthenticationMiddleware',
'django.contrib.messages.middleware.MessageMiddleware',
'django.middleware.clickjacking.XFrameOptionsMiddleware',
]
ROOT_URLCONF = 'SemmelBrothers.urls'
TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [BASE_DIR, 'template'],
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',
],
},
},
]
WSGI_APPLICATION = 'SemmelBrothers.wsgi.application'
# Database
# https://docs.djangoproject.com/en/4.1/ref/settings/#databases
DATABASES = {
'default': {
'ENGINE': 'django.db.backends.sqlite3',
'NAME': BASE_DIR / 'db.sqlite3',
}
}
# Password validation
# https://docs.djangoproject.com/en/4.1/ref/settings/#auth-password-validators
AUTH_PASSWORD_VALIDATORS = [
{
'NAME': 'django.contrib.auth.password_validation.UserAttributeSimilarityValidator',
},
{
'NAME': 'django.contrib.auth.password_validation.MinimumLengthValidator',
},
{
'NAME': 'django.contrib.auth.password_validation.CommonPasswordValidator',
},
{
'NAME': 'django.contrib.auth.password_validation.NumericPasswordValidator',
},
]
# Internationalization
# https://docs.djangoproject.com/en/4.1/topics/i18n/
LANGUAGE_CODE = 'en-us'
TIME_ZONE = 'UTC'
USE_I18N = True
USE_TZ = True
# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/4.1/howto/static-files/
STATIC_URL = 'static/'
STATICFILES_DIRS = (os.path.join(BASE_DIR, 'static'),)
# Default primary key field type
# https://docs.djangoproject.com/en/4.1/ref/settings/#default-auto-field
DEFAULT_AUTO_FIELD = 'django.db.models.BigAutoField' ```
the problem is that django can't didn't find (404) "Kornknacker.jpg" in问题是 django 找不到(404)“Kornknacker.jpg”
"static/cart/images/fruits/Kornknacker.jpg"
But you should probably point it to但你可能应该指出它
"static/images/fruits/Kornknacker.jpg"
if that's the case try Im not sure if it will actually work :如果是这种情况,请尝试我不确定它是否真的有效:
<img src="{%static '/../images/fruits/${item.itemName}.jpg'%}" alt="FRUIT" width="180">
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.