用前后端编写一个程序实现进制转换
时间: 2024-09-22 09:04:53 浏览: 40
易语言正则实现进制转换源码-易语言
前端和后端编写一个程序实现进制转换通常涉及两部分:前端用于收集用户输入并展示结果,后端负责处理计算逻辑。
**前端(HTML、JavaScript)实现**:
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>进制转换</title>
</head>
<body>
<input type="number" id="inputNumber" placeholder="请输入数字">
<select id="sourceBase">
<option value="10">十进制</option>
<option value="2">二进制</option>
<!-- 可以添加更多选项如八进制、十六进制 -->
</select>
<select id="targetBase">
<option value="10">十进制</option>
<option value="2">二进制</option>
<!-- 同上 -->
</select>
<button onclick="convert()">转换</button>
<p id="result"></p>
<script>
function convert() {
const input = document.getElementById('inputNumber').value;
const sourceBase = parseInt(document.getElementById('sourceBase').value);
const targetBase = parseInt(document.getElementById('targetBase').value);
// 这里调用后端API获取进制转换的结果
fetch('/api/convert', {
method: 'POST',
body: JSON.stringify({ number: input, fromBase: sourceBase, toBase: targetBase }),
headers: { 'Content-Type': 'application/json' },
})
.then(response => response.json())
.then(data => {
document.getElementById('result').textContent = `从${sourceBase}进制转换到${targetBase}进制: ${data.result}`;
});
}
</script>
</body>
</html>
```
**后端(Node.js + Express)实现**
创建一个简单的Express服务器,并使用`multer`处理POST请求数据:
```javascript
const express = require('express');
const bodyParser = require('body-parser');
const app = express();
app.use(bodyParser.json());
// 使用第三方库如`decimal-js`来进行进制转换
const Decimal = require('decimal.js');
app.post('/api/convert', (req, res) => {
const { number, fromBase, toBase } = req.body;
try {
const decimalValue = new Decimal(number.toString(fromBase));
const result = decimalValue.to(toBase).toString();
res.status(200).json({ result });
} catch (error) {
console.error(error);
res.status(400).send('Invalid input or conversion not supported.');
}
});
const PORT = process.env.PORT || 3000;
app.listen(PORT, () => {
console.log(`Server is running on port ${PORT}`);
});
```
阅读全文