当前位置：首页 > news >正文

【人工智能】利用TensorFlow.js在浏览器中实现一个基本的情感分析系统

news 2026/2/8 15:12:55

使用TensorFlow.js在浏览器中进行情感分析是一个非常实用的应用场景。TensorFlow.js 是一个用于在JavaScript环境中训练和部署机器学习模型的库，使得开发者能够在客户端直接运行复杂的机器学习任务。对于情感分析，我们可以使用预先训练好的模型来识别文本中的积极、消极或中性情感。

下面我会给你一个简化的项目计划，包括原理和方法、技术栈的选择、模型的设计，以及一个简单的示例代码，来演示如何使用TensorFlow.js实现一个基本的情感分析器。

一、项目原理和方法

1.情感分析原理

特征提取：将文本转换成数值特征，常见的方法有词袋模型、TF-IDF 和词嵌入（如Word2Vec、GloVe）。
模型训练：使用监督学习算法，如逻辑回归、支持向量机、递归神经网络 (RNN) 或者长短期记忆网络 (LSTM) 来分类文本情感。
模型部署：将训练好的模型部署到生产环境，在本例中是在浏览器中使用TensorFlow.js。

2.使用的方法

预训练模型：可以使用预训练的模型，例如使用BERT或其他Transformer模型进行情感分类。
自定义模型：也可以从头开始训练一个简单的模型，例如使用LSTM进行文本分类。

二、技术栈

前端：HTML, CSS, JavaScript
后端（可选）：Node.js + Express
机器学习库：TensorFlow.js
模型训练：TensorFlow.js 或 TensorFlow (Python) 进行模型训练，然后转换为TensorFlow.js格式

三、架构设计

模型训练：在服务器端或本地训练一个简单的情感分析模型。
模型部署：将模型导出为TensorFlow.js格式，并通过HTTP服务提供给客户端。
前端应用：用户输入文本，前端调用TensorFlow.js API进行预测，并显示结果。

四、示例代码

在这个示例中，我们将使用一个简单的LSTM模型来进行情感分析。首先，我们需要创建一个简单的模型并在服务器端训练它，然后将其转换为TensorFlow.js格式，并部署到一个简单的前端应用中。

4.1 训练模型 (Python)

首先，我们需要在Python环境中训练一个模型。这里我们假设已经有一个预处理过的数据集 sentiment_data.csv，其中包含两列：text 和 label（0表示负面，1表示正面）。

import tensorflow as tf
from tensorflow.keras.preprocessing.text import Tokenizer
from tensorflow.keras.preprocessing.sequence import pad_sequences
import pandas as pd# 加载数据
data = pd.read_csv('sentiment_data.csv')
texts = data['text'].values
labels = data['label'].values# 分词器
tokenizer = Tokenizer(num_words=10000, oov_token="<OOV>")
tokenizer.fit_on_texts(texts)
sequences = tokenizer.texts_to_sequences(texts)# 序列填充
padded_sequences = pad_sequences(sequences, padding='post', maxlen=128)# 划分数据集
X_train, X_test, y_train, y_test = train_test_split(padded_sequences, labels, test_size=0.2)# 定义模型
model = tf.keras.Sequential([tf.keras.layers.Embedding(10000, 16, input_length=128),tf.keras.layers.LSTM(64, return_sequences=True),tf.keras.layers.LSTM(32),tf.keras.layers.Dense(1, activation='sigmoid')
])# 编译模型
model.compile(loss='binary_crossentropy', optimizer='adam', metrics=['accuracy'])# 训练模型
model.fit(X_train, y_train, epochs=10, validation_data=(X_test, y_test), verbose=2)# 导出模型
model.save('sentiment_model.h5')

4.2 转换模型到TensorFlow.js

使用TensorFlow.js Converter将模型转换为TensorFlow.js格式。

tensorflowjs_converter --input_format keras sentiment_model.h5 models/sentiment_model

4.3 前端应用

创建一个简单的HTML文件，使用TensorFlow.js进行预测。

<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><title>Sentiment Analysis with TensorFlow.js</title><script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@3.9.0/dist/tf.min.js"></script><script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/universal-sentence-encoder@4.1.0/dist/index.min.js"></script><style>body { font-family: Arial, sans-serif; }#output { margin-top: 20px; }</style>
</head>
<body><h1>Sentiment Analysis Demo</h1><textarea id="inputText" rows="4" cols="50">Enter text here...</textarea><button onclick="analyzeSentiment()">Analyze Sentiment</button><div id="output"></div><script>// Load the modelconst modelUrl = 'models/sentiment_model/model.json';let model;async function loadModel() {model = await tf.loadLayersModel(modelUrl);}// Analyze the sentiment of the input textasync function analyzeSentiment() {const inputText = document.getElementById('inputText').value;const encodedText = await universalSentenceEncoder.embed(inputText);const prediction = model.predict(encodedText.expandDims());const sentiment = prediction.dataSync()[0];const outputDiv = document.getElementById('output');outputDiv.innerHTML = `Sentiment Score: ${sentiment.toFixed(2)}<br />`;if (sentiment > 0.5) {outputDiv.innerHTML += "The sentiment is positive.";} else {outputDiv.innerHTML += "The sentiment is negative.";}}// Load the model when the page loadswindow.onload = loadModel;</script>
</body>
</html>

