浏览器js调用nodejs模块，以uniq模块的调用为例

最新推荐文章于 2024-05-26 23:20:38 发布

战争迷雾

最新推荐文章于 2024-05-26 23:20:38 发布

阅读量1.4w

点赞数 3

分类专栏： js 文章标签： nodejs 浏览器js调用nodejs模块

本文链接：https://blog.csdn.net/w88193363/article/details/86238624

版权

js 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

1前言

在日常开发中，有时浏览器网页的功能需要调用nodejs中的模块，比如加密解密模块，本文将以nodejs的uniq模块为例，讲解如何在浏览器的js中调用nodejs的uniq模块。

2安装各个必须模块

本文操作所在的系统为centos7

2.1安装node

本文使用编译好的二进制安装

2.1.1下载

wget https://nodejs.org/dist/v10.15.0/node-v10.15.0-linux-x64.tar.xz

2.1.2解压缩

xz -d node-v10.15.0-linux-x64.tar.xz
tar -xvf node-v10.15.0-linux-x64.tar

执行ls查看bin目录下的程序

ls node-v10.15.0-linux-x64/bin

[root@eos-testnet01 src]#ls node-v10.15.0-linux-x64/bin
browserify  node  npm  npx  webpack  webpack-cli  webpack-dev-server

2.1.3环境配置

vi /etc/profile

在文件末尾加入

export NODE_HOME=/usr/local/src/node-v10.15.0-linux-x64
export PATH=$PATH:$NODE_HOME/bin
export NODE_PATH=$NODE_HOME/lib/node_modules

执行下列命令更新配置

source /etc/profile

2.1.4验证

在命令行输入

node -v

v10.15.0

查看到版本即认为完成node的安装

2.2安装npm

一般安装完node，就自带了npm，在命令行输入

npm -v

6.4.1

说明npm安装成功

2.3安装browserify

browserify是打包nodejs模块为浏览器js引用的工具。

npm install -g browserify

命令行输入

browserify --help

返回帮助信息，则说明安装成功

3构建node项目

3.1初始化

选择开发目录创建文件夹

mkdir hellotest
cd hellotest
npm init

然后根据提示输入一些项目信息

3.2安装nodejs的uniq模块

在工作目录执行下列命令即可完成安装

npm install uniq

3.3创建入口文件

执行命令

vim index.js
:wq

无需键入信息，直接保存后退出

3.4打包输出文件

执行命令

browserify -r uniq index.js > bundle.js

4在浏览器端引用

4.1创建index.html并引用bundle.js

<html>
    <meta charset="utf-8">
    <head>
        <tittle>js调用nodejs模块</tittle>
        <script type="text/javascript" src="bundle.js"></script>
        <script type="text/javascript">
            function postStr(){                
                try{
                    var uniq = require('uniq');
                    var nums = [5,2,1,3,2,5];

                    var numsUniq = uniq(nums)
                    console.log(numsUniq);

                    document.getElementById("info").innerHTML=numsUniq;

                }
                catch(err){
                    alert(err.message);
                }
            }
        </script>
    </head>
    <body>
        <form action="">                 
            <p><div id="info">使用uniq函数后数组内容</div> </p>                    
            <p><input type="button" id="btn_post" onclick="postStr()" value="测试调用node函数"/></p>
        </form>
    </body>
</html>

4.2浏览器打开html

index.html文件与bundle.js放在同一目录，然后浏览器打开，单击按钮，执行函数，即可输出uniq函数结果。如下图
单击前
在这里插入图片描述
单击后

参考文献
[1]:Browserify官网地址
[2]:Cent OS6.5 安装nodeJS（分分钟搞定）
[3]:browserify使用手册

战争迷雾

关注

3
点赞
踩
15

收藏

觉得还不错? 一键收藏
6
评论
浏览器js调用nodejs模块，以uniq模块的调用为例

1前言在日常开发中，有时浏览器网页的功能需要调用nodejs中的模块，比如加密解密模块，本文将以nodejs的uniq模块为例，讲解如何在浏览器的js中调用nodejs的uniq模块。2安装各个必须模块本文操作所在的系统为centos72.1安装node本文使用编译好的二进制安装2.1.1下载wget https://nodejs.org/dist/v10.15.0/node-v1...
复制链接

扫一扫