Estos contenidos se han traducido de forma automática para su comodidad, pero Huawei Cloud no garantiza la exactitud de estos. Para consultar los contenidos originales, acceda a la versión en inglés.
Cómputo
Elastic Cloud Server
Bare Metal Server
Auto Scaling
Image Management Service
Dedicated Host
FunctionGraph
Cloud Phone Host
Huawei Cloud EulerOS
Redes
Virtual Private Cloud
Elastic IP
Elastic Load Balance
NAT Gateway
Direct Connect
Virtual Private Network
VPC Endpoint
Cloud Connect
Enterprise Router
Enterprise Switch
Global Accelerator
Gestión y gobernanza
Cloud Eye
Identity and Access Management
Cloud Trace Service
Resource Formation Service
Tag Management Service
Log Tank Service
Config
Resource Access Manager
Simple Message Notification
Application Performance Management
Application Operations Management
Organizations
Optimization Advisor
Cloud Operations Center
Resource Governance Center
Migración
Server Migration Service
Object Storage Migration Service
Cloud Data Migration
Migration Center
Cloud Ecosystem
KooGallery
Partner Center
User Support
My Account
Billing Center
Cost Center
Resource Center
Enterprise Management
Service Tickets
HUAWEI CLOUD (International) FAQs
ICP Filing
Support Plans
My Credentials
Customer Operation Capabilities
Partner Support Plans
Professional Services
Análisis
MapReduce Service
Data Lake Insight
CloudTable Service
Cloud Search Service
Data Lake Visualization
Data Ingestion Service
GaussDB(DWS)
DataArts Studio
IoT
IoT Device Access
Otros
Product Pricing Details
System Permissions
Console Quick Start
Common FAQs
Instructions for Associating with a HUAWEI CLOUD Partner
Message Center
Seguridad y cumplimiento
Security Technologies and Applications
Web Application Firewall
Host Security Service
Cloud Firewall
SecMaster
Data Encryption Workshop
Database Security Service
Cloud Bastion Host
Data Security Center
Cloud Certificate Manager
Situation Awareness
Managed Threat Detection
Blockchain
Blockchain Service
Servicios multimedia
Media Processing Center
Video On Demand
Live
SparkRTC
Almacenamiento
Object Storage Service
Elastic Volume Service
Cloud Backup and Recovery
Storage Disaster Recovery Service
Scalable File Service
Volume Backup Service
Cloud Server Backup Service
Data Express Service
Dedicated Distributed Storage Service
Contenedores
Cloud Container Engine
SoftWare Repository for Container
Application Service Mesh
Ubiquitous Cloud Native Service
Cloud Container Instance
Bases de datos
Relational Database Service
Document Database Service
Data Admin Service
Data Replication Service
GeminiDB
GaussDB
Distributed Database Middleware
Database and Application Migration UGO
TaurusDB
Middleware
Distributed Cache Service
API Gateway
Distributed Message Service for Kafka
Distributed Message Service for RabbitMQ
Distributed Message Service for RocketMQ
Cloud Service Engine
EventGrid
Dedicated Cloud
Dedicated Computing Cluster
Aplicaciones empresariales
ROMA Connect
Message & SMS
Domain Name Service
Edge Data Center Management
Meeting
AI
Face Recognition Service
Graph Engine Service
Content Moderation
Image Recognition
Data Lake Factory
Optical Character Recognition
ModelArts
ImageSearch
Conversational Bot Service
Speech Interaction Service
Huawei HiLens
Developer Tools
SDK Developer Guide
API Request Signing Guide
Terraform
Koo Command Line Interface
Distribución de contenido y cómputo de borde
Content Delivery Network
Intelligent EdgeFabric
CloudPond
Soluciones
SAP Cloud
High Performance Computing
Servicios para desarrolladores
ServiceStage
CodeArts
CodeArts PerfTest
CodeArts Req
CodeArts Pipeline
CodeArts Build
CodeArts Deploy
CodeArts Artifact
CodeArts TestPlan
CodeArts Check
Cloud Application Engine
aPaaS MacroVerse
KooPhone
KooDrive

