Изображения загружены в ведро AWS S3, но они не отображаются в приложении Django heroku

Я разместил свое приложение django на heroku и могу загружать медиафайлы из канала администратора сайта в AWS s3 bucket. Но эти медиафайлы не отображаются на сайте. вот мои файлы настроек

import os
import datetime
AWS_USERNAME = 'rahul'
AWS_GROUP_NAME = 'new_brdy_eng_group'
AWS_ACCESS_KEY_ID = os.environ.get("xxxxxxxxxx") 
AWS_SECRET_ACCESS_KEY = os.environ.get('xxxxxxxxxxx') 

AWS_PRELOAD_METADATA = True
AWS_QUERYSTRING_AUTH = False
AWS_S3_SIGNATURE_VERSION = "s3v4"
AWS_S3_REGION_NAME = 'ap-south-1'


DEFAULT_FILE_STORAGE = 'BE.aws.utils.MediaRootS3BotoStorage'
STATICFILES_STORAGE = 'BE.aws.utils.StaticRootS3BotoStorage'
AWS_STORAGE_BUCKET_NAME = 'brdy-engineers'
S3DIRECT_REGION = 'ap-south-1'
S3_URL = '//%s.s3.amazonaws.com/' % AWS_STORAGE_BUCKET_NAME
MEDIA_URL = '//%s.s3.amazonaws.com/media/' % AWS_STORAGE_BUCKET_NAME
MEDIA_ROOT = MEDIA_URL
STATIC_URL = S3_URL + 'static/'
ADMIN_MEDIA_PREFIX = STATIC_URL + 'admin/'

AWS_DEFAULT_ACL = None

Я изменил MEDIA_URL вот так

MEDIA_URL = '//%s.s3-ap-south-1.amazonaws.com/media/' % AWS_STORAGE_BUCKET_NAME
MEDIA_URL = 'https://brdy-engineers.s3.ap-south-1.amazonaws.com/media/'
MEDIA_URL = 'https://brdy-engineers.s3.ap-south-1.amazonaws.com/media/Homefiles/reviews/'

Но ничего из этого не сработало

файлutils.py

from storages.backends.s3boto3 import S3Boto3Storage

StaticRootS3BotoStorage = lambda: S3Boto3Storage(location='static')
MediaRootS3BotoStorage  = lambda: S3Boto3Storage(location='media')

Политика ведра

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "Allow All",
            "Effect": "Allow",
            "Principal": "*",
            "Action": [
                "s3:GetObject",
                "s3:PutObject",
                "s3:PutObjectAcl",
                "s3:*"
            ],
            "Resource": "arn:aws:s3:::brdy-engineers/*"
        }
    ]
}

Bucket CORS

[
    {
        "AllowedHeaders": [
            "Authorization"
        ],
        "AllowedMethods": [
            "GET"
        ],
        "AllowedOrigins": [
            "*"
        ],
        "ExposeHeaders": [
            "x-amz-server-side-encryption",
            "x-amz-request-id",
            "x-amz-id-2"
        ],
        "MaxAgeSeconds": 3000
    }
]

Блокировка ведра весь публичный доступ отключен

Я добавил текущего пользователя в групповую политику, которая

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Effect": "Allow",
            "Action": [
                "s3:ListAllMyBuckets"
            ],
            "Resource": "arn:aws:s3:::*"
        },
        {
            "Effect": "Allow",
            "Action": [
                "s3:ListBucket",
                "s3:GetBucketLocation",
                "s3:ListBucketMultipartUploads",
                "s3:ListBucketVersions"
            ],
            "Resource": "arn:aws:s3:::brdy-engineers"
        },
        {
            "Effect": "Allow",
            "Action": [
                "s3:*Object*",
                "s3:ListMultipartUploadParts",
                "s3:AbortMultipartUpload"
            ],
            "Resource": "arn:aws:s3:::brdy-engineers/*"
        }
    ]
}

В чем проблема, почему я не могу получить доступ к изображениям в приложении heroku?

Попробуйте эти настройки здесь и затем оптимизируйте их, как вам нужно:

enter image description here

enter image description here

enter image description here

enter image description here

enter image description here

enter image description here

У нас была похожая ошибка при настройке нашего.

Если я правильно помню, AWS_QUERYSTRING_AUTH = True решил эту проблему для нас. Поскольку мы хотели, чтобы некоторые файлы, для определенных моделей, были доступны только членам некоторой группы.

Попробуйте это. Вам не нужно менять статические или медиа url по умолчанию. Здесь я использую логику if AWS = True, потому что если вы захотите прекратить использование сервиса aws s3, вы просто измените значение == Flase, и все статическое и медиа содержимое будет обслуживаться с вашего hsoting сервера.

AWS = True

    if AWS:
            AWS_ACCESS_KEY_ID  = config('AWS_ACCESS_KEY_ID')
            AWS_SECRET_ACCESS_KEY = config('AWS_SECRET_ACCESS_KEY')
            AWS_STORAGE_BUCKET_NAME = config('AWS_STORAGE_BUCKET_NAME')
            AWS_S3_CUSTOM_DOMAIN = config('AWS_S3_CUSTOM_DOMAIN')
            AWS_S3_OBJECT_PARAMETERS = config('AWS_S3_OBJECT_PARAMETERS')
            AWS_DEFAULT_ACL = config('AWS_DEFAULT_ACL')
            AWS_S3_FILE_OVERWRITE = config('AWS_S3_FILE_OVERWRITE')
            AWS_QUERYSTRING_AUTH = config('AWS_QUERYSTRING_AUTH')
            DEFAULT_FILE_STORAGE = config('DEFAULT_FILE_STORAGE')
            AWS_LOCATION = 'static'
            STATIC_URL = 'https://%s/%s/' % (AWS_S3_CUSTOM_DOMAIN, AWS_LOCATION)
            STATICFILES_STORAGE = config('STATICFILES_STORAGE')
     else:
          STATIC_URL = '/static/'


STATICFILES_DIRS = [
    BASE_DIR / "static",
    
]
MEDIA_URL = '/media/'



MEDIA_ROOT = '' #add path of your hosting folder where static  file located 

STATIC_ROOT = '' #add path of your hosting folder where media  file located 

в вашем корне urls.py

urlpatterns = [
    path('admin/', admin.site.urls)     
]

urlpatterns +=  static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
urlpatterns +=  static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

Также вам необходимо добавить следующие разрешения на aws s3 bucket:

снимите галочки с Блокировать публичный доступ (настройки ведра)

enter image description here

Блокировка публичного доступа должна быть отключена enter image description here

добавьте политику ведра

{
    "Version": "****", put your own 
    "Id": "******", put your own 
    "Statement": [
        {
            "Sid": "",
            "Effect": "Allow",
            "Principal": "*",
            "Action": [
                "s3:DeleteObject",
                "s3:GetObject",
                "s3:PutObject"
            ],
            "Resource": "arn:aws:s3::: your bucket name/*"
        }
    ]
}

вам необходимо включить ACLs. enter image description here

Затем добавьте список и разрешение на запись для всех из Списка контроля доступа (ACL). enter image description here

добавить Cross-origin resource sharing (CORS)

[
    {
        "AllowedHeaders": [
            "*"
        ],
        "AllowedMethods": [
            "GET",
            "POST",
            "PUT"
        ],
        "AllowedOrigins": [
            "*"
        ],
        "ExposeHeaders": []
    }
]
Вернуться на верх