4.4 注意事项

在这个示例中，我们使用了Universal Sentence Encoder来将文本编码为向量，这简化了模型的复杂度。但在实际应用中，你可能需要使用相同的分词器和序列填充策略来确保输入的一致性。
如果你的模型使用了不同的预处理步骤，你需要确保前端能够正确地复制这些步骤。
这个示例假设你已经有了一定规模的标注数据集。在实际应用中，你可能需要收集和标记更多的数据。

五、完善项目

上面我们已经完成了情感分析的基本框架，接下来我们可以进一步完善这个项目，使其更加完整和实用。这包括以下几个方面：

增强前端界面：添加更多的交互元素和样式，提升用户体验。
优化模型：考虑使用更先进的模型，比如BERT，以及对模型进行微调以提高准确性。
集成API：为模型提供一个RESTful API接口，方便其他应用程序调用。
部署到服务器：将前端和后端部署到云服务器上，使其对外界可用。

1. 增强前端界面

让我们先来改进前端界面，增加一些交互元素，比如按钮、进度条和结果展示区等，以提升用户体验。

<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><title>Sentiment Analysis with TensorFlow.js</title><script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@3.9.0/dist/tf.min.js"></script><script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/universal-sentence-encoder@4.1.0/dist/index.min.js"></script><style>body { font-family: Arial, sans-serif; }#inputText { width: 100%; height: 150px; }#output { margin-top: 20px; }#progressBar { display: none; width: 100%; height: 20px; background-color: #ddd; }#progressBar .progress-bar { height: 100%; background-color: #4caf50; }</style>
</head>
<body><h1>Sentiment Analysis Demo</h1><textarea id="inputText" placeholder="Enter text here..."></textarea><button onclick="analyzeSentiment()">Analyze Sentiment</button><div id="progressBar"><div class="progress-bar"></div></div><div id="output"></div><script>// Load the modelconst modelUrl = 'models/sentiment_model/model.json';let model;async function loadModel() {model = await tf.loadLayersModel(modelUrl);}// Analyze the sentiment of the input textasync function analyzeSentiment() {const inputText = document.getElementById('inputText').value.trim();if (!inputText) {alert("Please enter some text to analyze.");return;}showProgressBar();const encodedText = await universalSentenceEncoder.embed(inputText);const prediction = model.predict(encodedText.expandDims());const sentiment = prediction.dataSync()[0];hideProgressBar();const outputDiv = document.getElementById('output');outputDiv.innerHTML = `Sentiment Score: ${sentiment.toFixed(2)}<br />`;if (sentiment > 0.5) {outputDiv.innerHTML += "The sentiment is positive.";} else {outputDiv.innerHTML += "The sentiment is negative.";}}function showProgressBar() {const progressBar = document.getElementById('progressBar');const progress = progressBar.querySelector('.progress-bar');progressBar.style.display = 'block';progress.style.width = '0%';const intervalId = setInterval(() => {let width = parseFloat(progress.style.width);if (width >= 100) {clearInterval(intervalId);progress.style.width = '100%';setTimeout(() => {hideProgressBar();}, 500);} else {progress.style.width = `${width + 10}%`;}}, 50);}function hideProgressBar() {const progressBar = document.getElementById('progressBar');progressBar.style.display = 'none';}// Load the model when the page loadswindow.onload = loadModel;</script>
</body>
</html>

2. 优化模型

我们可以考虑使用更先进的模型，比如BERT。BERT是一个基于Transformer的预训练模型，它在多种自然语言处理任务上取得了非常好的效果。这里我们使用TensorFlow.js的@tensorflow-models/bert库来加载一个预训练的BERT模型，并进行微调。

2.1 更新模型训练代码 (Python)

由于BERT模型的训练较为复杂，我们在这里只提供一个概览。你可以在Python环境中训练一个基于BERT的模型，并将其转换为TensorFlow.js格式。