CORS

Actualización más reciente 2023-11-30 GMT+08:00

¿Qué es el CORS?

Por razones de seguridad, los navegadores restringen las solicitudes de origen cruzado iniciadas desde scripts. Esto significa que una aplicación web solo puede solicitar recursos desde su origen. El mecanismo CORS permite a los navegadores enviar XMLHttpRequest a servidores en otros dominios y solicitar acceso a los recursos allí.

Figura 1 Flujo de proceso del mecanismo CORS

Hay dos tipos de solicitudes CORS:

  • Simple requests
    Las solicitudes simples deben cumplir las siguientes condiciones:
    1. El método de solicitud es HEAD, GET o POST.
    2. El encabezado de solicitud contiene solo los siguientes campos:
      • Accept
      • Accept-Language
      • Content-Language
      • Last-Event-ID
      • Content-Type (application/x-www-form-urlencoded, multipart/form-data, or text/plain)

    En el encabezado de una solicitud simple, los navegadores agregan automáticamente el campo Origin para especificar el origen (incluidos el protocolo, el dominio y el puerto) de la solicitud. Después de recibir tal solicitud, el servidor de destino determina si la solicitud es segura y puede aceptarse basándose en el origen. Si el servidor envía una respuesta que contiene el campo Access-Control-Allow-Origin, el servidor acepta la solicitud.

  • Not-so-simple requests

    Las solicitudes que no cumplen las condiciones para solicitudes simples son solicitudes no tan simples.

    Antes de enviar una solicitud no tan simple, los navegadores envían una solicitud de comprobación previa HTTP al servidor de destino para confirmar si el origen desde el que se carga la página web está en la lista de origen permitido, y para confirmar qué métodos de solicitud HTTP y campos de encabezado se pueden usar. Si la solicitud de comprobación previa se realiza correctamente, los navegadores envían solicitudes simples al servidor.

Configuración de CORS

CORS está deshabilitado por defecto. Para habilitar CORS para una API, realice las operaciones descritas en esta sección. Para personalizar los encabezados de solicitud, los métodos de solicitud y los orígenes permitidos para el acceso entre dominios, cree un plug-in CORS.

  • Simple CORS requests

    Al crear una API, habilite CORS en la página de configuración de solicitud de API. Para obtener más información, consulte Solicitud simple.

    Figura 2 CORS
  • Not-so-simple CORS requests
    AVISO:

    Si tu API recibirá solicitudes no tan sencillas, cree otra API a la que se accederá mediante el método OPTIONS en el mismo grupo que la API de destino para recibir solicitudes de comprobación previa.

    Siga este procedimiento para definir la API de solicitud de comprobación previa. Para obtener más información, consulte Not-So-Simple Request.

    1. En la página Set Basic Information, seleccione None para omitir la autenticación de seguridad.
      Figura 3 None authentication
    2. En la página Define API Request, realice la siguiente configuración:
      • Protocol: El mismo protocolo utilizado por la API con CORS habilitado.
      • Path: escriba una barra diagonal (/).
      • Method: Seleccione OPTIONS.
      • CORS: Habilitado.
      Figura 4 Definición de la solicitud de API
    3. Seleccione el tipo de backend Mock.
      Figura 5 Mock backend service

Solicitud simple

Al crear una API que recibirá solicitudes simples, habilite CORS para la API.

Escenario 1: Si CORS está habilitado y la respuesta del backend no contiene un encabezado CORS, API Gateway maneja las solicitudes de cualquier dominio y devuelve el encabezado Access-Control-Allow-Origin. Por ejemplo:

Solicitud enviada por un navegador y que contiene el campo Encabezado Origen:

