Linked JS scripts should be called with a relative path instead of an absolute URL

[lefterav]

The template which loads the js scripts in the HTML header, asks the server for the server root URL and then prepends this to the JS link. This does not work well in server environments (e.g. mine in DFKI) where the server reports a server root URL that is different than the one the normal users use.

I have fixed this on my local version, by just requesting the JS script with a relative url (e.g. ../js/whatever.js) instead of an absolute on (lnv-3209.dfki.sb.de/evaluation/js/whatever.js). If I manage to sync my local version with the main branch I can commit that, or just post here the patch.

[ondrejklejch]

Hi, I tried to fix the problem in c06221b186c395aaf36bc2b103ebda4bc0977b91, please let me know whether that helps with your setup. Otherwise, can you share your Apache configuration, please?

[ondrejklejch]

Or, if the c06221b186c395aaf36bc2b103ebda4bc0977b91 doesn't work, please, try out d267c1ff506b206589f071260f2c1bc12b480d91. Thanks.

[lefterav]

Hi. $basePath does not help. It also returns the internal address of the host

This is the apache configuration

<VirtualHost *:8070>
        ServerName workbench.qtleap.eu
        DocumentRoot /local/qtleap/www 
        ServerAdmin webmaster@localhost
        RewriteEngine On
        RewriteOptions inherit
        CustomLog /var/log/apache2/qtleap.eu.log combined
        ErrorLog /var/log/apache2/qtleap.eu.err.log
        <Directory /local/qtleap/www>
       RewriteEngine on
           Require all granted
           AllowOverride All
        </Directory>
</VirtualHost>

[lefterav]

Unfortunately I cannot attach a patch. This is how I fixed it locally. Please let me know if you want me to push it to the master branch or to another branch for testing.

