Python

DiscuzQ SSR配置思路

文凯

【一】. 原理

国内主要使用的搜索引擎还是百度。百度的机制还是传统的爬虫机制。在googleSpider上已经有了调整。Google的爬虫可以等待页面渲染成功后进行爬取内容。所以，我们要针对国内的各种爬虫进行优化。让他不需要等待，就可以直接快速爬取页面。

图片

【二】. SSR解决办法是什么

SSR 别搞的那么高大上，本质解释：服务器侧渲染—— service side render。服务端完成部份的渲染。

原理如下：

图片

【三】. 官方的解决方式

爬虫是有名字的，名字写在浏览器头上，叫作UserAgent：baiduSpider；
如果是爬虫，就走Nginx反向代理到：serverless的页面上去；
如果是正常的人：就走nginx 访问正常的网页。

图片

【四】. 开启步骤

有腾讯云账号API 信息不用说了，其他地方很多教程，如果有需要我再完善和贴出来；
把这两个给写上（ServerLess 开通步骤待会儿说）：

图片

【五】. nginx配置和补充官方说明

官方的Nginx文档写的不好。

nginx.conf的配置还是相对复杂的，对于很多小白来说不太友好。

如果不懂，不用懂按我说的做即可。

我的文件如下，需要你进行复制，这几天我想办法把备注（nginx的#号注释，被识别成了dzq的话题）：

