クライアント側のサーバーで設定したオブジェクトにアクセスする方法

Question

nodeとexpressを使用していますが、サーバーから送信されるアクセスオブジェクトが必要です。 例えば

サーバ側：

router.get('/some_page/', (req, res) => { 
    res.render('some_page', { 
     data: {"somevar1":"somevalue", "somevar2":"somevalue2"} 
    }); 
}); 

クライアント側のjavascript：

var objSentFromSrv = ??? // here i want this object and then perform some action on it 

が正当な/これは可能ですか？

EDIT：

私はテンプレートエンジンとしてhandlebarsを使用しています。

どういうわけか分かりません。

function middlewareAppendingLocals(req, res, next) { 
    res.locals.layoutV = myValue; 

    next(); 
} 

router.post('/page/', middlewareAppendingLocals, (req, res) => { 
    res.render('page_to_render'); 
}); 

私のケースでは、この変数はデータベースから来ており、私はantoherページから投稿されたidに基づいています。でも、まだ.hbsレイアウトファイルだけでなく、javascriptからどうやってアクセスすることができますか？

次にpage_to_renderがあります。それを得るために{{}}のバーを処理できます。

Answer 1

フロントエンドサービスとしてAngularJSを使用している場合、コントローラを作成して、$scopeと$httpを注入してデータを取得できます。例：

var app = angular.module('myApp', []); 

    app.controller('mainController', ($scope, $http) => { 
    $scope.data= {}; 

    $scope.getData = function() { 
     $http.get('/some_route/') 
      .success((data) => { 
       $scope.data = data; 
       console.log(data); 
      }) 
      .error((error) => { 
       console.log(error); 
      }); 
    }; 
}); 

次に、フロントエンドでgetData()と呼び出します。

https://docs.angularjs.org/guide/controller

Answer 2

あなたのテンプレートエンジンは、そのレンダリングコールに渡される引数を取り、HTML（多くの場合）、またはJSONを生成するために起こっています。実際にオブジェクトを送信するのではなく、テキストデータだけです。

サーバー側に存在するオブジェクトの状態を変更する場合は、そのためのAPIを作成する必要があります。クライアントにデータを送信し、そのデータを変更して元のオブジェクトに組み込むためにサーバーに戻します。

Answer 3

あなたはこのようにJSONとしてオブジェクトをエンコードする必要があります。

：あなたは

$.get('/some_page/', function(data) { 
    var objSentFromSrv = JSON.parse(data); 
}); 

または短いを使用できるjQueryのを使用して、

router.get('/some_page/', (req, res) => { 
    res.send(JSON.stringify({ 
     data: {"somevar1":"somevalue", "somevar2":"somevalue2"} 
    })); 
}); 

、その後、フロントエンドでAJAXを使用します

$.getJSON('/some_page/', function(data) { 
    var objSentFromSrv = data; 
}); 

Answer 4

はい。これは可能で正当なものです。あなたがEJSを使用していると仮定すると、あなたのテンプレートに、このような行を追加します。

<script> 
    const objSentFromSrv = <%-JSON.stringify(data)%>; 
</script> 

あなたは別のテンプレートエンジンを使用している場合は、オブジェクトをシリアル化する方法についての具体的な構文をルックアップする必要があるだけでしょう。

このユースケースの場合、AjAXは過剰です。