小工具      在线工具  汉语词典  css  js  c++  java

使用NodeJS抓取产品信息

JavaScript 额外说明

收录于:93天前

使用NodeJS作为后端服务器,抓取一些产品信息,进行解析,然后使用react+webpack+antd作为前端界面进行展示。

抓取到的商品信息在前端界面显示如下:


后台代码如下:

// 引入依赖
var express = require('express');
var utility = require('utility');
var eventproxy = require('eventproxy');
var superagent = require('superagent');
var cheerio = require('cheerio');
var url = require('url');

// 建立 express 实例
var app = express();

var Url = 'https://www.example.cn/dp/sr=8-1&keywords=3%AB&th=1';

app.get('/queryAmazonData', function (req, res, next) {
    // res.setHeader('200', 'Content-Type', 'text/html;charset=utf-8');
    // res.send('Hello World1');
    // res.end('sww');
    Url = req.query.url;
    console.log(Url);
    superagent.get(Url)
    .end(function (err, response) {
        if (err) {
          return console.error(err);
        }
        var topicUrls = [];
        var $ = cheerio.load(response.text);
        $('#twisterJsInitializer_feature_div>script').each(function () {
            var script = $(this).html();
            // script就是js代码了
            // console.log(script);
            var str = script.replace("P.register('twister-js-init-dpx-data', function()", '');
            str = str.replace('var dataToReturn =', '');
            var array = str.split(',\n');
            // console.log(array);

            var ljlistItem = '';
            for (var i in array) {
                var data = array[i];
                if ( data.indexOf('dimensionToAsinMap') != -1){
                    // console.log(data);
                    // 7.将商品id的str组合转化为dict
                    ljlistItem = data.trim().replace('"dimensionToAsinMap" : ', '');
                }
            }
            // 将商品id的str组合转化为dict
            var dict = JSON.parse(ljlistItem);
            // console.log(dict);

            // 8函数替换,将商品的id替换掉
            var strlist = '';
            var splitstr = '';

            if(Url.indexOf('dp/') != -1){
                strlist = Url.split('dp/'); //'dp/'
                splitstr = 'dp/';
            } else if (Url.indexOf('d/') != -1){
                strlist = Url.split('d/');  // 'dp/'
                splitstr = 'd/';
            }
 
            // console.log(`strlist:${strlist}\n`);
            var ljlength = strlist[1].indexOf('/');
            var ljstr = strlist[1];
            // console.log(`ljlength:${ljlength}\n`);
            // console.log(`ljstr:${ljstr}\n`);
            strlist[1] = ljstr.slice(10,ljstr.length);
            // console.log(strlist[1]);

            // 9.遍历字典,根据id来拼接商品详情的url
            var urlArray = [];
            for(var key in dict) {
                // console.log(`value:${dict[key]}\n`);
                var  tempurl = strlist[0] + splitstr + dict[key] + strlist[1] + '&th=1&psc=1';
                console.log(`5.每个商品的跳转url:${tempurl}\n`);
                urlArray.push(tempurl);
                // yield Request(tempurl, callback=self.parse_productdetail);
            }

            var ep = new eventproxy();
            //接收到全部的商品信息后,返回给前端的接口
            ep.after('topic_html', urlArray.length, function (topics) {
            topics = topics.map(function (topicPair) {
                var topicUrl = topicPair[0];
                var topicData = topicPair[1];
                return ({
                    // topicUrl: topicUrl,
                    topicData: topicData,
                });
            });
    
            console.log('final:');
            console.log(topics);
            // res.setHeader('200', 'Content-Type', 'text/html;charset=utf-8');
            // res.send('Hello World1');
            res.send(topics);//返回商品信息给前端
            // document.write(localStorage.topics);
            });

            urlArray.forEach(function (topicUrl) {
                superagent.get(topicUrl)
                    .end(function (err, response1) {
                    // console.log('fetch ' + topicUrl + ' successful');

                    var $ = cheerio.load(response1.text);
                    //商品价格
                    price = $('#priceblock_ourprice').text().trim();
                    //商品名称
                    name = $('#productTitle').text().trim();
                    //尺寸
                    size = $('#dropdown_selected_size_name>span>span').text().trim();
                    //颜色
                    color = $('#variation_color_name>div>span').text().trim();
                    // 打折信息
                    discount = $('#applicable_promotion_list_sec>table>tr>td>span[3]>span>a[2]>span>span>span').text().trim();

                    //3.提取商品运费和税费 tbody不用添加
                   fee = $('#ags_shipping_import_fee').text().trim();

                    //4.海外购标识
                    overseapurchas = $('#agsBadge').attr('src');
                    if (overseapurchas != ''){
                        overseapurchas = 'haitao'
                    }

                    //5.根据是否有海外购的标识来选择prime的获取路径
                    prime = '';
                    if (overseapurchas.trim() == ''){ //没有海外购
                        //国内-免运费
                        prime = $('#price-shipping-message>i>i>span').text().trim();
                    } else if (overseapurchas.trim() != '') { //有海外购标识
                        //海外购-免运费
                        prime = $('#price-shipping-message>div>i>i>span').text().trim();
                    }
                    if (prime.length > 0){
                        prime = 'prime';
                    }
                      
                    // console.log(`price:${price}\n`);
                    // console.log(`name:${name}\n`);
                    // console.log(`size:${size}\n`);
                    // console.log(`color:${color}\n`);
                    // console.log(`discount:${discount}\n`);
                    // console.log(`fee:${fee}\n`);
                    // console.log(`overseapurchas:${overseapurchas}\n`);
                    // console.log(`prime:${prime}\n`);
                    
                    // 输出model信息
                    const object = {};
                    object.price = price;
                    object.name = name;
                    object.size = size;
                    object.color = color;
                    object.discount = discount;
                    object.overseapurchas = overseapurchas;
                    object.fee = fee;
                    object.prime = prime;
                    // 获取到全部的商品信息后发送出去(topic_html)
                    ep.emit('topic_html', [topicUrl, object]);
                    });
                });
        });

    });
});

