客户端证书 javascript 请求

Question

我们正在开发一个带有 python flask 后端的 React 应用程序。通常一切正常，但是当将它放在具有客户端证书要求的服务器后面时，它几乎可以正常工作。它在 Chrome 中运行良好，但在 Firefox 中运行不正常。

在浏览器中输入 URL 时发送证书，从 react 发出请求时不发送。

主请求正常完成，显示页面。
加载页面时向后端发出请求，/backend/version。
该请求失败，nginx 说

<html>
<head><title>400 No required SSL certificate was sent</title></head>
<body bgcolor="white">
<center><h1>400 Bad Request</h1></center>
<center>No required SSL certificate was sent</center>
<hr><center>nginx/1.10.3</center>
</body>
</html>

当我打开 devtools 并粘贴相同的 url 时，它工作正常。客户端证书由浏览器发送。

我们如何提出请求：

const fetchVersion = () => (dispatch, getState) => {
  return dispatch({
  [CALL_API]: {
    endpoint: `${API_ROOT}/version`,
    method: 'GET',
    headers: {
      "Authorization": authHeader(),
    },
    types: [FETCH_VERSION_REQUEST,
      {
        type: FETCH_VERSION_SUCCESS,
        payload: (action, state, res) => {
          const contentType = res.headers.get('Content-Type');
          if (contentType && ~contentType.indexOf('json')) {
            return res.json().then(json => json.response);
          }
        },
      },
      {
      type: FETCH_VERSION_FAILURE,
      meta: (action, state, res) => checkIfInvalidToken(action, state, res, dispatch),
    }
    ],
  },
});
};

缺少什么？为什么 Firefox 不像 Chrome 那样将证书附加到请求？

Answer 1

您可以尝试通过将 [CALL_API].credentials 值明确指定为 include

来查看问题是否得到解决

根据the documentation 默认值为 omit 但 firefox 需要 include 始终发送 cookie，即使是跨域调用。

关于你问题中的例子，代码可能会变成这样：

  [CALL_API]: {
    endpoint: `${API_ROOT}/version`,
    credentials: 'include',
    method: 'GET',
    headers: {
      "Authorization": authHeader(),
    },
...and so on

在纯实验目的的实验室中，我想我已经重现了您在 Chrome 和 Firefox 中报告的类似行为，并且在本实验室中 credentials: 'include' 解决了问题：video available here .

客户端证书 javascript 请求

Client side certificate javascript request

javascript

firefox

nginx

client-certificates

reactjs