javascript - Facebook OG Meta 与 Angular 和 Node

Question

我正在尝试让我的 Angular/Node 应用程序渲染动态开放图元内容。

我一直在尝试遵循本教程 http://www.codewarmer.com/posts/1394433236-configuring-angularjs-nodejs-for-search-bots# !

我在使用 phantom 处理 Node 时遇到一些问题，我的问题似乎与此类似 Error message when using PhantomJS, breaks at random intervals

除了我的错误不是随机发生的，它总是发生。

编辑:这是我的代码

在我的 server.js 中，我需要一个基于上述图创建的名为 PhantomHandler.js 的模块，它的名称如下。

var crawler = require('./modules/PhantomHandler');

这就是 PhantomHandler.js 的样子:

    var phantom = require('phantom');
var models = require('../models');

mongoose = require('mongoose');
Snapshot = models.Snapshot;

url = require('url');
var baseUrl = 'my url';

function crawlSite(idx, arr, page, callback) {
    crawlUrl(arr[idx], page, function(data) {
        data.links.forEach(function(link) {
            if (arr.indexOf(link) < 0)
                arr.push(link);
        });
        Snapshot.upsert(data);

        if (++idx === arr.length)
            callback();
        else
            crawlSite(idx, arr, page, callback);
    });
}

function startPhantom(cb) {
    phantom.create(function(ph) {
        phInstance = ph;
        ph.createPage(function(page) {
            phPage = page;
            cb(ph, page);
        });
    });
}

function crawlUrl(path, page, cb) {
    uri = url.resolve(baseUrl, path);

    page.open(uri, function(status) {
        var evaluateCb = function(result) {
            result.path = path;
            cb(result);
        };
        //Timeout 2000ms seems pretty enough for majority ajax apps
        setTimeout(function() {
            if (status == 'success')
                page.evaluate(function() {
                    var linkTags = document.querySelectorAll('a:not([rel="nofollow"])');
                    var links = [];
                    for (var i = 0, ln; ln = linkTags[i]; i++)
                        links.push(ln.getAttribute('href'));

                    return {
                        'links': links,
                        'html': document.documentElement.outerHTML
                    };
                }, evaluateCb);
        }, 2000);
    });
}

exports.crawlAll = function(callback) {
    startPhantom(function(ph, page) {
        crawlSite(0, ['/'], page, function() {
            ph.exit();
            callback();
        });
    });
};

exports.crawlOne = function(path, callback) {
    startPhantom(function(ph, page) {
        crawlUrl(path, page, function(data) {
            Snapshot.upsert(data);
            ph.exit();
            callback();
        });
    });
};

当我运行此代码时，我的确切错误是:

    phantom stderr: 'phantomjs' is not recognized as an internal or exte
,
operable program or batch file.


assert.js:92
  throw new assert.AssertionError({
        ^
AssertionError: abnormal phantomjs exit code: 1
    at Console.assert (console.js:102:23)
    at ChildProcess.<anonymous> (path to node modules\node_modules\phantom\phantom.js:150:28)
    at ChildProcess.emit (events.js:98:17)
    at Process.ChildProcess._handle.onexit (child_process.js:809:12)

我的问题:这是让 Angular 更好地使用 Facebook OG 的最佳最简单方法吗？如果是的话，其他人可以确认他们是否已设法使该技术正常工作，而不会出现如上所述的幻象抛出断言错误。

看起来这应该是一个相对常见的工作，我很惊讶我还没有找到一个关于如何让它工作的很好的直接教程，除非我只是没有正确地查看:s

谢谢

Answer 1

好的，

因为我的问题本质上是“让 Angular 和 Node 以正确的页面元响应 Facebook 的最佳方式是什么”。我现在可以发布我的答案。

1. 如上所述，我认为使用上述 phantom.js 方法需要安装 phantom 并在 node.js 服务器上作为单独的进程运行。 (谁能证实或否认这一点？)

2. 对于我的情况，我只是希望用户能够将网站的链接发布到 Facebook 上，并让 Facebook 使用开放图元返回一个美观的链接。

考虑到这一点，我决定跳过上面教程中解决方案中的 phantom.js 步骤。相反，我滚动了一些代码，这些代码本质上是在用户点击页面时将 HTML 片段保存到数据库中。 HTML 片段仅包含 Facebook 所需的元标记。然后，我使用上述教程的最后一部分将 Facebook 机器人定向到我保存的 HTML 代码段。

看起来效果不错。