GET /simple HTTP/1.1
Host: www.test.com
Origin: http://www.cors.com
Content-Type: application/x-www-form-urlencoded; charset=utf-8
Accept: application/json
Date: Tue, 15 Jan 2019 01:25:52 GMT

Origin: This field is required to specify the origin (http://www.cors.com in this example) of the request. API Gateway and the backend service determine based on the origin whether the request is safe and can be accepted.

Response sent by the backend service:

HTTP/1.1 200 OK
Date: Tue, 15 Jan 2019 01:25:52 GMT
Content-Type: application/json
Content-Length: 16
Server: api-gateway

{"status":"200"}

Respuesta enviada por API Gateway:

HTTP/1.1 200 OK
Date: Tue, 15 Jan 2019 01:25:52 GMT
Content-Type: application/json
Content-Length: 16
Server: api-gateway
X-Request-Id: 454d689fa69847610b3ca486458fb08b
Access-Control-Allow-Origin: *

{"status":"200"}

Access-Control-Allow-Origin: Este campo es requerido. El asterisco (*) significa que API Gateway gestiona las solicitudes enviadas desde cualquier dominio.

Escenario 2: Si CORS está habilitado y la respuesta del backend contiene un encabezado CORS, el encabezado sobrescribirá el agregado por API Gateway. Los siguientes mensajes se utilizan como ejemplos:

Solicitud enviada por un navegador y que contiene el campo Encabezado Origen:

GET /simple HTTP/1.1
Host: www.test.com
Origin: http://www.cors.com
Content-Type: application/x-www-form-urlencoded; charset=utf-8
Accept: application/json
Date: Tue, 15 Jan 2019 01:25:52 GMT

Origin: Este campo es obligatorio para especificar el origen (el http://www.cors.com en este ejemplo) de la solicitud. API Gateway y el servicio de backend determinan en función del origen si la solicitud es segura y puede aceptarse.

Respuesta enviada por el servicio backend:

HTTP/1.1 200 OK
Date: Tue, 15 Jan 2019 01:25:52 GMT
Content-Type: application/json
Content-Length: 16
Server: api-gateway
Access-Control-Allow-Origin: http://www.cors.com

{"status":"200"}

Access-Control-Allow-Origin: Indica que el servicio backend acepta solicitudes enviadas desde http://www.cors.com.

Respuesta enviada por API Gateway:

HTTP/1.1 200 OK
Date: Tue, 15 Jan 2019 01:25:52 GMT
Content-Type: application/json
Content-Length: 16
Server: api-gateway
X-Request-Id: 454d689fa69847610b3ca486458fb08b
Access-Control-Allow-Origin: http://www.cors.com

{"status":"200"}

El encabezado CORS en la respuesta de backend sobrescribe eso en la respuesta de API Gateway.

Not-So-Simple Request

Cuando cree una API que recibirá solicitudes no tan simples, habilite CORS para la API siguiendo las instrucciones en Configuración de CORS, y cree otra API a la que se accederá mediante el método OPTIONS.

NOTA:

Si usa el plug-in CORS para una API, no necesita crear otra API que use el método OPTIONS.

Los parámetros de solicitud de una API a la que se accede mediante el método OPTIONS deben establecerse de la siguiente manera:

  • API Group: El mismo grupo al que pertenece la API con CORS habilitado.
  • Security Authentication: seleccione None. No se requiere autenticación para las solicitudes recibidas por la nueva API, independientemente del modo de autenticación de seguridad seleccionado.
  • Protocol: El mismo protocolo utilizado por la API con CORS habilitado.
  • Path: Ingrese un (/) de barra diagonal o seleccione la ruta para la que se ha establecido o coincide con la API con CORS habilitada.
  • Method: Seleccione OPTIONS.
  • CORS: Habilitado.

Las siguientes son solicitudes y respuestas de ejemplo enviadas a o desde un backend simulado.

Solicitud enviada desde un navegador a una API a la que se accede mediante el método OPTIONS:

OPTIONS /HTTP/1.1
User-Agent: curl/7.29.0
Host: localhost
Accept: */*
Origin: http://www.cors.com
Access-Control-Request-Method: PUT 
Access-Control-Request-Headers: X-Sdk-Date
  • Origin: Este campo es obligatorio para especificar el origen desde el que se ha enviado la solicitud.
  • Access-Control-Request-Method: Este campo es necesario para especificar los métodos HTTP que se usarán en las solicitudes simples posteriores.
  • Access-Control-Request-Headers: Este campo es opcional y se utiliza para especificar los campos de encabezado adicionales en las solicitudes simples posteriores.

Response sent by the backend: ninguno

Respuesta enviada por API Gateway:

HTTP/1.1 200 OK
Date: Tue, 15 Jan 2019 02:38:48 GMT
Content-Type: application/json
Content-Length: 1036
Server: api-gateway
X-Request-Id: c9b8926888c356d6a9581c5c10bb4d11
Access-Control-Allow-Origin: *
Access-Control-Allow-Headers: X-Stage,X-Sdk-Date,X-Sdk-Nonce,X-Proxy-Signed-Headers,X-Sdk-Content-Sha256,X-Forwarded-For,Authorization,Content-Type,Accept,Accept-Ranges,Cache-Control,Range
Access-Control-Expose-Headers: X-Request-Id,X-Apig-Latency,X-Apig-Upstream-Latency,X-Apig-RateLimit-Api,X-Apig-RateLimit-User,X-Apig-RateLimit-App,X-Apig-RateLimit-Ip,X-Apig-RateLimit-Api-Allenv
Access-Control-Allow-Methods: GET,POST,PUT,DELETE,HEAD,OPTIONS,PATCH
Access-Control-Max-Age: 172800
  • Access-Control-Allow-Origin: Este campo es requerido. El asterisco (*) significa que API Gateway gestiona las solicitudes enviadas desde cualquier dominio.
  • Access-Control-Allow-Headers: Este campo es obligatorio si está contenido en la solicitud. Indica todos los campos de encabezado que se pueden usar durante el acceso de origen cruzado.
  • Access-Control-Expose-Headers: Estos son los campos de encabezado de respuesta que se pueden ver durante el acceso entre regiones.
  • Access-Control-Allow-Methods: Este campo es necesario para especificar qué métodos de solicitud HTTP admite la API Gateway.
  • Access-Control-Max-Age: Este campo es opcional y se utiliza para especificar el tiempo (en segundos) durante el cual el resultado de la comprobación previa permanece válido. No se enviarán más solicitudes de comprobación previa dentro del período especificado.

Solicitud enviada por un navegador y que contiene el campo Encabezado Origen:

PUT /simple HTTP/1.1
Host: www.test.com
Origin: http://www.cors.com
Content-Type: application/x-www-form-urlencoded; charset=utf-8
Accept: application/json
Date: Tue, 15 Jan 2019 01:25:52 GMT

Respuesta enviada por el backend:

HTTP/1.1 200 OK
Date: Tue, 15 Jan 2019 01:25:52 GMT
Content-Type: application/json
Content-Length: 16
Server: api-gateway

{"status":"200"}

Respuesta enviada por API Gateway:

HTTP/1.1 200 OK
Date: Tue, 15 Jan 2019 01:25:52 GMT
Content-Type: application/json
Content-Length: 16
Server: api-gateway
X-Request-Id: 454d689fa69847610b3ca486458fb08b
Access-Control-Allow-Origin: *

{"status":"200"}

Utilizamos cookies para mejorar nuestro sitio y tu experiencia. Al continuar navegando en nuestro sitio, tú aceptas nuestra política de cookies. Descubre más

Comentarios

Comentarios

Comentarios

0/500

Seleccionar contenido

Enviar el contenido seleccionado con los comentarios