Redirect SitemapItem to Webfiles

[Stéliann Minatchy]

Hi Everyone,

I'm trying to integrate an Angular 4 in a sub-page of my Hippo CMS website. As Angular needs a base href relative to the url typed to load the assets and the scripts, I want to know if there's a way to redirect a project related sitemap item to the webfiles. I tried to setup stable webfiles under the /webfiles/angular url and setup my Angular base href to this url. It works but it changes the browser url to this url and I want to keep the browser url the same to use a hash based navigation in Angular. So what I want to achieve is something like :

- hst:hst

  - hst:configurations

    - my-site

      - hst:sitemap

        - angular

          - _any_

Redirecting to :

- hst:hst

  - hst:configurations

    - hst:default

      - hst:sitemap

        - webfiles

          - angular

Can you please help me ?

Thanks in advance.

Stéliann MINATCHY  Développeur d’applications web et mobile  Agence Tête Chercheuse Conseil et Solutions Web 115 rue David Johnston 33000 Bordeaux www.tete-chercheuse.fr

[Ard Schrijvers]

Hey Stéliann,

On Mon, Jun 26, 2017 at 5:45 PM, Stéliann Minatchy
<steliann...@gmail.com> wrote:
>
> Hi Everyone,
>
> I'm trying to integrate an Angular 4 in a sub-page of my Hippo CMS website. As Angular needs a base href relative to the url typed to load the assets and the scripts, I want to know if there's a way to redirect a project related sitemap item to the webfiles. I tried to setup stable webfiles under the /webfiles/angular url and setup my Angular base href to this url. It works but it changes the browser url to this url and I want to keep the browser url the same to use a hash based navigation in Angular. So what I want to achieve is something like :
>
> - hst:hst
> - hst:configurations
> - my-site
> - hst:sitemap
> - angular
> - _any_
>
> Redirecting to :
>
> - hst:hst
> - hst:configurations
> - hst:default
> - hst:sitemap
> - webfiles
> - angular
>
> Can you please help me ?

I don't think I really get what you try to achieve so it is hard for
me to help. Perhaps someone else can chime in who better understands
what you are trying (or you try to explain it again)

Regards Ard

>
> Thanks in advance.
>
>
> Stéliann MINATCHY
> Développeur d’applications web et mobile
> Agence Tête Chercheuse
> Conseil et Solutions Web
> 115 rue David Johnston
> 33000 Bordeaux
> www.tete-chercheuse.fr
>

> --
> Hippo Community Group: The place for all discussions and announcements about Hippo CMS (and HST, repository etc. etc.)
>
> To post to this group, send email to hippo-c...@googlegroups.com
> RSS: https://groups.google.com/group/hippo-community/feed/rss_v2_0_msgs.xml?num=50
> ---
> You received this message because you are subscribed to the Google Groups "Hippo Community" group.
> To unsubscribe from this group and stop receiving emails from it, send an email to hippo-communi...@googlegroups.com.
> Visit this group at https://groups.google.com/group/hippo-community.
> For more options, visit https://groups.google.com/d/optout.




--
Hippo Netherlands, Oosteinde 11, 1017 WT Amsterdam, Netherlands
Hippo USA, Inc. 71 Summer Street, 2nd Floor Boston, MA 02110, United
states of America.

US +1 877 414 4776 (toll free)
Europe +31(0)20 522 4466
www.onehippo.com

[Stéliann Minatchy]

Hi Ard,

Thanks for your answer. This is the first time I use Hippo and I'm French so my explanations may be a bit tricky. I really apologize for that. Let me try to explain my problem again.

I'm developing a Hippo based website with some basic content and an Angular 4 based webapp in it. I have multiple pages showing documents and a page with the webapp.

In the webapp page, I use the webfile system to integrate Angular because I want the webapp to be part of the website (not hosted on a separate server). So I added a Sitemap Item in the cms console like :

- hst:hst

  - hst:configurations

    - my-site

      - hst:sitemap

        - angular

          +hst:template = hst:hst/hst:configurations/my-site/hst:templates/angular (an empty template that includes Angular built index.html)

To load the files and route the components, Angular needs a base href relative to the url path (e.g. http://localhost:8080/site/angular/ will need a /site/angular/ base href). The problem is that this base href is used to load the files (it will load http://localhost:8080/site/angular/main.bundle.js for the main file per example). But I added theses files in the webfiles.

In the documentation I saw that I could enable stable urls for my Angular webfiles by setting in the cms console :

- hst:hst

  - hst:configurations

    - hst:default

      - hst:sitemap

        - webfiles

          - angular

            - _any_

              + hst:relativecontentpath = angular/${1}

With this configuration I can access these files with an url like http://localhost:8080/site/webfiles/angular/*.js

To make Angular load the files with the correct path, I set the base href to /site/webfiles/angular/, but now Angular also uses this base to route the components. If I want a route like http://localhost:8080/site/angular/home/, Angular will use the base href to make the route so it will change it to http://localhost:8080/site/webfiles/angular/home/ and as this url refers to webfiles, it produces a 404 error. 

The files are correctly loaded but the routes are broken with this configuration.

So what I want, is to redirect the page related Sitemap Item (/site/angular/_any_) to the stable webfiles url (/site/webfiles/angular/_any_). This way I would be able to set my base href to /site/angular/ and Angular will load the files with the url http://localhost:8080/site/angular/*.js and physically they will be in /webfiles/angular/. How can I achieve this ?

--

Stéliann MINATCHY  Développeur d’applications web et mobile  Agence Tête Chercheuse Conseil et Solutions Web 115 rue David Johnston 33000 Bordeaux www.tete-chercheuse.fr

[Stéliann Minatchy]

Hi Ard,

I finally figure it out. I added hst:namedpipeline = WebFilePipeline and hst:relativecontentpath = angular/ under my angular/_any_ Sitemap Item and it works.

Thanks nevertheless.

--

Stéliann MINATCHY  Développeur d’applications web et mobile  Agence Tête Chercheuse Conseil et Solutions Web 115 rue David Johnston 33000 Bordeaux www.tete-chercheuse.fr