diff --git a/app/templates/Tasks/compare.latte b/app/templates/Tasks/compare.latte
index 921daf1..2784c35 100644
--- a/app/templates/Tasks/compare.latte
+++ b/app/templates/Tasks/compare.latte
@@ -4,15 +4,15 @@

 {block styles}
 {include #parent}
-<link rel="stylesheet" href="{$baseUri}/css/compare.css" />
+<link rel="stylesheet" href="../../css/compare.css" />
 {/block}

 {block scripts}
 {include #parent}
-<script type="text/javascript" src="{$baseUri}/js/directives.js"></script>
-<script type="text/javascript" src="{$baseUri}/js/ngrams.js"></script>
-<script type="text/javascript" src="{$baseUri}/js/bootstrap.min.js"></script>
-<script type="text/javascript" src="{$baseUri}/js/highcharts.src.js"></script>
+<script type="text/javascript" src="../../js/directives.js"></script>
+<script type="text/javascript" src="../../js/ngrams.js"></script>
+<script type="text/javascript" src="../../js/bootstrap.min.js"></script>
+<script type="text/javascript" src="../../js/highcharts.src.js"></script>
 <script type="text/javascript">
 function Sentences( $scope, $http ) {
    {foreach $taskIds as $i => $id}
@@ -125,7 +125,7 @@ function Sentences( $scope, $http ) {
                "task2": $scope.task1
        };

-       $http.get( '{!$baseUri}/api/ngrams/confirmed', payload ).success( function( data ) {
+       $http.get( '../../api/ngrams/confirmed', payload ).success( function( data ) {
            $scope.confirmedNgrams = data;
            $scope.loadingConfirmedNgrams = false;
        } );
@@ -139,7 +139,7 @@ function Sentences( $scope, $http ) {
        };

        $scope.loadingUnconfirmedNgrams = true;
-       $http.get( '{!$baseUri}/api/ngrams/unconfirmed', payload ).success( function( data ) {
+       $http.get( '../../api/ngrams/unconfirmed', payload ).success( function( data ) {
            $scope.unconfirmedNgrams = data;
            $scope.loadingUnconfirmedNgrams = false;
        } );
@@ -153,7 +153,7 @@ function Sentences( $scope, $http ) {
                "metric": ( !$scope.currentMetric ) ? 'bleu-cis' : $scope.currentMetric
        };

-       $http.get( '{!$baseUri}/api/metrics/results', payload ).success( function( data ) {
+       $http.get( '../../api/metrics/results', payload ).success( function( data ) {
            $scope.diffs = {
                "chart": {
                    "zoomType": "x"
@@ -211,7 +211,7 @@ function Sentences( $scope, $http ) {
            };
        } );

-       $http.get( '{!$baseUri}/api/metrics/samples-diff', payload ).success( function( data ) {
+       $http.get( '../../api/metrics/samples-diff', payload ).success( function( data ) {
            var all = data.samples.data.length; 
            var worser = data.samples.data.filter( function( x ) { return x < 0; } ).length;
            var better = data.samples.data.filter( function( x ) { return x > 0; } ).length;
@@ -306,7 +306,7 @@ function Sentences( $scope, $http ) {
        } );

        payload.params.task = $scope.task0;
-       $http.get( '{!$baseUri}/api/metrics/samples', payload ).success( function( data ) {
+       $http.get( '../../api/metrics/samples', payload ).success( function( data ) {
            var all = data.samples.data.length;
            var first = data.samples.data[ Math.floor( all * 0.025 ) ];
            var last = data.samples.data[ Math.ceil( all * 0.975 ) ];
@@ -385,7 +385,7 @@ function Sentences( $scope, $http ) {
        } );

        payload.params.task = $scope.task1;
-       $http.get( '{!$baseUri}/api/metrics/samples', payload ).success( function( data ) {
+       $http.get( '../../api/metrics/samples', payload ).success( function( data ) {
            var all = data.samples.data.length;
            var first = data.samples.data[ Math.floor( all * 0.025 ) ];
            var last = data.samples.data[ Math.ceil( all * 0.975 ) ];
@@ -467,7 +467,7 @@ function Sentences( $scope, $http ) {

    function loadMetrics() {
-       $http.get( '{!$baseUri}/api/metrics' ).success( addMetrics );
+       $http.get( '../../api/metrics' ).success( addMetrics );

    }

@@ -484,7 +484,7 @@ function Sentences( $scope, $http ) {
                "task2": $scope.task1,
        };

-       $http.get( '{!$baseUri}/api/metrics/scores', payload ).success( function( data ) {
+       $http.get( '../../api/metrics/scores', payload ).success( function( data ) {
            $scope.taskMetrics = data;

            var categories = $scope.metrics;
@@ -548,7 +548,7 @@ function Sentences( $scope, $http ) {

    function loadTasks() {
-       $http.get( '{!$baseUri}/api/tasks', {
+       $http.get( '../../api/tasks', {
            params: {
                "experimentId": {!$experimentId},
            }
@@ -582,9 +582,9 @@ function Sentences( $scope, $http ) {

    function getSentenceRequestUrl() {
        if ( $scope.sentencesToLoad.length == 0 ) {
-           return '{!$baseUri}/api/sentences';
+           return '../../api/sentences';
        } else {
-           return '{!$baseUri}/api/sentences/by-id';
+           return '../../api/sentences/by-id';
        }
    }

diff --git a/app/templates/Tasks/list.latte b/app/templates/Tasks/list.latte
index 309fc90..af702d7 100644
--- a/app/templates/Tasks/list.latte
+++ b/app/templates/Tasks/list.latte
@@ -1,9 +1,9 @@
 {block scripts}
 {include #parent}
-<script type="text/javascript" src="{$baseUri}/js/directives.js"></script>
-<script type="text/javascript" src="{$baseUri}/js/ngrams.js"></script>
-<script type="text/javascript" src="{$baseUri}/js/bootstrap.min.js"></script>
-<script type="text/javascript" src="{$baseUri}/js/highcharts.src.js"></script>
+<script type="text/javascript" src="../js/directives.js"></script>
+<script type="text/javascript" src="../js/ngrams.js"></script>
+<script type="text/javascript" src="../js/bootstrap.min.js"></script>
+<script type="text/javascript" src="../js/highcharts.src.js"></script>
 <script type="text/javascript">
 $(document).ready( function() {
    $('.compare').click( function( event ) {
@@ -17,7 +17,7 @@ $(document).ready( function() {
            return alert( "You can compare only 2 tasks." );
        }

-       window.location = "{!$baseUri}/tasks/" + tasksIds[0] + "-" + tasksIds[1] + "/compare";
+       window.location = "../tasks/" + tasksIds[0] + "-" + tasksIds[1] + "/compare";
    } );
 } );
 </script>
@@ -58,12 +58,12 @@ $(document).ready( function() {
                "experimentId": {!$experimentId}
            };

-           $http.get( '{!$baseUri}/api/tasks', payload ).success( function( data ) {
+           $http.get( '../api/tasks', payload ).success( function( data ) {
                $scope.tasks = data.tasks;
                $scope.showAdministration = data.show_administration;
            } );

-           $http.get( '{!$baseUri}/api/metrics/scores-in-experiment', payload ).success( function( data ) {
+           $http.get( '../api/metrics/scores-in-experiment', payload ).success( function( data ) {
                $scope.$watch( function() { return $scope.hiddenTasks; }, function( value ) {
                    loadScores();
                } );

[ondrejklejch]

There is a solution in the new version of Nette: http://doc.nette.org/en/2.3/configuring#toc-http-proxies. I need to check, whether we can upgrade easily. If not I will ask you to push it to the master.

[ondrejklejch]

Ok, I upgraded MT-ComparEval to newer version of Nette. Please, checkout branch base_path (beware that I used force push) and try it again.

First, run php composer.phar update --no-dev and rm -rf temp/* - this might be sufficient to make it work. Otherwise, try to set proxy in https://github.com/choko/MT-ComparEval/blob/base_path/app/config/config.neon#L29.

[ondrejklejch]

It works, there is no need to setup proxy.