JavaScript调用ABAP后端发布的restful服务

1.消费代码

我这里账号密码配置在node.js的.env,所以注释了组装Authrization的部分

javascript 复制代码
        let url = 'http://localhost:3000/api/zbakewm?ACTION=GET_BSK_INFO';
        // const USERNAME = '账号';
        // const PASSWORD = '密码';
        // function getAuthHeader() {
        //     const credentials = btoa(`${USERNAME}:${PASSWORD}`);
        //     return `Basic ${credentials}`;
        // }
        fetch(url, {
            method: 'POST',
            headers: {
                // 'Authorization': getAuthHeader(),
                'Content-Type': 'application/json'
            },
            body: JSON.stringify({
                // 你的数据
                "in_card_id": "300003390613"
            })
        })
            .then(response => response.json())
            .then(data => {
                console.log(data);
            }).catch(error => {
                console.error('Error:', error);
            });

2.通过node.js服务提供代理,解决CORS跨域问题

javascript 复制代码
// server.js
require('dotenv').config();
const express = require('express');
const axios = require('axios');
const cors = require('cors');
const helmet = require('helmet');
const morgan = require('morgan');

const app = express();
const PORT = process.env.PORT || 3000;

// 安全中间件
app.use(helmet()); // 设置安全 headers
app.use(cors()); // 允许所有域名
app.use(morgan('combined')); // 日志
app.use(express.json({ limit: '10mb' }));

// 构造 ABAP Basic Auth 头
const abapAuth = 'Basic ' + Buffer.from(
    `${process.env.ABAP_USER}:${process.env.ABAP_PASS}`
).toString('base64');
console.log('Generated Auth Header:', abapAuth);

// 通用代理路由
app.use('/api', async (req, res) => {
    try {
        const targetPath = req.originalUrl.replace('/api', '');
        const url = `${process.env.ABAP_URL}${targetPath}`;

        console.log(`Proxying to ABAP: ${url}`);

        const response = await axios({
            method: req.method,
            url: url,
            headers: {
                //     ...req.headers,
                Authorization: abapAuth,
                // Host: new URL(process.env.ABAP_URL).host, // 避免 Host 头问题
                'Content-Type': req.headers['content-type'] || 'application/json'
            },
            data: req.body,
            httpsAgent: process.env.NODE_TLS_REJECT_UNAUTHORIZED === '0'
                ? new (require('https')).Agent({ rejectUnauthorized: false })
                : undefined, // 仅用于自签名证书测试!生产环境应使用有效证书
            timeout: 180000
        });

        // 返回 ABAP 响应
        res.status(response.status).json(response.data);
    } catch (error) {
        console.error('Proxy error:', error.message);
        if (error.response) {
            res.status(error.response.status).send(error.response.data);
        } else {
            res.status(502).json({ error: 'Failed to reach ABAP system' });
        }
    }
});

// 健康检查
app.get('/health', (req, res) => {
    res.json({ status: 'OK', timestamp: new Date().toISOString() });
});

app.listen(PORT, () => {
    console.log(`ABAP Proxy running on port ${PORT}`);
});

.env配置文件

javascript 复制代码
ABAP_URL=http://ip:port
ABAP_USER=账号
ABAP_PASS=密码
PORT=3000
NODE_ENV=production

cd到项目目录

运行终端命令安装依赖

npm init -y && npm install dotenv express axios cors helmet morgan

依赖安装成功后生成的文件

终端命令启动代理服务

node node proxy-server.js

可以看到代理服务已经成功启动

3.启动前端页面可以看到正常调用ABAP后端服务,获取到数据

相关推荐
wangfpp23 分钟前
性能优化,请先停手:为什么我劝你别上来就搞优化?
前端·javascript·面试
三旬81 小时前
Day.js 源码深度剖析:极简时间库的设计艺术
javascript
清风徐来QCQ1 小时前
js中的模板字符串
开发语言·前端·javascript
SuperEugene2 小时前
Vue3 + Element Plus 表格实战:批量操作、行内编辑、跨页选中逻辑统一|表单与表格规范篇
开发语言·前端·javascript
极梦网络无忧2 小时前
基于 Vite + Vue3 的组件自动注册功能
前端·javascript·vue.js
软弹3 小时前
深入理解 React Ref 机制:useRef 与 forwardRef 的协作原理
前端·javascript·react.js
雪碧聊技术3 小时前
前端vue代码架子搭建
前端·javascript·vue.js·前端项目代码框架搭建
han_3 小时前
JavaScript设计模式(二):策略模式实现与应用
前端·javascript·设计模式
x***r1513 小时前
Notepad++ 8.6 安装教程:详细步骤+自定义安装路径(附注意事项)
linux·前端·javascript
Hilaku3 小时前
为什么很多工作 5 年的前端,身价反而卡住了?🤷‍♂️
前端·javascript·面试