В чем разница между программированием на стороне клиента и на стороне сервера?

430

У меня есть этот код:

<script type="text/javascript">
    var foo = 'bar';
    <?php
        file_put_contents('foo.txt', ' + foo + ');
    ?>

    var baz = <?php echo 42; ?>;
    alert(baz);
</script>

Почему это не записывает "бар" в мой текстовый файл, но предупреждает "42"?


NB: более ранние изменения этого вопроса были явно о PHP на сервере и JavaScript на клиенте. Суть проблемы и решений одинакова для любой пары языков при работе на клиенте, а другая на сервере. Пожалуйста, примите это во внимание, когда увидите ответы о конкретных языках.

  • 0
    file_put_contents должен быть отредактирован, чтобы иметь некоторую возможность фактической ссылки на переменную foo . На самом деле, он просто записывает в файл статическую строку и на самом деле не демонстрирует проблему выполнения на стороне сервера и на стороне клиента.
  • 0
    @ Андрей Это точка, нет никакой возможности. Это пример кода, чтобы представить проблему. Если у вас есть лучшее предложение, пожалуйста, не стесняйтесь редактировать его.
Теги:
client-side
server-side

6 ответов

374
Лучший ответ

Ваш код разбит на две полностью отдельные части, на стороне сервера и на стороне клиента.

                    |
               ---------->
              HTTP request
                    |
+--------------+    |    +--------------+
|              |    |    |              |
|    browser   |    |    |  web  server |
| (JavaScript) |    |    |  (PHP etc.)  |
|              |    |    |              |
+--------------+    |    +--------------+
                    |
  client side       |      server side
                    |
               <----------
          HTML, CSS, JavaScript
                    |

Обе стороны общаются через HTTP-запросы и ответы. PHP выполняется на сервере и выводит код HTML и, возможно, JavaScript, который отправляется как ответ клиенту, где интерпретируется HTML, и выполняется JavaScript. Как только PHP завершит вывод ответа, конец script завершается, и на сервере ничего не произойдет, пока не появится новый HTTP-запрос.

Пример кода выполняется следующим образом:

<script type="text/javascript">
    var foo = 'bar';
    <?php
        file_put_contents('foo.txt', ' + foo + ');
    ?>

    var baz = <?php echo 42; ?>;
    alert(baz);
</script>

Шаг 1, PHP выполняет весь код между тегами <?php ?>. В результате получится следующее:

<script type="text/javascript">
    var foo = 'bar';

    var baz = 42;
    alert(baz);
</script>

Вызов file_put_contents не привел ни к чему, он просто написал "+ foo +" в файл. Вызов <?php echo 42; ?> привел к выводу "42", который теперь находится в месте, где этот код был.

Этот полученный код HTML/JavaScript теперь отправляется клиенту, где он получает оценку. Вызов alert работает, а переменная foo не используется нигде.

Весь PHP-код выполняется на сервере, прежде чем клиент даже начнет выполнение любого из JavaScript. В ответе JavaScript, который может взаимодействовать с JavaScript, нет кода PHP.

Чтобы вызвать некоторый код PHP, клиент должен будет отправить новый HTTP-запрос на сервер. Это может произойти с использованием одного из трех возможных способов:

  • Ссылка, которая заставляет браузер загружать новую страницу.
  • Подача формы, которая передает данные на сервер и загружает новую страницу.
  • AJAX, который является техникой Javascript, чтобы сделать обычный HTTP-запрос на сервер (например, 1. и 2.), но не выходя из текущей страницы.

Вот вопрос, подробно описывающий этот метод

Вы также можете использовать JavaScript, чтобы браузер открывал новую страницу с помощью window.location или отправлял форму, эмулируя возможности 1. и 2.

  • 1
    Вы также можете открыть вторую страницу с помощью window.open или загрузить страницу с помощью iframe.
  • 0
    Возможно, стоит добавить WebSockets в список способов коммуникации.
Показать ещё 2 комментария
138

Чтобы определить, почему PHP-код не работает в JavaScript-коде, нам нужно понять, что означает клиентская сторона и серверная сторона и как они работают.

Серверные языки (PHP и т.д.): они извлекают записи из баз данных, сохраняют состояние через HTTP-соединение без учета состояния и выполняют множество задач, требующих безопасности, Они находятся на сервере, эти программы никогда не имеют своего исходного кода для пользователя

Изображение 751image attr

Итак, вы можете легко увидеть, что серверный язык обрабатывает HTTP-запрос и обрабатывает его, а как @deceze говорит, что PHP выполняется на сервере и выводит некоторый HTML-код и, возможно, JavaScript-код, который отправляется как ответ клиенту, где интерпретируется HTML и выполняется JavaScript.

