zona van una type script recomendable qué que página nuestro los invoca forma externo etiqueta donde desde código colocar coloca body archivo javascript html5 seo amazon-web-services cdn

van - javascript en head o body



Configurar cualquier CDN para entregar solo un archivo sin importar qué URL se haya solicitado (9)

Actualmente estoy trabajando en un nuevo proyecto donde toda la página debe implementarse en HTML5 / JS trabajando en contra de una API / JSON. Dado que toda la aplicación solo debe consistir en un archivo HTML (index.html) y una aplicación JS MVC (tal vez backboneJs), estoy pensando en SEO y en URL fáciles de usar.

Allí me encontré

window.document.pushstate('''',''title'',''/url'');

Con la ayuda de esa función html5 puedo definir URLs sin realmente salir o volver a cargar la página. PERO ... Quiero implementar la aplicación en un CDN como Amazon CloudFount por razones de rendimiento y bajos gastos. No necesitaría ninguna infraestructura de servidor (además del que necesito para la API, por supuesto)

Entonces, ¿puedo configurar un CDN (realmente cualquier CDN como AWS, Azure, Akamai) para proporcionar el mismo archivo HTML sin importar qué URL se llame?

http://www.example.com => ofrece index.html

http://www.example.com/any_subpage => entrega index.html

y así ...

un ejemplo de trabajo que puedes encontrar en http://html5.gingerhost.com . Pero el creador de esa página puede usar un archivo .htaccess o algo familiar para asignar todo al mismo archivo. Quiero proporcionar la misma funcionalidad en un CDN.


Haga un enlace simbólico de su página 404 a la página de índice. De esta forma, cuando no se encuentra una URL solicitada en su contenido web (sobre cualquier enlace, como aparece en su caso), se publica la página 404, que a su vez es la página de índice.

# ln -s index.html 404.html


Cualquier CDN debería tener la capacidad de definir un servidor de origen. El CDN se pone en contacto con este servidor para que sirva el archivo si la ubicación del borde no lo tiene.

La buena noticia es que el servidor de origen puede ser cualquier cosa que sirva para páginas web, como Apache, Nginx, etc. Esto significa que puede aplicar cualquier tipo de reglas de reescritura que desee.

Si no desea configurar el servidor de origen usted mismo, podría considerar alojar su sitio (estático) en S3 . Recientemente, han introducido redireccionamientos web que pueden ayudarlo a publicar el mismo archivo bajo un "alias" diferente. De lo contrario, podría considerar la redefinición del documento de error estándar , pero no estoy seguro de si se enviará un código de estado de error.


El servidor http Nginx puede hacer esto como:

location /{ # serve a file }

o puedes personalizar tus enlaces como

location /my_html{ # serve html file } location /cdn/{ # serve rest files }

incluso puedes verificar las URL por expresiones regulares

location ~ /cdn/.*/.js${ # serve cdn }


En caso de que tenga su propio dominio que apunte al CDN (sé que CloudFront le permite hacerlo), podría usar CloudFlare ( https://www.cloudflare.com/ ) como un proxy inverso entre sus usuarios y el CDN.

Gracias a su plan gratuito, puede crear una regla que redirija todo a index.html. Creo que esta es la única manera de lograr lo que desea, dado que los CDN están configurados para servir solo archivos estáticos existentes como usted sabe.


Los CDN están destinados a entregar contenido estático al servir el recurso estático desde el punto geográfico más cercano posible al cliente. La tecnología CDN no tiene la intención de hacer un redireccionamiento o el procesamiento del lado del servidor de la solicitud. Necesitarás algo más involucrado aquí para hacer esa parte. La pregunta es si se trata de una tecnología del lado del servidor o algún tipo de reescritura de solicitud de equilibrio de carga / firewall (para evitar tener una tecnología del lado del servidor).

No creo que haya una manera verdaderamente agnóstica de plataforma para hacer esto. Siempre estará vinculado a una tecnología del lado del servidor o una plataforma de balanceador de carga / firewall. ¿Pero también parece que ya tienes esta restricción ya que necesitas un lugar para alojar tu API JSON? Incluso si no se ha decidido por la plataforma, casi cualquier plataforma debería permitirle hacer un enrutamiento básico. Si puede atender las solicitudes HTTP de JSON, también debería poder enrutar algunas páginas.

Como nota al margen, no creo que desee devolver su "index.html" de absolutamente todas las URL posibles en su dominio. Querrá una lista de URL válidas y URL no válidas. En ese caso, deberá hacer ping a su back end de todos modos para validar la URL de la solicitud. Eso me sugiere además que una tecnología del lado del servidor será más adecuada para esta tarea que un redireccionamiento "catch-all" a un nivel inferior.

Mi preferencia personal sería usar su marco MVC favorito para servir contenido indexable con la estructura de su URL deseada (casi todas las cargas de página) y luego usar su API api para trabajar con ese contenido después de la carga de la página (cualquier material dinámico que desee poder que hacer). Todo, tanto las cargas de página como la API, se sirven desde la misma plataforma / entorno de servidor.


Si está considerando SEO y URL amigables, puede lograr algo de eso usando pushState , claro. Solo recuerda eso:

  • Al redireccionar todas las rutas a index.html, también se publicará el mismo contenido html exacto para los motores de búsqueda, sin importar en qué URL se marchen. Entonces no importa qué tan "amigable para SEO" sea su URL.

  • Si está pensando en la compatibilidad de IE, no es compatible con la API de historial, por lo que necesitará un marco de historial de nivel superior o alguna otra solución para IE. Y eso probablemente incluirá URL basadas en # . Por lo tanto, básicamente tendrá dos URL diferentes para cada vista, eso es algo que debe tenerse en cuenta cuando las personas comparten URL o averiguan cómo los robots de búsqueda captan enlaces a su sitio.

Sugeriría considerar las dos opciones siguientes antes de ir demasiado lejos en la búsqueda de un host de nube adecuado:

  1. Descargue parte de la lógica de datos al servidor y sirva al menos algo de contenido digerible para cada vista. Todavía puede eliminar o quizás analizar ese contenido en su aplicación y hacer su uso de pushstate / jsonAPI para una mejor UX, pero tendrá URLs "verdaderas" y escaneables para los motores de búsqueda, mini-usuarios de opera y algunos navegadores desafortunados. Estas páginas estáticas no tienen que servir la misma funcionalidad o incluso estilos, solo piense en ello como la última alternativa.

  2. Olvídese del CDN de la aplicación, solo use el CDN para archivos estáticos, imágenes, secuencias de comandos, etc. Puede tener un par de inconvenientes para la aplicación en sí, pero son los medios los que realmente atraen al servidor. Si lo hace, tendrá el control sobre la aplicación y el servidor que lo respalda, pero aún puede usar CDN para lo que estaba destinado: servir contenido estático.


Recientemente nos pusimos en contacto con edgecast.com (que es un cdn como cloudfront) y con su apoyo me dijeron que esto es realmente algo que pueden hacer, pero no a través de su interfaz estándar. Me dijeron que simplemente los contacte cuando necesitáramos una ruta de comodín para un solo archivo.

En cuanto a su pregunta: , es posible. Solo comuníquese con ellos a través de su chat en vivo y ellos lo ayudarán, ¡buena suerte!

Más información (negativa): una regla de catch-all como esta significa el estúpido favicon.ico-forced-request Algunos navegadores (leer IE) do serán capturados y la página html regular será descargada nuevamente. De hecho, todas las solicitudes automáticas (iframes también solicitan un favicon, por ejemplo) contra el dominio raíz serán capturadas y se descargará el archivo html regular. Esto puede o no ser un problema para ti, pero para mí todas estas solicitudes ocultas me están haciendo replantear la solución y usar un servidor web para hacer el truco real. Vergüenza realmente


Estoy en el mismo barco que tú y parece que los cdn no soportan la reescritura de URL. La siguiente solución no resuelve nuestro "problema" exactamente, pero está muy cerca de ahorrar $ para alojamiento si está utilizando un proveedor de CDN "pull".

La carga inicial de la página predeterminada (index.html) proporcionará solo una pequeña parte del html, básicamente la estructura html básica, así:

<!doctype html> <html lang="en"> <head> <title>something</title> <!-- Load the script "js/main.js" as our entry point --> <script data-main="js/main" src="http://mycdn.com/js/libs/require/require.js"></script> </head> <body> </body> </html>

El resto del código se cargaría mediante algún cargador de módulos (asíncrono) como require.js, y todo ese código provendría de su CDN, incluido require.js.

Sin embargo, incluso este pequeño bit de html en muy poco tiempo también vendrá del CDN si está utilizando pull CDN. El proveedor de "extracción" de CDN llegará a esta página siempre que no encuentre un archivo para una url pushstate html5 en su caché.

En su servidor, debe tener algún tipo de enrutamiento para enrutar cada solicitud que coincida con un patrón donde no se proporciona una extensión de archivo desde el CDN a este único archivo.

Sí, la CDN llegará al sitio cada vez que se encuentre una nueva url (si está utilizando pull CDN), pero una vez que la obtenga, la distribuirá a todos los usuarios desde su caché y no llegará a su sitio por la misma URL. url nuevamente. Además, el impacto en su sitio del proveedor CDN será insignificante ya que está publicando un poco de html estático. Y, si configura los encabezados de los archivos para que nunca expiren en este archivo html (este archivo nunca debería cambiar), el proveedor de CDN puede conservar el archivo durante mucho tiempo (según el proveedor), por lo que los hits en su servidor casi se reduciría a un evento único por url única.