map $http_user_agent $ua_device {
  default 'desktop';
  ~*Baiduspider|Yisouspider|Googlebot|spider|Spider|360Spider|bingbot|Sosospider/i 'bot';
  ~*(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge\ |maemo|midp|mobile.+firefox|netfront|opera\ m(ob|in)i|palm(\ os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows\ ce|xda|xiino/i 'mobile';
  ~*android|ipad|playbook|silk/i 'tablet';
}

server
    {
        listen 80;
  
        server_name www.jindachang.com cdn-aliyun-www.jindachang.com;
        index index.html index.htm index.php default.html default.htm default.php;
        root  /home/wwwroot/www.jindachang.com/public;


        include enable-php-pathinfo.conf;

        set $dst $uri;
        set $dst2 $uri/;
        set $dst3 /index.php?$query_string;

        if ($ua_device = 'bot') {
                set $dst2 "";
                set $dst3 @proxypass;
        }

        location / {
                #try_files $uri $uri/ /index.php?$query_string;
                try_files $dst $dst2 $dst3;
        }

         location @proxypass {
            proxy_pass http://service-kenft7b9-1308719024.bj.apigw.tencentcs.com;
            proxy_connect_timeout 10;
            proxy_send_timeout 15;
            proxy_read_timeout 20;
            proxy_buffer_size 1M;
            proxy_buffers 8 1M;
            proxy_busy_buffers_size 1M;
            proxy_temp_file_write_size 1M;
        }

【六】. Nginx配置文件分断解释

下面这一段主要是说是浏览器的header中的UserAgent。
map是nginx里面的指令，主要的作为是建立映射关系，必须要写到 server{ }区域以外。
不用考虑映射是啥意思，如果你想深入了解，看一下nginx官方手册。

map $http_user_agent $ua_device {
  default 'desktop';
  ~*Baiduspider|Yisouspider|Googlebot|spider|Spider|360Spider|bingbot|Sosospider/i 'bot';
  ~*(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge\ |maemo|midp|mobile.+firefox|netfront|opera\ m(ob|in)i|palm(\ os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows\ ce|xda|xiino/i 'mobile';
  ~*android|ipad|playbook|silk/i 'tablet';
}

下面这一段要注意，一个server中只能有一段 location / { }，我们将内容进行合并调整，调整为：

location / {
                #try_files $uri $uri/ /index.php?$query_string;
                try_files $dst $dst2 $dst3;
        }

下面这一段是设置nginx里面的变量：

set $dst $uri;
        set $dst2 $uri/;
        set $dst3 /index.php?$query_string;

下面这一段是说明，如果是正常浏览器走 location /{}，如果是爬虫则执行反向代理：

if ($ua_device = 'bot') {
                set $dst2 "";
                set $dst3 @proxypass;
        }

下面是反向代理的配置，proxy_pass后面的服务器地址一定要填为你未来的serveless的URL：


 location @proxypass {
            proxy_pass http://service-kenft7b9-1308719024.bj.apigw.tencentcs.com;
            proxy_connect_timeout 10;
            proxy_send_timeout 15;
            proxy_read_timeout 20;
            proxy_buffer_size 1M;
            proxy_buffers 8 1M;
            proxy_busy_buffers_size 1M;
            proxy_temp_file_write_size 1M;
        }

【七】. 开通servless

实验中

【八】. 触发机制和应用模板的选择（已实验成功）

需要使用serverless 创建的是Prerender 服务。

我们先说一下，什么是Prerender？

使用Prerender做网站预渲染，可以将网站页面渲染之后再返回给网络爬虫，间接完成网页的解析。Prerender相较于其他的解决方案，配置相对要简单一些，不用修改项目源码，代码零侵入，是一个不错的解决方案。

官方还没有直接提供Prerender的 serverless模板。

Prerender 有PHP的、还有node.js，感觉未来实现会在node.js中实现。

我的Prerender在自己服务器上实验通了。还未使用官方的 serverless（实验中）。

【九】. Prerender 实现步骤

服务器：Linux
需要提前安装：Chrome

9.1 安装chrome

在命令行下安装chrome 使用yum 或者 apt无法安装，因为有一个墙。
建议 rpm安装或者dpkg安装

chrome启动有一些依赖。

由于，建议提前使用yum或者apt将依赖安装好，需要安装的依赖如下：

 libasound2 libatk1.0-0 libc6 libcairo2 libcups2 libdbus-1-3 libexpat1 libfontconfig1 libgcc1 libgconf-2-4 libgdk-pixbuf2.0-0 libglib2.0-0 libgtk-3-0 libnspr4 libpango-1.0-0 libpangocairo-1.0-0 libstdc++6 libx11-6 libx11-xcb1 libxcb1 libxcursor1 libxdamage1 libxext6 libxfixes3 libxi6 libxrandr2 libxrender1 libxss1 libxtst6 libnss3

9.2 启动chrome测试

如果启动正常，没报错，说明安装成功

google-chrome --headless --no-sandbox --disable-gpu  --remote-debugging-port=9222  --hide-scrollbars

9.3 安装prerender

export PRERENDER_SERVICE_URL=http://localhost:3000

$ git clone https://github.com/prerender/prerender.git
$ cd prerender
$ npm install
$ node server.js

node server.js 这一步会报错。

9.4 修改 server.js


// 修改var server = prerender();

// 改为下面一段代码
var server = prerender({
  chromeFlags: ['--no-sandbox', '--headless', '--disable-gpu', '--remote-debugging-port=9222', '--hide-scrollbars']
});

再次启动

9.5 结果实验

curl http://localhost:3000/render?url=https://www.jindachang.com/

图片

9.6 配置服务

  1. 将上面的nginx配置进行修改；
  2. 将3000端口的防火墙进端口解禁；
  3. 设置token;
  4. 使用chrome useragent 头测试访问结果；
  5. 实验成功；

模拟 BaiduSpider 的UserAgent方法：

图片

【十】 写在最后

官方的serverless 的应用模板我猜还有准备中。
对docker还挺熟悉，对于serverless接触使用还不太熟悉。 serverless的腾讯云版本我也在实验中。

未来官方的，实现方式应该有两种：

  1. dzq 的命令行，与本地的api打通，进行dzq的ssr 内容转发到serverless上来，进行反向代理；
  2. prerender 进行读取后的反向代理。

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注