Google không thu thập thông tin liên kết trong ứng dụng AngularJS

Question

Tôi có ứng dụng AngularJS được tiêm vào trang web của bên thứ ba. Nó chèn nội dung động vào một div trên trang của bên thứ 3. Google đang lập chỉ mục thành công nội dung động này nhưng dường như không thu thập thông tin liên kết trong nội dung động. Các liên kết sẽ giống như thế này trong nội dung động:

<a href="http://www.example.com/support?title=Example Title&titleId=12345">Link Here</a> 

Tôi đang sử dụng tham số truy vấn cho các liên kết chứ không phải là một cấu trúc url thực tế như:

http://www.example.com/support/title/Example Title/titleId/12345 

tôi phải sử dụng các tham số truy vấn vì tôi không muốn trang web của bên thứ ba phải thay đổi cấu hình máy chủ web của họ để chuyển hướng các URL không hợp lệ.

Khi liên kết được nhấp, tôi sử dụng $ locationService để cập nhật url trong trình duyệt và sau đó ứng dụng góc của tôi sẽ phản hồi tương ứng. Chủ yếu nó chỉ hiển thị nội dung có liên quan dựa trên các tham số truy vấn, đặt tiêu đề trang và mô tả meta.

Nhiều bài viết tôi đã đọc sử dụng nhà cung cấp tuyến đường trong angularJS và các mẫu nhưng tôi không chắc tại sao điều này sẽ tạo sự khác biệt cho trình thu thập thông tin?

Tôi đã đọc rằng google nên xem các url với các tham số truy vấn như các trang riêng biệt vì vậy tôi không tin rằng sẽ có vấn đề: https://webmasters.googleblog.com/2008/09/dynamic-urls-vs-static-urls.html

Những điều duy nhất tôi đã không cố gắng là 1. cung cấp một sitemap với các url có tham số truy vấn và 2. thêm liên kết tĩnh từ các trang khác vào liên kết động để giúp google khám phá các trang đó.

Bất kỳ trợ giúp, ý tưởng hoặc thông tin chi tiết nào sẽ được đánh giá cao.

Answer 1

Trình thu thập dữ liệu web có thể đang chạy ở mức ưu tiên cao hơn so với giải thích AngularJS về các liên kết động của bạn khi trình thu thập dữ liệu web tải trang. Sử dụng ng-href làm cho việc diễn giải liên kết động diễn ra ở mức độ ưu tiên cao hơn. Hy vọng nó hoạt động!

Answer 2

Nếu bạn sử dụng url với # Không có gì sau khi hàm băm trong url được gửi đến máy chủ của bạn. Vì các khung Javascript ban đầu đã sử dụng hàm băm làm cơ chế định tuyến, đó là lý do chính khiến Google tạo giao thức này.

Thay đổi url của bạn thành #! thay vì chỉ sử dụng #. .

angular.module ('MyApp') cấu hình ([
'$ locationProvider', function ($ locationProvider) { $ locationProvider.hashPrefix() '!'; } ]);

Answer 3

Đây là cách Google và bing xử lý các cuộc gọi ajax.

documentation được đề cập tại đây.

Tổng quan như đã đề cập trong các tài liệu như sau

