Привет всем! Сегодня расскажу, как я в рамках изучения PHP (и в целях решения собственной задачи) сделал за вечер страницу с мультипереводчиком. Увы, в основе лежит работы с API Google Translate, но думаю, что как для начинающего php-шника — очень даже норм 🙂 Итак — поехали!
Сам результат работы выглядит так:
а увидеть и пощупать его ручками вы можете по ссылке. Что сделано?
1. Визуальная часть
2. Подключена API Google Translate (как получить API-код — опишу позднее)
3. Сделан php-скрипт, который обрабатывает содержимое формы на одном языке, и переводит это самое содержимое на следущие языки: английский, немецкий, французский (я просто хочу блог адаптировать к этим языка в дополнение к основному русскому, потому и возникла идея подобного учебного проекта. Еще используется украинский язык, но т.к. украинский язык для меня такой же родной, как и русский — переводчиком не пользуюсь 🙂 ).
Теперь более подробно:
1. Визуальная часть:
В основе — обычная страница на html, привязан фавикон. В двух слоях global_div и central_div расположена форма, внутри которой — табличка 🙂 Имеется textarea для ввода текста на русском языке. Специально для сохранения исходного текста после перевода добавил проверку на наличие cookie — если она имеется, то подразумевается, что перевод уже сделан (кука геренируется только после отработки скрипта перевода) и в textarea вставляется исходный текст. Выглядит это следующим образом:
if(isset($_COOKIE['ru_text']) == True) { $ru_text = $_COOKIE['ru_text']; } else { $ru_text = ''; }
аналогичный механизм используем для проверки textarea других языков — если кука есть, то берем значение куки (в данном случае — уже результат перевода) и вставляем в textarea. Если что — вставка в textarea выглядит следующим образом:
187279262867016a37b4b6c_000001
Сам фон страницы сделан с использованием css-стилей. Тут вообще все просто — в основном использовал радиальный градиент и закругленные углы в кнопках:
background: radial-gradient(white, lightgray); border-radius: 5px;
остальное все — ерунда в виде теней и реакции на мышку (если интересно — все стили доступны здесь)
С визуальной частью разобрались, теперь более интересное — подключение API и отправка-обработка данных.
За работу с переводом у меня отвечает следующий код:
$text = $_POST['ru_text']; $apiKey = 'AIzaSyCxuVe4IySjQZuvK0SvELwKv47dntXssRXs'; // Английский перевод $url = 'https://www.googleapis.com/language/translate/v2?key='.$apiKey.'&q='.rawurlencode($text).'&source=ru&target=en'; $handle = curl_init($url); curl_setopt($handle, CURLOPT_RETURNTRANSFER, true); $response = curl_exec($handle); $response_decode = json_decode($response, true); $en_answer = $response_decode['data']['translations'][0]['translatedText']; // Немецкий перевод $url = 'https://www.googleapis.com/language/translate/v2?key='.$apiKey.'&q='.rawurlencode($text).'&source=ru&target=de'; $handle = curl_init($url); curl_setopt($handle, CURLOPT_RETURNTRANSFER, true); $response = curl_exec($handle); $response_decode = json_decode($response, true); $de_answer = $response_decode['data']['translations'][0]['translatedText']; // Французский перевод $url = 'https://www.googleapis.com/language/translate/v2?key='.$apiKey.'&q='.rawurlencode($text).'&source=ru&target=fr'; $handle = curl_init($url); curl_setopt($handle, CURLOPT_RETURNTRANSFER, true); $response = curl_exec($handle); $response_decode = json_decode($response, true); $fr_answer = $response_decode['data']['translations'][0]['translatedText']; setcookie('ru_text', $text, time() + 3); setcookie('en_text', $en_answer, time() + 3); setcookie('de_text', $de_answer, time() + 3); setcookie('fr_text', $fr_answer, time() + 3); header('Location: multitranslator.php');
разберем его подробнее:
1. Создаем переменную $text, которая состоит из содержимого $_POST
2. Указываем, что переменная $apiKey у нас — имеет значение… там куча буквицифр
3. Формируем рабочую $url, которая состоит из:
— основной ссылки на Google-переводчик в формате API + наше значение API + наша переменная, которая содержит исходный текст (тут важно подчеркнуть, что мы этот текст должны использовать с rawurlencode, благодаря чему текст останется просто текстом, а не будет преобразован в какие-либо служебные символы
4. Делаем http-запрос с помощью curl-init($url) (открываем сеанс связи)
5. Указываем, что запрос мы делаем в виде строки
6. Создаем переменную, которая состоит из запроса (в качестве запроса у нас идет строка с параметрами)
7. Создаем переменную для ответа — причем указывем, что ответ у нас приходит в виде json-массива.
8. И теперь декодируем ответ — получаем непосредственно текст перевода: $response_decode[‘data’][‘translations’][0][‘translatedText’]
Этот алгоритм используется в переводе на все языки, потому дублировать его я не буду. После того, как мы перевели текст с русского на все нужные языки — отправляем результат перевода в куки: setcookie(‘en_text’, $en_answer, time() + 3), которые живут 3 секунды (а больше-то и не нужно, нам лишь перейти на начальную страницу и получить данные), и возвращаемся на начальную страницу: header(‘Location: multitranslator.php’)
Получилось сумбурно, но надеюсь что-то полезное вы все же почерпнете 🙂 В случае возникновения вопросов пишите на почту, или в Телеграм 🙂