В то время как, с другой стороны, язык клиентской стороны (например, JavaScript) находится в браузере и запускается в браузере, клиентские сценарии обычно относятся к классу компьютерных программ в Интернете, которые выполняются на стороне клиента, пользовательской сетью браузера, а не на стороне сервера.

JavaScript отображается пользователю и может быть легко изменен, поэтому для обеспечения безопасности мы не должны полагаться на JavaScript.

Итак, когда вы делаете HTTP-запрос на сервере, чем сервер, сначала внимательно читает файл PHP, чтобы узнать, есть ли какие-либо задачи, которые необходимо выполнить, и отправить ответ на клиентскую сторону и снова, как @deceze сказал * После завершения PHP вывод ответа, конец script и ничего не произойдет на сервере, пока не появится новый HTTP-запрос. *

Изображение 752

Источник изображения

Итак, что мне делать, если мне нужно вызвать PHP? Это зависит от того, как вам это нужно: либо перезагружая страницу, либо используя вызов AJAX.

  • Вы можете выполнить перезагрузку страницы и отправить HTTP-запрос
  • вы можете сделать вызов AJAX с помощью JavaScript, и это не требует перезагрузки страницы

Хорошее чтение:

21

Ваш Javascript будет выполняться на клиенте, а не на сервере. Это означает, что foo не оценивается на стороне сервера, и поэтому его значение не может быть записано в файл на сервере.

Лучший способ подумать об этом процессе - как будто вы генерируете текстовый файл динамически. Текст, который вы генерируете, становится исполняемым кодом после того, как браузер интерпретирует его. Только то, что вы размещаете между тегами <?php, оценивается на сервере.

Кстати, создание привычки встраивать случайные фрагменты PHP-логики в HTML или Javascript может привести к серьезному запутанному коду. Я говорю от болезненного опыта.

  • 3
    Ваш ответ заслуживает внимания, поскольку в нем упоминается интерпретатор. Тем не менее, javascript может быть скомпилирован и запущен в серверной среде, а также может обрабатываться сервером.
2

В веб-приложении каждая задача выполняется способом запроса и ответа.

Программирование на стороне клиента с html-кодом с Java script и его фреймворками, библиотеками выполняется в Internet Explorer, Mozilla, Chrome-браузерах. В сценарии java серверные сервлеты программирования выполняются в Tomcat, веб-логике, j боссе, WebSphere severs

-1

Я попытаюсь объяснить это простым способом.

Сторона клиента - это то, что пользователь видит/код, который отображается в браузере.

Программирование на стороне клиента включает HTML (HTML, HTML5, DHTML), CSS (CSS, CSS3) и JavaScript (JavaScript, ES5, ES6, ES7, TypeScript, JQuery, ReactJs, AngularJs, BackboneJs или любые другие интерфейсы JavaScript Front-end).

На стороне клиента основное внимание уделяется "как страница будет выглядеть" и ее поведение по сравнению с браузерами.

  1. HTML - это то, что мы видим.
  2. CSS решает его проектирование (цвета, плавающие изображения, прокладка и т.д.).
  3. Информация о странице монитора JavaScript. Все вызовы API и ведение данных по DOM выполняется с помощью JavaScript.

Программирование на стороне сервера включает код, который предоставляет данные на стороне клиента. Пользователь никогда не может видеть серверную сторону.

Программирование на стороне сервера включает в себя язык программирования (Java, PHP,.Net, С#, C, C++, NodeJS и т.д.), Базы данных (SQL, Oracle, MySql, PostgreySql, No-Sql, MongoDB и т.д.), Сторонний API (Rest, Мыло), Бизнес-логика.

Программирование на стороне сервера фокусируется на "как сделать доступными данные для клиентской стороны".

  1. Серверный язык отвечает за обмен данными между различными источниками данных, такими как база данных, сторонний API, файловая система, блок-цепочка и т.д. Эти языки поддерживают определенный API для взаимодействия с клиентской стороной.
  2. База данных несет ответственность за хранение информации.
  3. Business Logic определяет "как использовать данные и что делать с данными".

Данные запроса на стороне клиента или запрос на хранение данных с серверной стороны через API, предоставляемый сервером. Этот запрос и ответ данных выполняются с помощью протокола HTTP/FTP, такого как REST API, SOAP API.

  • 1
    Хотя это пытается ответить на вопрос, поставленный в заголовке, он полностью игнорирует детали тела вопроса, поэтому не решает проблему вообще.
-1

Клиентская сторона script запускается в вашем браузере раньше и вы отправляете запрос на серверные и серверные скрипты, запущенные на сервере. JavaScript, CoffeeScript - это клиентская сторона script, а PHP, Perl и т.д. Являются серверными.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню