Amazon S3 ne sert pas les fichiers correctement

Question

J'ai fait ce site pour mon ami et je l'ai téléchargé dans un seau Amazon S3 (http://ballard26.s3.amazonaws.com/index.html) et quand je vais sur ce site, la page ne se charge pas correctement et je ne sais pas pourquoi. Des idées?

Par exemple, le stylesheet.css ne se charge pas correctement. Si vous allez à http://ballard26.s3.amazonaws.com/stylesheet.css, il télécharge le fichier au lieu de le charger en CSS.

Answer 1

Vérifiez les types mime (en-tête de type de contenu HTTP) sur les fichiers que vous avez téléchargés. S3 ne les définit pas toujours correctement. Vous devrez peut-être les définir lors de l'appel de l'API de téléchargement. Certaines bibliothèques de téléchargement le feront pour vous.

Si les types MIME ne sont pas corrects lorsque le fichier est téléchargé à partir du navigateur à partir de S3 si le type MIME n'est pas défini correctement, il ne s'affichera pas toujours correctement.

Answer 2

Je suppose que vous n'avez pas spécifié ou défini correctement le type mime du fichier lors du téléchargement du fichier. Par conséquent, il est binary/octet-stream par défaut. Lorsque vous chargez votre page, votre navigateur suppose que la feuille de style que vous avez spécifiée n'est pas un fichier CSS car elle est fournie avec un type de contenu autre que text/css et n'applique donc pas la feuille de style.

Answer 3

J'ai eu le même problème dans IE en raison d'un type de contenu incorrect de nos fichiers CSS/JS.

Si vous utilisez Ruby et la gemme AWS, utilisez le code ceci:

s3 = Aws::S3Interface.new($s3[:s3_access_key_id],$s3[:s3_secret_access_key],{:multi_thread => true}); 
s3.put($s3[:s3_bucket],s3_path,file[:tempfile].read,{'x-amz-acl' => 'public-read', 'content-type' => 'text/css' }) 

Notez la syntaxe différente pour la S3 métadonnées:

'content-type' => 'text/css' 

Answer 4

fichiers CSS par défaut à un type MIME octet/binary. Pour corriger cela, connectez-vous à AWS Management Console, accédez à la section Amazon S3 et recherchez le compartiment correspondant. Recherchez le fichier CSS et sélectionnez Propriétés. Sous métadonnées, définissez la clé Content-Type de la valeur: text/css

Si vous utilisez l'application de transmission de panique pour Mac OS X, vous pouvez définir une mesure Télécharger en-tête pour les fichiers CSS de Content-Type: text/css qui appliquent le type MIME correct chaque fois que vous télécharger un fichier, supprimant le besoin de le définir manuellement dans votre console à chaque fois.

Plus d'informations sur ceci est dans blog post d'Adam Wilcox.