import tensorflow as tf
import tensorflow_hub as hub
import tensorflow_text as text
from official.nlp import optimization  # to create AdamW optimizer
import tensorflow_datasets as tfds
import os# Load BERT model and tokenizer
bert_preprocess_model = hub.KerasLayer("https://tfhub.dev/tensorflow/bert_en_uncased_preprocess/3")
bert_encoder = hub.KerasLayer("https://tfhub.dev/tensorflow/bert_en_uncased_L-12_H-768_A-12/4")# Define model architecture
def create_model():text_input = tf.keras.layers.Input(shape=(), dtype=tf.string, name='text')preprocessing_layer = hub.KerasLayer(bert_preprocess_model, name='preprocessing')encoder_inputs = preprocessing_layer(text_input)encoder = hub.KerasLayer(bert_encoder, trainable=True, name='BERT_encoder')outputs = encoder(encoder_inputs)net = outputs['pooled_output']net = tf.keras.layers.Dropout(0.1)(net)net = tf.keras.layers.Dense(1, activation=None, name='classifier')(net)return tf.keras.Model(text_input, net)# Compile the model
model = create_model()
loss = tf.keras.losses.BinaryCrossentropy(from_logits=True)
metrics = tf.metrics.BinaryAccuracy()epochs = 5
steps_per_epoch = tf.data.experimental.cardinality(list(train_data)).numpy()
num_train_steps = steps_per_epoch * epochs
num_warmup_steps = int(0.1*num_train_steps)optimizer = optimization.create_optimizer(init_lr=3e-5,num_train_steps=num_train_steps,num_warmup_steps=num_warmup_steps,optimizer_type='adamw')model.compile(optimizer=optimizer,loss=loss,metrics=metrics)# Train the model
model.fit(x=train_data,y=train_labels,validation_data=(val_data, val_labels),epochs=epochs)# Save the model
model.save('sentiment_bert_model.h5')

2.2 转换模型到TensorFlow.js

使用TensorFlow.js Converter将模型转换为TensorFlow.js格式。

tensorflowjs_converter --input_format keras sentiment_bert_model.h5 models/sentiment_bert_model

2.3 更新前端应用

更新前端应用以使用BERT模型进行预测。

<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><title>Sentiment Analysis with TensorFlow.js (BERT)</title><script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@3.9.0/dist/tf.min.js"></script><script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/bert@1.0.0/dist/index.min.js"></script><style>/* ... existing styles ... */</style>
</head>
<body><!-- ... existing HTML elements ... --><script>// Load the modelconst modelUrl = 'models/sentiment_bert_model/model.json';let model;async function loadModel() {model = await tf.loadLayersModel(modelUrl);}// Analyze the sentiment of the input textasync function analyzeSentiment() {const inputText = document.getElementById('inputText').value.trim();if (!inputText) {alert("Please enter some text to analyze.");return;}showProgressBar();// Use BERT to encode the input textconst encoder = new BertEncoder('uncased_L-12_H-768_A-12');const encodedText = await encoder.encode(inputText);const prediction = model.predict(encodedText);const sentiment = prediction.dataSync()[0];hideProgressBar();const outputDiv = document.getElementById('output');outputDiv.innerHTML = `Sentiment Score: ${sentiment.toFixed(2)}<br />`;if (sentiment > 0.5) {outputDiv.innerHTML += "The sentiment is positive.";} else {outputDiv.innerHTML += "The sentiment is negative.";}}// ... existing functions ...// Load the model when the page loadswindow.onload = loadModel;</script>
</body>
</html>

3. 集成API

为了让其他应用程序能够调用情感分析模型，我们可以创建一个RESTful API。

3.1 创建API (Node.js + Express)

const express = require('express');
const bodyParser = require('body-parser');
const tf = require('@tensorflow/tfjs-node');
const { BertEncoder } = require('@tensorflow-models/bert');const app = express();
app.use(bodyParser.json());// Load the model
let model;async function loadModel() {model = await tf.loadLayersModel('file://./models/sentiment_bert_model/model.json');
}loadModel().then(() => {console.log('Model loaded successfully.');
});// Analyze sentiment endpoint
app.post('/analyze', async (req, res) => {const { text } = req.body;if (!text) {return res.status(400).send({ error: 'Missing text' });}const encoder = new BertEncoder('uncased_L-12_H-768_A-12');const encodedText = await encoder.encode(text);const prediction = model.predict(encodedText);const sentiment = prediction.dataSync()[0];res.json({ sentimentScore: sentiment, isPositive: sentiment > 0.5 });
});// Start the server
const PORT = process.env.PORT || 3000;
app.listen(PORT, () => {console.log(`Server is running on port ${PORT}`);
});

4. 部署到服务器

你可以将前端和后端分别部署到云服务器上，例如使用Heroku或AWS。这里就不详细展开部署过程了，但你可以参考各个云服务商的文档来进行部署。

通过这些步骤，你将能够构建一个功能完整的情感分析应用，其中包括了用户友好的前端界面、先进的BERT模型以及一个可被其他应用程序调用的API。希望这个项目对你有所帮助！如果有任何疑问或需要进一步的帮助，请随时告诉我。