Các bánh xích tìm thấy một khá AJAX URL (có nghĩa là, một URL có chứa một #! Băm mảnh). Sau đó, yêu cầu nội dung cho URL này từ máy chủ của bạn ở dạng được sửa đổi đôi chút. Máy chủ web của bạn trả lại nội dung dưới dạng ảnh chụp nhanh HTML, sau đó được xử lý bởi trình thu thập thông tin. Các kết quả tìm kiếm sẽ hiển thị URL gốc.

Hướng dẫn từng bước được hiển thị trong tài liệu.

Kể từ khi Angular JS được thiết kế cho các Side Khách hàng vì vậy bạn sẽ cần phải cấu hình máy chủ Web của bạn để triệu tập một không đầu trình duyệt html để truy cập trang web của bạn và cung cấp một url hashbang sẽ được cung cấp cho URL google đặc biệt.

Nếu bạn sử dụng hashbang URL sau đó bạn sẽ cần phải chỉ thị cho gócứng dụng để sử dụng chúng thay vì băm thường xuyên đánh giá cao

App.config(['$routeProvider', '$locationProvider', function($routes, $location) { 

    $location.hashPrefix('!'); 

    $routes.when('/home',{ 
     controller : 'IndexCtrl', 
     templateUrl : './pages/index.html' 
}); 

như đã đề cập trong các mã ví dụ here

Tuy nhiên nếu bạn không muốn sử dụng hashtag url nhưng vẫn thông báo cho google của nội dung html nhưng vẫn muốn thông báo cho google sau đó bạn có thể sử dụng thẻ meta này như this

<meta name="fragment" content="!" /> 

và sau đó cấu hình các góc sử dụng của htmlUrl

angular.module('HTML5ModeURLs', []).config(['$routeProvider', function($route) { 
    $route.html5Mode(true); 
}]); 

và sau đó phương pháp nào phải được cài đặt thông qua mô-đun

var App = angular.module('App', ['HashBangURLs']); 
//or 
var App = angular.module('App', ['HTML5ModeURLs']); 

Bây giờ bạn sẽ cần một trình duyệt không đầu để truy cập url Bạn có thể sử dụng phantom.js để tải về các nội dung của trang web, chạy các javascript và sau đó đưa nội dung vào một tệp tạm thời.

Phantomrunner.js sẽ nhận bất kỳ url nào làm đầu vào, tải xuống và phân tích cú pháp html thành DOM và sau đó kiểm tra trạng thái dữ liệu.

Kiểm tra từng trang bằng cách sử dụng các chức năng được xác định here

SiteMap cũng có thể được thực hiện cũng như thể hiện trong example

Tính năng tốt nhất này là bạn có thể sử dụng tìm kiếm giao diện điều khiển của xác minh trang web của bạn url sử dụng

Google search console

Full ghi công đi vào trang web và các tác giả đề cập trong này site

.

CẬP NHẬT 1

bánh xích của bạn cần những trang như -

- com/ 
- com/category/ 
- com/category/page/ 

Theo mặc định, tuy nhiên, bộ kiễu góc trang của bạn lên như vậy:

- com 
- com/#/category 
- com/#/page 

Phương pháp tiếp cận 1

Hash nổ cho phép góc để biết được yếu tố HTML để tiêm với JS mà có thể được thực hiện như đã đề cập trước đây, nhưng kể từ khi nó đã được depericated vì thế giải pháp khác sẽ là sau

Cấu hình $locationProvider và thiết lập cơ sở cho các liên kết tương đối

• Bạn có thể sử dụng $locationProvider như đã đề cập trong các docs và thiết lập html5mode true

  $ locationProvider.html5Mode (true);

này cho phép thay đổi góc định tuyến và URL của các trang của chúng tôi mà không làm mới trang

• Đặt cơ sở và người đứng đầu của tài liệu của bạn như <base href="/">

Các $ vị trí dịch vụ sẽ tự động dự phòng phương thức hashbang cho các trình duyệt không hỗ trợ API lịch sử HTML5.

Full ghi công đi vào page và author

Cũng đề cập đến cũng có một số biện pháp khác và các xét nghiệm mà bạn có thể chăm sóc như đã đề cập trong này document

Answer 4

Điều này xảy ra bởi vì crawlers google không thể lấy html tĩnh từ url của bạn vì các trang của bạn được kết xuất động với Javascript, bạn có thể đạt được những gì bạn muốn bằng cách sử dụng:

Vì #! là phản đối, Bạn có thể nói với google mà trang của bạn được trả lại với javascript bằng cách sử dụng thẻ sau đây trong phần đầu

<meta name="fragment" content="!"> 

của bạn On tìm bot google từ khóa trên sẽ yêu cầu các url của bạn với các thông số _escaped_fragment_ truy vấn từ máy chủ của bạn như

http://www.example.com/?_escaped_fragment_=/support?title=Example Title&titleId=12345 

Sau đó, bạn cần phải xây dựng lại url ban đầu của bạn từ _escaped_fragment_ trên máy chủ của bạn và nó sẽ trông như thế này một lần nữa

http://www.example.com/support?title=Example Title&titleId=12345 

Sau đó, bạn sẽ cần phân phát HTML tĩnh cho trình thu thập thông tin cho url đó. Bạn có thể thực hiện việc đó bằng trình duyệt không có đầu để truy cập url. Phantom.js là một tùy chọn tốt để hiển thị trang của bạn bằng cách sử dụng javascript và sau đó cung cấp nội dung vào tệp để tạo ảnh chụp nhanh HTML của trang của bạn. Bạn cũng có thể lưu ảnh chụp nhanh trên máy chủ của mình để thu thập thông tin thêm, vì vậy khi truy cập vào chương trình google, bạn có thể trực tiếp phân phối ảnh chụp nhanh thay vì hiển thị lại trang.