Configurar (CORS) en un bucket de DreamObjects

Generalidades

Este artículo explica cómo configurar una política de Intercambio de Recursos de Origen Cruzado (CORS) en un bucket de DreamObjects. Esto te permite utilizar los datos almacenados en DreamObjects en tu sitio web.

El Intercambio de Recursos de Origen Cruzado (CORS) permite que los recursos restringidos de una fuente (un sitio web o DreamObjects) se soliciten desde otro dominio fuera del dominio desde el que se sirvió originalmente.

Este ejemplo explica como funciona:

  • El sitio A agrega encabezados CORS para permitir al sitio B acceder a un recurso en en el sitio A, como una fuente.
  • El sitio B entonces puede acceder a ese recurso debido al encabezado de CORS.

Sin el encabezado CORS, el sitio B no podrá acceder al recurso en el Sitio A.

Uso de CORS en DreamObjects

Los buckets de DreamObjects no tienen una política de CORS por defecto. Debes agregar una para poder usar los datos de DreamObjects en tu sitio web.

Una configuración de CORS en DreamObjects:

  • Incluye para qué sitio es una solicitud, así como para qué tipo de solicitud,
  • Se maneja individualmente para cada bucket, y
  • Usa la sintáxis de Amazon S3 para la configuración de CORS.

Reglas para las políticas de CORS

Las siguientes son las reglas generales para realizar una configuración CORS:

  • Una configuración de CORS válida consta de 0 a 100 reglas CORS.
  • Cada regla debe incluir al menos un origen.
  • Un origen puede contener como máximo un wildcard *
  • Cada regla debe incluir al menos un método.
  • Los métodos soportados son: GET, HEAD, PUT, POST, DELETE.
  • Cada regla puede contener una cadena de identificación de hasta 255 caracteres.
  • Cada regla puede especificar cero o más encabezados de solicitud permitidos (que el cliente puede incluir en la solicitud).
  • Cada regla puede especificar cero o más encabezados de respuesta expuestos (que se envían desde el servidor al cliente).
  • Cada regla puede especificar un tiempo de validez de caché de cero o más segundos. Si no se incluye, el cliente debe proporcionar su propio valor predeterminado.

Desarrollar una configuración CORS

Una política CORS se puede implementar mediante un cliente o una herramienta de línea de comandos. El código puede estar en formato XML o JSON.

  • Si usas un cliente, la política CORS se agrega dentro del software del cliente.
  • Si usas una herramienta de línea de comandos, debes crear un archivo con las reglas CORS tú mismo. Luego, el comando usa este archivo para actualizar la política CORS del bucket de DreamObjects.

Clientes

No todos los clientes de S3 admiten la implementación de configuraciones CORS. Deberías consultar el sitio web del cliente para confirmar si es compatible con CORS. El siguiente cliente es un ejemplo que admite CORS.

Herramientas de líneas de comando

Puedes también usar herramientas de líneas de comando como s3cmd y aws-cli para actualizar tu política de CORS como se muestra abajo.

Ejemplos de políticas de CORS

Política de WebFont en (formato XML)

Si necesitas alojar una fuente web en DreamObjects, querrás incluir una política como la del siguiente ejemplo (suponiendo que tu sitio sea www.example.com y también funciona en example.com):

<CORSConfiguration>
<CORSRule>
    <ID>Allow WebFont for example.com</ID>
    <AllowedOrigin>https://www.example.com</AllowedOrigin>
    <AllowedOrigin>http://www.example.com</AllowedOrigin>
    <AllowedOrigin>https://example.com</AllowedOrigin>
    <AllowedOrigin>http://example.com</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <AllowedMethod>HEAD</AllowedMethod>
    <AllowedHeader>Content-*</AllowedHeader>
    <AllowedHeader>Host</AllowedHeader>
    <ExposeHeader>ETag</ExposeHeader>
    <MaxAgeSeconds>86400</MaxAgeSeconds>
</CORSRule>
</CORSConfiguration>

Ejemplo de política de AWS S3 JS (en formato XML)

