接收Javascript/axios回调时出现问题
我对JavaScript比较陌生,在使用Axios时,让成功/错误回调函数正常工作似乎有问题 例如,使用jest(npmtest命令)运行下面的集成测试代码,我得到下面列出的输出。我想知道为什么控制台上没有打印消息“my-ping-2 success.”或“my-ping-3 error:…”。我试图确保内部函数的调用者可以选择在成功和错误情况下传入回调函数。我做错了什么?提前谢谢 详情: 我知道本地API服务器工作正常,如果我通过Postman访问URL和测试,它会返回HTTP状态200。我在下面列出了可以在我的机器上重现问题的完整源代码(MacOS、nodejs版本v12.16.1、npm版本6.13.4) 我在内部函数中使用通用axios(config)方法,因为我在HTTP get/post调用中使用相同的内部函数。我希望没问题 jest控制台输出接收Javascript/axios回调时出现问题,javascript,node.js,axios,Javascript,Node.js,Axios,我对JavaScript比较陌生,在使用Axios时,让成功/错误回调函数正常工作似乎有问题 例如,使用jest(npmtest命令)运行下面的集成测试代码,我得到下面列出的输出。我想知道为什么控制台上没有打印消息“my-ping-2 success.”或“my-ping-3 error:…”。我试图确保内部函数的调用者可以选择在成功和错误情况下传入回调函数。我做错了什么?提前谢谢 详情: 我知道本地API服务器工作正常,如果我通过Postman访问URL和测试,它会返回HTTP状态200。我在
PASS src/__tests__/01_my.test.js
● Console
console.log src/__tests__/01_my.test.js:14
my-ping-1...
console.log src/__tests__/01_my.test.js:20
my-ping-4 done.
再现问题的源代码
import axios from "axios";
import { isEmpty, merge } from 'lodash';
const baseURL = 'http://localhost:9090/api/v1/';
const headers = {
Accept: 'application/json',
};
const source = axios.CancelToken.source();
test('Test my-appcode', done => {
console.log('my-ping-1...');
fw_get_1('/ping', function(response) {
console.log('my-ping-2 success.');
}, function(error) {
console.log('my-ping-3 error: ' + fw_jsonFormatter(error));
} );
console.log('my-ping-4 done.');
done();
});
function fw_get_1(url, successCallback = null,
errorCallback = null) {
return fw_get_2(url, {}, successCallback, errorCallback);
}
function fw_get_2(url, configs = {},
successCallback = null,
errorCallback = null) {
url = encodeURI(url);
return fw_request_3('get', url, configs, successCallback, errorCallback);
}
function fw_request_3(method, url, configs = {},
successCallback = null,
errorCallback = null) {
let inputCfgs = {
params: configs.params,
data : configs.data,
headers : configs.headers
};
const axiosOptions = merge(
{},
{
method,
url,
baseURL,
headers,
cancelToken: source.token
},
inputCfgs
);
return axios(axiosOptions).then( function(response) {
if (successCallback) {
console.log('fw_request_internal success-1 method: ' + axiosOptions.method + ' url: ' + axiosOptions.url);
successCallback(response);
} else {
console.log('fw_request_internal success-2 method: ' + axiosOptions.method + ' url: ' + axiosOptions.url);
}
}).catch(function (error) {
if (errorCallback) {
console.log('Calling input errorCallback method: ' + axiosOptions.method + ' url: ' + axiosOptions.url + fw_jsonFormatter(error));
errorCallback(error);
} else {
console.log('fw_request_internal error-2 method: ' + axiosOptions.method + ' url: ' + axiosOptions.url);
console.log(fw_jsonFormatter(error));
}
});
}
function fw_jsonFormatter(obj) {
return JSON.stringify(obj, null, 1);
}
对于任何看到类似问题的人来说,问题似乎是测试工具在调用回调之前就已经完成了运行。我在测试结束时添加了几秒钟的等待来确认,现在我可以按预期查看所有控制台日志。请参阅下面的修订代码。我正在围绕RESTAPI编写一些JS包装函数。只是想确保包装函数的用户可以选择性地重写回调函数。如果有更好的方法,请告诉我。谢谢 新控制台日志
PASS src/__tests__/01_my.test.js (5.722s)
● Console
console.log src/__tests__/01_my.test.js:14
my-ping-1...
console.log src/__tests__/01_my.test.js:20
my-ping-4 done.
console.log src/__tests__/01_my.test.js:61
fw_request_internal success-1 method: get url: /ping
console.log src/__tests__/01_my.test.js:16
my-ping-2 success.
console.log src/__tests__/01_my.test.js:83
Waited 4 seconds
console.log src/__tests__/01_my.test.js:84
Finished test wait
修改了测试结束时等待的源代码
import axios from "axios";
import {merge } from 'lodash';
const baseURL = 'http://localhost:9090/api/v1/';
const headers = {
Accept: 'application/json',
};
const source = axios.CancelToken.source();
test('Test my-appcode', done => {
console.log('my-ping-1...');
fw_get_1('/ping', function(response) {
console.log('my-ping-2 success.');
}, function(error) {
console.log('my-ping-3 error: ' + fw_jsonFormatter(error));
} );
console.log('my-ping-4 done.');
fw_test_end_wait(done, 'Finished test wait', 4 );
});
function fw_get_1(url, successCallback = null,
errorCallback = null) {
return fw_get_2(url, {}, successCallback, errorCallback);
}
function fw_get_2(url, configs = {},
successCallback = null,
errorCallback = null) {
url = encodeURI(url);
return fw_request_3('get', url, configs, successCallback, errorCallback);
}
function fw_request_3(method, url, configs = {},
successCallback = null,
errorCallback = null) {
let inputCfgs = {
params: configs.params,
data : configs.data,
headers : configs.headers
};
const axiosOptions = merge(
{},
{
method,
url,
baseURL,
headers,
cancelToken: source.token
},
inputCfgs
);
return axios(axiosOptions).then( function(response) {
if (successCallback) {
console.log('fw_request_internal success-1 method: ' + axiosOptions.method + ' url: ' + axiosOptions.url);
successCallback(response);
} else {
console.log('fw_request_internal success-2 method: ' + axiosOptions.method + ' url: ' + axiosOptions.url);
}
}).catch(function (error) {
if (errorCallback) {
console.log('Calling input errorCallback method: ' + axiosOptions.method + ' url: ' + axiosOptions.url + fw_jsonFormatter(error));
errorCallback(error);
} else {
console.log('fw_request_internal error-2 method: ' + axiosOptions.method + ' url: ' + axiosOptions.url);
console.log(fw_jsonFormatter(error));
}
});
}
function fw_jsonFormatter(obj) {
return JSON.stringify(obj, null, 1);
}
function fw_test_end_wait(done, msg, waitSecs) {
setTimeout(() => {
console.log('Waited ' + waitSecs + ' seconds');
console.log(msg);
done();}, waitSecs * 1000);
}