This is the 7th day of my participation in Gwen Challenge

Why implement cross-domain CORS?

When the front and back ends are developed separately, if the front and back ends are not of the same origin (different protocols, domain names, and ports) and cannot be directly accessed, you need to use CORS to solve the problem. See Introduction to CORS (AJAX Cross-source Request Solution)

How does Django implement cross-domain CORS?

This can be done quickly with a simple setup using the django-cers-headers plugin. Django-coron-headers uses Djangos middleware to perform CERs-related processing before each request.

Django-coron-headers Specifies the flow for using Django-coron-headers

  1. Installing a plug-in
pip install django-cors-headers
Copy the code
  1. Add application
INSTALLED_APPS = (
    ...
    'corsheaders',...).Copy the code
  1. Adding Middleware
MIDDLEWARE = [
    ...,
    'corsheaders.middleware.CorsMiddleware'.'django.middleware.common.CommonMiddleware'. ,]# CorsMiddleware should be placed as early as possible, especially before any middleware that can generate responses
# DjangoCommonMiddleware, for example, will not be able to add CORS headers to these responses if not before then.
Copy the code
  1. Set up the

Add configuration information in setting.py

# Simplest configuration
All whitelisted domain names can access the backend interface
CORS_ALLOWED_ORIGINS = (
    '127.0.0.1:8080'.'localhost:8080'.'www.example.com:8080'.'api.example.com:8000'
)

# CORS_ALLOW_CREDENTIALS Specifies whether the back end supports cookie operations in cross-domain access.
CORS_ALLOW_CREDENTIALS = True  Cookies are allowed
Copy the code
# Configuration details

CORS_ALLOWED_ORIGINS, CORS_ALLOWED_ORIGIN_REGEXES, or CORS_ALLOW_ALL_ORIGINS

## List of sources from which access requests are made, default []
CORS_ALLOWED_ORIGINS  = [
     "https://example.com" ,
     "https://sub.example.com" ,
     "http://localhost:8080" ,
     "http://127.0.0.1:9000" 
]
## List of sources that make access requests using regular expression matching, default []
CORS_ALLOWED_ORIGIN_REGEXES  = [
     r"^https://\w+\.example\.com$",]## Whether to allow all sources. Default is False
### If True, all sources are allowed. Other Settings that limit permitted sources will be ignored
CORS_ALLOW_ALL_ORIGINS

# [Optional]

## Restrict the use of CORS for partial urls: Restrict the regular expression for urls that will send CORS headers.
### defaults to r'^.*$', which matches all urls. CORS is useful when only part of the site is required, such as/API /.
CORS_URLS_REGEX  =  r'^/api/.*$'

## List of HTTP verbs allowed for actual requests
CORS_ALLOW_METHODS  = [
     'DELETE' ,
     'GET' ,
     'OPTIONS' ,
     'PATCH' ,
     'POST' ,
     'PUT',]## List of nonstandard HTTP headers available
CORS_ALLOW_HEADERS  = [
     'accept' ,
     'accept-encoding' ,
     'authorization' ,
     'content-type' ,
     'dnt' ,
     'origin' ,
     'user-agent' ,
     'x-csrftoken' ,
     'x-requested-with',]## List of HTTP headers to expose to browsers. Default is []
CORS_EXPOSE_HEADERS = []

Non-simple request free precheck time: unit: second, default 86400 (one day); 0 will not be sent, that is, unavoidably precheck
CORS_PREFLIGHT_MAX_AGE = 86400

## Request contains Cookie: If True, cookies are allowed to be included in cross-site HTTP requests. The default is False.
CORS_ALLOW_CREDENTIALS = true

Copy the code