Скажем, я подаю на веб-приложение, и мой сервер передачи объекта на передний конец, который выглядит следующим образом:Каковы наилучшие практики для экспорта переменных, передаваемых с сервера на HTML, чтобы их можно было использовать в модулях javascript?
{
user_name : "Robert",
user_settings : {/*some settings object*/}
}
Если я хочу, чтобы получить доступ к этой информации, скажем, main.js , в прошлом я только что сделал эту информацию глобальной в моем html-файле. (Например):
<html>
<head>
<title>Example Page</title>
<!-- style links would go here -->
</head>
<body>
<!-- script tags would go here -->
<script>
window.server_json = {
user_name : "Robert",
user_settings : {/*some settings object*/}
}
</script>
</body>
</html>
Это действительно, кажется, не вписывается в пути, что мы пишем JavaScript в эти дни с WebPack и Бабеля. Я хотел бы иметь возможность экспортировать этот объект и использовать его в других файлах, избегая глобальных привязок.
Я не уверен, как идти об этом, но я предполагаю, что будет выглядеть примерно так:
(example.html)
<html>
<head>
<title>Example Page</title>
<!-- style links would go here -->
</head>
<body>
<!-- script tags would go here -->
<script>
export default json = {
user_name : "Robert",
user_settings : {/*some settings object*/}
}
</script>
</body>
</html>
(Main.js)
import json from "./Example.html";
//Do something with the data received from the server
В моем текущем проекте я использую webpack, babel и vue.js. Я искал какой-то способ сделать это в течение нескольких часов и буду благодарен за любую помощь.
EDIT:
Для уточнения, данные будут отправлены с сервера, используя PHP и тонкий каркас. Это будет выглядеть примерно так:
$app->get('my/page', function($request, $response){
return $this->view->render($response, 'my_page.html', [
"user_name" => "Robert",
"user_settings" => [/*some settings object*/]
]);
});
Как сервер передает данные в интерфейс? не может js просто получить данные, не проходя через html? – MonteCristo
Я расскажу об этом на примере. – Robert