node.js - Nuxt.js CORS 错误:它没有 HTTP ok 状态
问题描述
我正在构建一个 Nuxt.js 应用程序,但遇到了 CORS 错误。我已经在我请求资源的服务器上启用了 CORS,从该服务器中解决了我原来的 CORS 错误,但现在我看到一个新错误,“它没有 HTTP ok 状态。”
这是 Nuxt.js 应用程序的标注。
async executeCallout(context, payload) {
// Start loading...
let loadingId = context.dispatch('handleLoad', {
msg: 'Getting the thing',
method: 'executeCallout',
id: null
}, { root: true });
// Execute http request.
let url = context.getters.getCalloutUrl(payload.func);
let response = await this.$axios({
method: 'post',
headers: {
"Content-type": "application/json"
},
url: url,
data: payload.body
});
// Resolve loading...
context.dispatch('handleLoad', {
msg: null,
method: null,
id: loadingId
}, { root: true });
// Handle http response.
if (response.data.success) {
return response.data;
} else {
context.dispatch('handleError', {
msg: response.data.data,
origin: 'callouts.js',
method: 'executeCallout'
}, { root: true })
}
}
};
这是处理请求的谷歌云功能。
const helper = require('./helper');
const Joi = require('joi');
exports.handler = async (req, res) => {
try {
// Set headers
res.set('Access-Control-Allow-Origin', '*');
if (req.method == 'OPTIONS') {
res.set('Access-Control-Allow-Methods', 'POST', 'OPTIONS');
res.set('Access-Control-Allow-Headers', 'Content-Type');
}
const payload = await schema.validate(req.body);
if (payload.error) {
res.status(400).json({
success: false,
data: payload.error
})
} else {
if (payload.value.product == 'quickbooks') {
let response = await helper.functionCall({ alias: payload.value.alias, function: 'intuit', payload: payload.value.payload });
res.status(response.success ? 200 : 400).json({
success: response.success ? true : false,
data: response.data
})
} else if (payload.value.product == 'distance-matrix') {
let response = await helper.functionCall({ alias: payload.value.alias, function: 'distance-matrix', payload: payload.value.payload });
res.status(response.success ? 200 : 400).json({
success: response.success ? true : false,
data: response.data
})
}
}
} catch (err) {
res.status(500).json({
success: false,
data: err
})
}
}
const schema = Joi.object({
alias: Joi.string().required(),
product: Joi.string(),
action: Joi.string(),
payload: Joi.object()
})
尝试发送请求时的响应如下所示。
解决方案
您可能需要为飞行前响应设置 HTTP 状态。
const helper = require('./helper');
const Joi = require('joi');
exports.handler = async (req, res) => {
try {
// Set headers
res.set('Access-Control-Allow-Origin', '*');
if (['POST', 'OPTIONS'].includes(req.method)) {
res.set('Access-Control-Allow-Methods', 'POST', 'OPTIONS');
res.set('Access-Control-Allow-Headers', 'Content-Type');
}
if (req.method == 'OPTIONS') {
res.status(200)
return
}
const payload = await schema.validate(req.body);
if (payload.error) {
res.status(400).json({
success: false,
data: payload.error
})
} else {
if (payload.value.product == 'quickbooks') {
let response = await helper.functionCall({
alias: payload.value.alias,
function: 'intuit',
payload: payload.value.payload
});
res.status(response.success ? 200 : 400).json({
success: response.success ? true : false,
data: response.data
})
} else if (payload.value.product == 'distance-matrix') {
let response = await helper.functionCall({
alias: payload.value.alias,
function: 'distance-matrix',
payload: payload.value.payload
});
res.status(response.success ? 200 : 400).json({
success: response.success ? true : false,
data: response.data
})
}
}
} catch (err) {
res.status(500).json({
success: false,
data: err
})
}
}
const schema = Joi.object({
alias: Joi.string().required(),
product: Joi.string(),
action: Joi.string(),
payload: Joi.object()
})
注意我添加的代码:
if (['POST', 'OPTIONS'].includes(req.method)) {
res.set('Access-Control-Allow-Methods', 'POST', 'OPTIONS');
res.set('Access-Control-Allow-Headers', 'Content-Type');
}
if (req.method == 'OPTIONS') {
res.status(200)
return
}
我还没有使用谷歌云功能,所以我不确定是否有什么我错了。如果有的话,请给我反馈。
推荐阅读
- ruby - Faraday Gem OpenSSL::SSL::SSLError: SSL_connect returned=1
- reactjs - plotly onClick 事件导致 React 中的无限渲染循环
- arrays - 查询返回具有特定日期范围编号的文档,然后对它们进行排序然后排序
- excel - 如何检查单元格中的日期是否在当前月份
- javascript - Jquery:根据下拉选择的值动态更改img src
- c# - 实体框架核心不返回数据
- java - 如何将从 SQL Query 接收到的对象转换为本地类对象?
- java - 为什么没有碰撞?
- java - 在收到的休息响应和输出到客户端之间切换字段名称
- javascript - 如何查找 xr 会话何时开始three.js webxr