// app.use(function(req, res, next) {
//     res.status(404).send('Sorry cant find that!');
// });

app.get('/index.html', function (req, res) {
    res.sendFile( __dirname + "/" + "index.html" );
 });

app.get('/process_get', function (req, res) {
 
    // 输出 JSON 格式
    var response = {
        "first_name":req.query.first_name,
        "last_name":req.query.last_name
    };
    // document.write(localStorage.topics);
    console.log(response);
    // res.end(JSON.stringify(localStorage.topics));
 });

//  app.all('*', function(req, res, next) {
//     res.header("Access-Control-Allow-Origin", "*");
//     res.header("Access-Control-Allow-Headers", "X-Requested-With");
//     res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");
//     res.header("X-Powered-By",' 3.2.1')
//     res.header("Content-Type", "application/json;charset=utf-8");
//     next();
// });

app.listen(3000, function (req, res) {
   console.log('app is running at port 3000');
});

前端代码:

query(params) { // 请求nodejs后端接口拿到抓取到的商品信息
    // const current = (params && params.current) || 1;// 页数,默认1,可传入指定(点击分页时会传入)
    // this.state.pagination.current = current;// 点击查询后 返回第一页
    // const pageSize = (params && params.pageSize) || this.state.pagination.pageSize;// 条数,一页

    const a = { ...params };
    // a.pageSize = pageSize;
    // a.pageNo = current;

    this.setState({ ruleLoading: true });
    queryData(a).then((data) => {
      if (data) {
        let array = [];
        for (let i = 0; i < data.length; i++) {
          const temp = data[i].topicData;
          array.push(temp);
        }
        this.setState({ list: array,
          ruleLoading: false });
      }
      this.setState({ ruleLoading: false });
    });
    // console.log(data);
  }
  render() {//UI展示
    const { modalVisible, ruleLoading, description } = this.state;
    const pagination = {
      total: parseInt(this.state.pagination.total, 100),
      showTotal: total => `共 ${total} 条`,
      current: this.state.pagination.current,
      // showSizeChanger: true,
      showQuickJumper: true,
      onShowSizeChange: (current, pageSize) => {
        this.state.pagination.pageSize = pageSize;
      },
      onChange: (current) => {
        const form = this.props.form;
        const a = form.getFieldValue('businessTypeName');
        const b = form.getFieldValue('status');
        const params = {};
        params.businessTypeName = a;
        params.status = b;
        params.current = current;
        this.query(params);
      },
    };

    const columns = [
      {
        title: '商品名称',
        dataIndex: 'name',
        width: '25%',
      },
      {
        title: '价格',
        dataIndex: 'price',
      },
      {
        title: '运费+税费',
        dataIndex: 'fee',
        width: '20%',
      },
      {
        title: '折扣',
        dataIndex: 'discount',
      },
      {
        title: '海外',
        dataIndex: 'overseapurchas',
      },
      {
        title: 'prime',
        dataIndex: 'prime',
      },
      {
        title: '尺寸',
        dataIndex: 'size:',
      },
      {
        title: '颜色',
        dataIndex: 'color',
      },
    ];
    return (
      <PageHeaderLayout
        title="数据查询"
      >
        <Card>
          <div className={styles.tableList}>
            <div className={styles.tableListForm}>
              {this.renderForm()}
              {/* {this.renderAdvancedForm()} */}
            </div>
            <Table
              loading={ruleLoading}
              dataSource={this.state.list}
              columns={columns}
              pagination={pagination}
              onChange={this.handleTableChange}
            />
          </div>
        </Card>

      </PageHeaderLayout>
    );
  }
}



