2016-01-22 2 views
6

Ich habe eine Angular-App, die ich in der Produktionsumgebung einrichten möchte. Wie ich gelesen habe, ist Google jetzt in der Lage, durch AJAX-Seiten zu kriechen. Ich überprüfe, wie ich mit Fetch als Google-Dienst arbeiten würde. Obwohl die Startseite in allen gängigen Browsern richtig gerendert wird, gibt Fetch as Google eine leere Seite zurück, auf der keine der Direktiven von Angular kompiliert wurde, und keine Fehler. Ich verwende den HTML5-Modus und ui-router. Dateien werden vom node.js App Server geliefert (Ich habe versucht, Dateien von nginx zu liefern und das Ergebnis war das gleiche) und alle Dateien sind erlaubt von robots.txt. Skripte werden verkettet und minimiert. In der Konsole sind keine Fehler aufgetreten.Abrufen, da Google die Anwendung Angular.js nicht darstellt

-Code zurück durch Abruf wie durch Google Service: doctype html>

<head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <base href="/"> 
    <title ng-bind="$state2.current.data.pageTitle || 'xxx'"></title> 
    <meta name="description" content="{{$state2.current.data.description}}"> 
    <meta name="keywords" content="{{$state2.current.data.keywords}}"> 
    <meta name="viewport" content="width=device-width"> 
    <!-- Place favicon.ico and apple-touch-icon.png in the root directory --> 
    <link rel="stylesheet" href="app/b91daaea.vendor.css"> 
    <link rel="stylesheet" href="bower_components/malihu-custom-scrollbar-plugin/jquery.mCustomScrollbar.css" /> 
    <link rel="stylesheet" href="app/dbc6e533.app.css"> 
</head> 

<body iact-set-body="{{$state2.current.name}}" ng-cloak ng-controller="IndexCtrl as Index" ng-class="{'register-page' : $state2.current.name === 'register.one'}"> 
    <iact-progress-bar ng-if="$state2.current.name === 'main.post'" class="progress-bar progress-bar--page"></iact-progress-bar> 
    <div class="alert-block" alert-box></div> 


    <loader ng-show="showLoader"></loader> 
    <div class="ui-view-container"> 
    <div ng-cloak ui-view></div> 
    <div ng-cloak ui-view="layer" class="ui-view-layer"></div> 
    </div> 


    <!--[if lt IE 7]> 
    <p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade 
     your browser</a> to improve your experience.</p> 
    <![endif]--> 
    <!--[if lt IE 9]> 
    <script src="bower_components/es5-shim/es5-shim.js"></script> 
    <script src="bower_components/json3/lib/json3.min.js"></script> 
    <![endif]--> 
    <script src="https://cdn.socket.io/socket.io-1.3.7.js"></script> 
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyB5s1GO-SwKumRL-es-SHnGYwom55LpJyM&libraries=places"></script> 
    <script src="app/9b5d1095.vendor.js"></script> 
    <script src="app/b49bc91c.app.js"></script> 
</body> 

</html> 

Gibt es etwas, das falsch gemacht wurde, oder sollte ich nur für Crawler mit Pre-Rendering?

+0

Ich habe das gleiche Problem, das seltsame ist, wenn ich holen und rendern google zeigt mir die Seiten "wie Google sieht es", was verwirrend ist, wenn es nur holt (und speichert im Cache btw .. .) ohne das Laden der Vorlage. – FireBrand

+0

Mögliches Duplikat von [Fetch as Google Webmaster-Tools] (http://stackoverflow.com/questions/29662999/fetch-as-google-webmaster-tools) –

Antwort

-2

Nachforschungen vor kurzem, fand ich, dass die überwältigende Meinung im Internet ist, dass wenn Sie eine AngularJS App haben und Sie von Google gecrawlt und indexiert werden möchten, benötigen Sie etwas wie prerender oder brombone, generieren HTML-Snapshots, statische Seiten Ihrer Website, damit Suchmaschinen sie indexieren können.

Wenn Sie über das Geschäft der SEO-Optimierung sehr ernst sind, denke ich, dass Sie sehr vorsichtig sein sollten, diese Werkzeuge zu verwenden. Zuerst sagten sie, dass es eine Spezifikation von Google verwendet, die Ajax Crawling definiert. Aber diese Spezifikation ist veraltet.

Vorrendering kann zu Tarnbildung führen. Cloaking findet statt, wenn eine Website anderen Nutzern Inhalte anzeigt als Suchmaschinen. Zumindest ist Google schnell mit Strafen, wenn Sie cloaking sind. Bitte testen, testen und testen Sie jede Ihrer Websites für Cloaking, vor allem wenn Sie zwei verschiedene Versionen davon anbieten!

Google sagt: Wenn Sie Ihre Website nach versteckten Texten oder Links durchsuchen, suchen Sie nach etwas, das für Besucher Ihrer Website nicht leicht sichtbar ist.

Sie müssen Google keine anderen oder bereits gerenderten Inhalte bereitstellen. Solange Sie die üblichen SEO-Konventionen in Ihrer App einhalten, kann Google Ihre AngularJS-App problemlos crawlen, rendern und indizieren. Es braucht auch etwas Zeit zum Indexieren.

Haftungsausschluss: Dies ist ein theoretisches Konzept. Tests haben gezeigt, dass Google eine pure-AngularJS-Website problemlos crawlen, rendern und indizieren kann, wenn sie ordnungsgemäß eingerichtet ist. Andere Suchmaschinen und Crawler sind jedoch wahrscheinlich nicht in der Lage, Ihren Inhalt korrekt zu crawlen. In einer reinen JS-Umgebung werden Sie nicht von Bing, Yahoo oder Yandex indiziert; und soziale Netzwerke wie Facebook, Twitter, Pinterest und viele andere werden keine Ahnung haben, worum es auf Ihren Seiten geht. Im Jahr 2016 sollten Sie keine reine JS-Architektur in einer Produktionsumgebung implementieren, wenn Sie auf Datenverkehr aus externen Quellen Wert legen.

Verwandte Themen