Estoy alojando una aplicación angular 2 en s3. Estoy usando reglas de redirección en el depósito s3, como se define en la respuesta .
<RoutingRules> <RoutingRule> <Condition> <HttpErrorCodeReturnedEquals>404</HttpErrorCodeReturnedEquals> </Condition> <Redirect> <HostName>yourdomainname.com</HostName> <ReplaceKeyPrefixWith>#!/</ReplaceKeyPrefixWith> </Redirect> </RoutingRule> </RoutingRules>Mi aplicación angular usa el enrutamiento html5 para que coincida con las reglas de redirección:
En app.module.ts:
RouterModule.forRoot(appRoutes, { useHash: true })Esta combinación funciona bien, con la excepción de mostrar una imagen en la carpeta de activos del sitio web. Esto está en mi barra de navegación:
<img src="./assets/logo.png" id="group-ed-logo" />Estoy usando angular-cli, que tiene lo siguiente en angular-cli.json:
"assets": [ "assets", "assets/logo.png", "favicon.ico", "logo.png" ],Editar: agregué logo.png a lo anterior y puse el archivo logo.png en el directorio raíz del archivo src y luego usé:
<img src="logo.png" id="group-ed-logo" />A continuación, se muestra el logotipo. Sería más ordenado tener las imágenes en una carpeta de activos. Sin embargo, puede ser que angular-cli actualmente no admita activos en carpetas cuando se usa el enrutamiento html 5.
Si el archivo está en el directorio de activos, obtengo una URL 404 que no se encuentra: " http://www.myurl.com/#/assets/logo.png ".
Para las carpetas, en el depósito 'Crear una carpeta', luego agregue sus archivos a ese depósito.
Además, si arrastra y suelta toda la carpeta dist, es posible que esté mirando el interior de la carpeta dist en la interfaz de usuario de AWS, sin darse cuenta de que está en la carpeta dist. Copie solo el contenido de la carpeta dist, no la carpeta dist. -- Esto me pasó a mí.