La siguiente política permite a los usuarios de AWS S3 JavaScript SDK, en ambos example.com y www.example.com, en ambos HTTP y HTTPS, subir a DreamObjects, con ambos métodos PUT y POST:

<CORSConfiguration>
<CORSRule>
    <ID>example.com: Allow PUT and POST with AWS S3 JS SDK</ID>
    <AllowedOrigin>https://www.example.com</AllowedOrigin>
    <AllowedOrigin>http://www.example.com</AllowedOrigin>
    <AllowedOrigin>https://example.com</AllowedOrigin>
    <AllowedOrigin>http://example.com</AllowedOrigin>
    <AllowedMethod>PUT</AllowedMethod>
    <AllowedMethod>POST</AllowedMethod>
    <AllowedHeader>Origin</AllowedHeader>
    <AllowedHeader>Content-Length</AllowedHeader>
    <AllowedHeader>Content-Type</AllowedHeader>
    <AllowedHeader>Content-MD5</AllowedHeader>
    <AllowedHeader>X-Amz-User-Agent</AllowedHeader>
    <AllowedHeader>X-Amz-Date</AllowedHeader>
    <AllowedHeader>Authorization</AllowedHeader>
    <ExposeHeader>ETag</ExposeHeader>
    <MaxAgeSeconds>1800</MaxAgeSeconds>
</CORSRule>
<CORSRule>
    <ID>example.com: Allow GET with AWS S3 JS SDK</ID>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <AllowedMethod>HEAD</AllowedMethod>
    <AllowedHeader>*</AllowedHeader>
    <ExposeHeader>ETag</ExposeHeader>
    <MaxAgeSeconds>1800</MaxAgeSeconds>
</CORSRule>
</CORSConfiguration>

Ejemplo de política de Wildcard (¡INSEGURO!)

La siguiente política, siendo completamente insegura, permite TODOS los métodos de cualquier origen. Sin embargo NO expone encabezados personalizados:

<CORSConfiguration>
<CORSRule>
    <ID>Allow
    everything</ID>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <AllowedMethod>HEAD</AllowedMethod>
    <AllowedMethod>PUT</AllowedMethod>
    <AllowedMethod>POST</AllowedMethod>
    <AllowedMethod>DELETE</AllowedMethod>
    <AllowedHeader>*</AllowedHeader>
    <MaxAgeSeconds>30</MaxAgeSeconds>
</CORSRule>
</CORSConfiguration>

s3cmd — desarrollar una política de CORS

S3cmd una herramienta de línea de comandos que puedes usar para administrar tus datos de DreamObjects. No se instala de forma predeterminada en los servidores DreamHost, por lo que debes instalarlo manualmente.

Asegúrate de tener una instalación de S3cmd funcionando antes de proceder.

El ejemplo de abajo crea un archivo corsrules.xml en tu directorio home de tu usuario, pero puedes agregarlo donde quieras. Solo necesitarías actualizar la ruta al archivo en el comando si cambias esta ubicación.

Asegúrate de cambiar my-bucket al nombre de tu bucket de DreamObjects.

Este ejemplo usa un archivo XML conteniendo tu política de CORS.

