Наша команда-партнер Artmisto
Ten samouczek pokaże, jak indeksować aplikację w wyszukiwarkach. Jako autor uważam, że serwery powinny być całkowicie niezależne od klienta w dobie API. Co przyspiesza rozwój coraz większej liczby klientów. Na barkach wyszukiwarek jest zgoda i nie powinny one dyktować, w jaki sposób sieć jest przechowywana i dostępna.
W 2009 roku Google opublikował pomysł uciekł fragmenty .
Pomysł po prostu stwierdzający, że jeśli wyszukiwarka powinna natknąć się na twoją aplikację JavaScript, to masz uprawnienia do przekierowania wyszukiwarki na inny adres URL, który obsługuje w pełni renderowaną wersję strony (obecne wyszukiwarki nie mogą wykonać dużo JavaScript (niektórzy spekulują że Google Chrome narodził się z wyszukiwarki Google, która chce skutecznie renderować każdą stronę internetową w celu pobrania zawartości ajaxed)).
Jak działa przekierowywanie botów?
Korzystając z nowoczesnych przeglądarek bezgłowych, możemy łatwo zwrócić w pełni renderowane treści na żądanie, przekierowując boty za pomocą naszej konfiguracji serwerów internetowych. Oto obraz wykonany przez Google przedstawiający konfigurację.
Implementacja przy użyciu Phantom.js
Phantom.js jest bezgłową przeglądarką internetową. Zamierzamy skonfigurować serwer node.js, który podał adres URL, będzie w pełni renderował zawartość strony. Następnie przekierujemy boty na ten serwer, aby pobrać poprawną treść.
Musisz zainstalować node.js i phantom.js na pudełku. Następnie uruchom ten serwer poniżej. Istnieją dwa pliki, jeden będący serwerem WWW, a drugi to skrypt fantomowy, który renderuje stronę.
// web.js // Express to nasz serwer WWW, który obsługuje żądania var express = require ('express'); var app = express (); var getContent = function (url, callback) {var content = ''; // Tutaj spawnujemy proces phantom.js, pierwszym elementem tablicy // jest nasz skrypt phantomjs, a drugim elementem jest url var phantom = require ('child_process'). Spawn ('phantomjs', ['phantom- server.js ', url]); phantom.stdout.setEncoding ('utf8'); // Nasz skrypt phantom.js po prostu rejestruje wyjście i // uzyskujemy do niego dostęp poprzez stdout phantom.stdout.on ('data', function (data) {content + = data.toString ();}); phantom.on ('exit', funkcja (kod) {if (kod! == 0) {console.log ('Mamy błąd');} else {// po zamknięciu naszego skryptu phantom.js wywołajmy wywołanie zwrotne //, które wysyła zawartość do strony zwrotnej (treść);}}); }; var respond = function (req, res) {// Ponieważ używamy [P] w htaccess, mamy dostęp do tego nagłówka url = 'http: //' + req.headers ['x-forwarded-host'] + req. params [0]; getContent (url, function (content) {res.send (content);}); } app.get (/(.*)/, odpowiedz); app.listen (3000);Poniższy skrypt to phantom-server.js i będzie odpowiedzialny za pełne renderowanie treści. Nie zwracamy treści, dopóki strona nie zostanie w pełni wykonana. Podłączamy się do nasłuchiwania zasobów, aby to zrobić.
var page = require ('webpage'). create (); var system = require ('system'); var lastReceived = new Date (). getTime (); var requestCount = 0; var responseCount = 0; var requestIds = []; var startTime = new Date (). getTime (); page.onResourceReceived = funkcja (odpowiedź) {if (requestIds.indexOf (response.id)! == -1) {lastReceived = new Date (). getTime (); responseCount ++; requestIds [requestIds.indexOf (response.id)] = null; }}; page.onResourceRequested = function (request) {if (requestIds.indexOf (request.id) === -1) {requestIds.push (request.id); requestCount ++; }}; // Otwórz stronę page.open (system.args [1], function () {}); var checkComplete = function () {// Nie pozwalamy, by trwało to dłużej niż 5 sekund, ale // nie wracamy, dopóki wszystkie żądania nie zostaną zakończone, jeśli ((new Date (). getTime () - lastReceived> 300 && requestCount === odpowiedźCount) || new Date (). getTime () - startTime> 5000) {clearInterval (checkCompleteInterval); console.log (page.content); phantom.exit (); }} // Sprawdźmy, czy strona się zakończy renderowanie var checkCompleteInterval = setInterval (checkComplete, 1);Po uruchomieniu tego serwera po prostu przekierowujemy boty na serwer w konfiguracji serwera WWW naszego klienta.
Przekierowywanie botów
Jeśli używasz apache, możemy edytować .htaccess, tak aby żądania Google były proxy dla naszego pośredniego serwera phantom.js.
RewriteEngine on RewriteCond% {QUERY_STRING} ^ _escaped_fragment _ = (. *) $ RewriteRule (. *) Http: // webserver: 3000 /% 1? [P]Moglibyśmy również dołączyć inne RewriteCond, takie jak agent użytkownika, do przekierowania innych wyszukiwarek, które chcemy indeksować.
Chociaż Google nie użyje tagu _escaped_fragment_, chyba że poinformujemy go o tym, dołączając metatag; <meta name = "fragment" content = "!"> lub używając #! Adresy URL w naszych linkach.
Najprawdopodobniej będziesz musiał użyć obu.
Thomas Davis
Pracuję z kilkoma projektami open source, a także pracuję w branży dronów
https://ajaxdavis.com/
Jak działa przekierowywanie botów?
RewriteEngine on RewriteCond% {QUERY_STRING} ^ _escaped_fragment _ = (. *) $ RewriteRule (. *) Http: // webserver: 3000 /% 1?
