AltoRouter: Problem with local (js/css) files

I asked this same question about a year ago as well, but never realy received an answer, but now I’m facing the exact same problems again. For a multi language site I am using AltoRouter for the Routing. Everything works great except that I have problems with local (js/css) files. When I include css and js files using CDN, everything works just fine, however whenever I use a relative path to local files:

<link rel="stylesheet" href="/css/plugins.min.css">

<script src="/js/plugins.min.js"></script>

Certain rules/classes (css) and functions (js) stop working. I have real no idea how to solve this. For the record, this is what I have in the Router class:

class Router {
    private $router;

    public function __construct()
    {
        $config = Config::get('routes');
        $this->router = new AltoRouter();

        foreach ($config['routes'] as $route => $options) {
            $this->router->map( 'GET|POST', $route, $options );
        }
    }

    public function dispatch($route = '/')
    {
        $match = $this->router->match($route);

        if ( $match ) {
            $options = array_merge( $match['target'], $match['params'] );

            $callable = [new $options['controller']($route), $options['action'] . 'Action'];
            $callable($match['params']);
        } else {
            header( $_SERVER["SERVER_PROTOCOL"] . ' 404 Not Found');
            echo '<pre>', var_dump($this->router, $match), '</pre>';
        }
    }
}

Does anyone has an idea what I need t adjust to make the local css and js files work as they should?

Thank you in advance

Do you have a link? If relative URLs are not working but absolute URLs are (CDNs are absolute URLs), then it means that your relative URLs are wrong. This could be because your projects root directory is not the same as the server’s root, which can happen when you’re serving your site from a subdirectory.

For example, if your site is served from localhost/websites/website-a then your server’s root is localhost, meaning when you load from /js/plugins.min.js it’s actually trying to load localhost/js/plugins.min.js and not localhost/website/website-a/js/plugins.min.js

It could also be because your scripts just aren’t building.

@tensormonkey. Thank you for the reply this is root (locally)

robingerard.local/en/

or

robingerard.local/nl/

or other languages. Where the /en or /nl (var $language) are controlled in the controller

I don’t really know much about AltoRouter, but based on what you’ve shown can’t you just use absolute URLs? So instead of:

<link rel="stylesheet" href="/css/plugins.min.css">
<script src="/js/plugins.min.js"></script>

Can you try something like:

<link rel="stylesheet" href="<?= $baseURL ?>/css/plugins.min.css">
<script src="<?= $baseURL?>/js/plugins.min.js"></script>

Or if you’re generating these links, then maybe you also need to include the language in the path: https://github.com/dannyvankooten/AltoRouter/issues/86

1 Like

@tensormonkey. That is working great, thanks a lot.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.