. . .

相关推荐

额外说明

GatewayWorker-thinkphp-小程序 wss:// 配置 宝塔

废话不多说 测试 结果 composer require workerman/workerman TP 根目录 #!/usr/bin/env php <?php define('APP_PATH', __DIR__ . '/applicat

额外说明

高数刷题笔记

在标准解答的时候可以用极限趋向于0去证明。上上图 性质解答则可以直接略去高阶,只看低阶。 先用等价无穷小将sin x换为x再看! 反函数此题可以用洛必达,也可以像这样去换自变量。 1-cosx=2sin^2(x/2)=x^2/2; 圈2表示了sinx ,

额外说明

【Java 数据结构 & 算法】宁可累死自己, 也要卷死别人 17 KMP 算法

【Java 数据结构 & 算法】⚠️宁可累死自己, 也要卷死别人 17⚠️ KMP 算法 概述 KMP 算法 部分匹配表 KMP 算法实现 概述 从今天开始, 小白我将带大家开启 Java 数据结构 & 算法的新篇章. KMP 算法 KMP (Knuth

额外说明

[Eigen中文文档] 在 CMake 项目中使用 Eigen

文档总目录 英文原文(Using Eigen in CMake Projects) Eigen提供了CMake支持,使得该库可以轻松地在CMake项目中使用。 注意:启用这个功能需要CMake 3.0(或更高版本)。 Eigen提供了一个CMake示例,

额外说明

vue缓存keep-alive不生效

今天在做keep-alive缓存时发现有的页面不生效,解决之后留个文章纪念下 切换标签不生效 <keep-alive :include="cacheList" > <router-view ></router-view> </keep-alive>

额外说明

Git冲突:# If this is not correct, please remove the file # .git/MERGE_HEAD

问题 Git提交发生了冲突,是我不曾修改的部分发生的冲突,所以具体不清楚怎么去描述,先看截图吧 部分翻译截图: 解决问题 看到问题和翻译,明显可以看到,git告诉我们冲突已经修复了,但是我还停留在修复冲突的那个阶段,但是呢我实际看到的还是有冲突,这时呢,

额外说明

【Java 进阶篇】JDBC PreparedStatement 详解

在Java中,与关系型数据库进行交互是非常常见的任务之一。JDBC(Java Database Connectivity)是Java平台的一个标准API,用于连接和操作各种关系型数据库。其中,PreparedStatement 是 JDBC 中一个重要的

额外说明

Java代码弱点与修复之——Se: Incorrect definition of Serializable class(可序列化类的定义不正确)

弱点描述 Se: Incorrect definition of Serializable class,可序列化类的定义不正确。 该弱点属于低风险。 “Se” 指的就是"Serializable",Serializable是Java的一个接口,用于标识J

额外说明

ubuntu虚拟机安装包括jdk,mysq,tomcat环境

Ubuntu20.04虚拟器安装 安装过程需要包括配置静态IP、启动SSH远程连接和文件传输、配置常用的jdk、python等编程语言的开发环境、安装和配置MySQL数据库、将Ubuntu配置为Web服务器。使用的ubunt版本是20.04。 配置静态i

ads via 小工具