Puedes correr estos comandos en un computador Mac o Linux, o en tu servidor DreamHost luego de iniciar sesión vía SSH. Este ejemplo corre el comando en el servidor.

  1. Inicia sesión en tu servidor DreamHost vía SSH.
  2. Asegúrate de estar en tu directorio home del usuario.
    [server]$ cd ~
  3. Corre lo siguiente para ver la política CORS actual de tu bucket.
    [server]$ s3cmd info s3://my-bucket
       Location:  us-east-1
       Payer:     BucketOwner
       Expiration Rule: none
       Policy:    none
       CORS:      none
       ACL:       *anon*: READ
       ACL:       my_user: FULL_CONTROL
       URL:       http://my-bucket.objects-us-east-1.dream.io/
    La salida muestra que no hay una política CORS agregada aún.
  4. Crear un archivo XML llamado corsrules.xml con el siguiente contenido. Asegúrate de cambiar el valor AllowedOrigin al nombre de tu sitio web.
    <CORSConfiguration>
    <CORSRule>
        <ID>Alloweverything</ID>
        <AllowedOrigin>http://example.com</AllowedOrigin>
    <AllowedOrigin>https://example.com</AllowedOrigin> <AllowedMethod>GET</AllowedMethod> <AllowedHeader>*</AllowedHeader> <MaxAgeSeconds>3000</MaxAgeSeconds> </CORSRule> </CORSConfiguration>
  5. Corre el comando setcors. Esto usa el archivo corsrules.xml para configurar la política de CORS.
    [server]$ s3cmd setcors corsrules.xml s3://my-bucket
  6. Corre el comando info nuevamente para ver la configuración CORS. Deberías ver tu nueva política mostrada.
    [server]$ s3cmd info s3://bucketname
       Location:  us-east-1
       Payer:     BucketOwner
       Expiration Rule: none
       Policy:    none
       CORS:      <CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/"><CORSRule>
    <ID>Alloweverything</ID><AllowedMethod>GET</AllowedMethod>
    <AllowedOrigin>http://example.com</AllowedOrigin>
    <AllowedOrigin>https://example.com</AllowedOrigin>
    <AllowedHeader>*</AllowedHeader><MaxAgeSeconds>3000</MaxAgeSeconds>
    </CORSRule></CORSConfiguration>
    ACL: *anon*: READ ACL: my_user: FULL_CONTROL URL: http://my-bucket.objects-us-east-1.dream.io/

Si es necesario, puedes correr lo siguiente para eliminar la política CORS de tu bucket.

[server]$ s3cmd delcors s3://my-bucket

AWS CLI — desarrollar una política CORS

AWS CLI es una herramienta de línea de comandos que puedes utilizar para administrar tus datos de DreamObjects y se instala de forma predeterminada en los servidores de DreamHost.

aws-cli es instalado por defecto en todos los servidores DreamHost.

El ejemplo de abajo crea un archivo cors.json en el directorio principal de tu usuario, pero puedes agregarlo en cualquier lugar que desees. Solo necesitarías actualizar la ruta al archivo en el comando si cambias esta ubicación.

Asegúrate de cambiar my-bucket al nombre de tu bucket de DreamObjects.

Este ejemplo usa JSON conteniendo tu política CORS.

Puedes correr esos comandos en un computador Mac o Linux, o tu servidor DreamHost luego de iniciar sesión vía SSH. Estos ejemplos corren el comando en el servidor.

  1. Inicia sesión en tu servidor DreamHost vía SSH.
  2. Asegúrate de estar en el directorio principal de tu usuario.
    [server]$ cd ~
  3. Crea un archivo JSON llamado cors.json con el siguiente contenido. Asegúrate de cambiar el valor AllowedOrigins al nombre de tu sitio web.
    {
      "CORSRules": [
        {
          "AllowedOrigins": ["http://example.com"],
    "AllowedOrigins": ["https://example.com"], "AllowedHeaders": ["*"], "AllowedMethods": ["GET"], "MaxAgeSeconds": 3000, "ExposeHeaders": [] } ] }
  4. Corre el siguiente comando para ver la configuración CORS actual para tu bucket.
    [server]$ aws s3api get-bucket-cors --endpoint-url https://objects-us-east-1.dream.io --bucket my-bucket
    Si no hay una política CORS configurada actualmente, verás el siguiente error.
    An error occurred (NoSuchCORSConfiguration) when calling the GetBucketCors operation: Unknown
    Ignora esto y procede con el siguiente paso.
  5. Corre el comando put-bucket-cors. Esto usa el archivo cors.json para configurar la política CORS.
    [server]$ aws s3api put-bucket-cors --endpoint-url https://objects-us-east-1.dream.io --bucket my-bucket --cors-configuration file://cors.json
  6. Corre el comando para ver la configuración CORS nuevamente. Deberás ver tu nueva política mostrándose.

Si es necesario, puedes correr lo siguiente para eliminar la política CORS del bucket.

[server]$ aws s3api delete-bucket-cors --endpoint-url https://objects-us-east-1.dream.io --bucket s3://my-bucket

Ver también

 

¿Este artículo ha respondido sus preguntas?

Última actualización el PST.

¿Aún no encuentra lo que busca?