veliovgroup / flow-router

šŸš¦ Carefully extended flow-router for Meteor
https://packosphere.com/ostrio/flow-router-extra
BSD 3-Clause "New" or "Revised" License
201 stars 30 forks source link

Multi-language root auto refresh #90

Closed Sergeant61 closed 3 years ago

Sergeant61 commented 3 years ago

I'm having an issue:

Hello, I'm trying to root my application with multilingual support for seo. I automatically create my root objs in an array by returning them. An element of the array:

routers: [
  {
    name: 'home',
    action: function (params, queryParams) {
      this.render('publicLayoutDefault', { page: 'publicPageHome' });
    },
    paths: {
      en: {
        router: '/home',
        title: '',
        meta: {

        }
      },

      tr: {
        router: '/ana-sayfa',
        title: '',
        meta: {
        }
      }
    }
  },
]

The function that runs the array;


import { FlowRouter } from 'meteor/ostrio:flow-router-extra';
import { FlowRouterMeta, FlowRouterTitle } from 'meteor/ostrio:flow-router-meta';

RouterUtil.routers.forEach(router => {
  const { name, action, globalTriggersEnter, paths } = router;

  Object.keys(paths).forEach(key => {

    const path = paths[key];

    const { router, title, meta } = path;

    const obj = {
      name: `${key}.${name}`,
      action: action,
      triggersEnter: [] // ChangeLang
    }

    if (globalTriggersEnter) {
      obj.triggersEnter.push(...globalTriggersEnter);
    }

    switch (key) {
      case 'en':
        obj.triggersEnter.push(SetLocaleEn);
        break;
      case 'tr':
        obj.triggersEnter.push(SetLocaleTr);
        break;
    }

    if (title) {
      obj.title = title;
    }

    if (meta) {
      obj.meta = meta;
    }

    console.log(router);
    FlowRouter.route(router, obj);
  });
});

FlowRouter.route('*', {
  action: function (params, queryParams) {
    const lang = LocaleShort.get() // en or tr
    console.log('<===Not Found===> ');
    FlowRouter.go(`${lang}.home`, {});
  }
});

new FlowRouterMeta(FlowRouter);
new FlowRouterTitle(FlowRouter);

Although my local works very well, it constantly reloads the page when I load it on the machine. I managed to index by language with prerender.io. I guess the reason is because it always goes into the notFound function. I defined these roots as normal and got the same problem. Normally defined roots without multilingual support work normally.

Finally, I get an error like this. If I don't set the meta data, it doesn't come.

-Edit- When the keywords parameters that I defined in the meta are more than 113 characters, I get the error below.

image

Flowrouter data

image

dr-dimitru commented 3 years ago

@Sergeant61 your issue caused by passing an object as a first argument to .route method. And I believe you overcomplexified your solution.

I'd go with a single route for all "homes" routes, for example:

FlowRouter.route('/:lang/:slug/home', {/*...*/});
Sergeant61 commented 3 years ago

Hello, thank you very much for your answer. But adding additional parameters to root means sending it wherever I call it. I found this useless. I already know the language as I define tr.home as en.home when defining roote. Maybe it's a bit too much to do here, but it provides metadata with multi-language support very quickly.

As for the problem, I made a small mistake while adding the google tag credential data to the site, which was constantly putting the site into the notFound function.

Thanks again for your interest, it will be an example for those who will use something like this. šŸ˜‚