javascript - 使用axios发送POST请求，请求参数为JSON格式，请求报错提示跨域?

Question

请问大佬们，如何通过axios，去实现post请求，并且请求参数为JOSN格式传入body内?我这样的写法有什么错误吗？请求就提示跨域报错

Answer 1

那就是真跨域呗。 options 没有过。

触发了复杂请求，验证 content-type 头，需要服务端同意

Answer 2

跨域错误,不是你请求错误,一个域下的脚本试图去请求另一个域下的资源,导致的,是浏览器的一个安全机制,一般的处理方案就是需要服务端设置CORS配置才行

Answer 3

根据您提供的信息，您在使用axios发送POST请求时遇到了跨域报错。跨域报错通常是由于浏览器安全策略引起的，它阻止了从一个域加载的网页向另一个域发送请求。

要解决这个问题，您可以考虑以下几种方法：

1. 使用代理服务器：您可以设置一个代理服务器，例如使用Node.js创建一个简单的服务器，将请求转发到目标URL。这样，浏览器将认为它正在与该代理服务器通信，而不是目标URL，从而避免了跨域问题。
2. 在服务器端设置CORS（跨源资源共享）策略：如果您有权限访问目标服务器的源代码，可以在服务器端设置CORS策略，以允许来自其他域的请求。这通常需要在服务器端配置响应头，例如添加Access-Control-Allow-Origin头。
3. 使用JSONP（JSON with Padding）：JSONP是一种绕过跨域限制的技术。它通过将请求包装在一个函数调用中，并将该函数名称作为查询参数发送到目标URL来实现。然后，服务器返回一个JavaScript脚本，该脚本在调用该函数时将数据作为参数传递回来。这种方法需要在客户端和服务器端进行特殊处理。
4. 使用代理插件或扩展程序：一些浏览器插件或扩展程序可以设置跨域代理，它们可以将请求转发到另一个服务器，从而避免直接跨域请求。这种方法适用于浏览器环境。

关于使用axios发送POST请求并传入JSON格式的请求参数，您可以按照以下步骤进行操作：

1. 确保已经安装了axios库。如果没有安装，可以使用以下命令进行安装：

npm install axios

2. 在您的代码中导入axios：

import axios from 'axios';

3. 创建一个JSON对象作为请求参数：

const data = {  key1: 'value1',  key2: 'value2',  // 其他属性...};

4. 使用axios发送POST请求，并将数据作为请求体（body）发送：

axios.post('https://example.com/api/endpoint', data)  .then(response => {    // 处理响应数据...  })  .catch(error => {    // 处理错误...  });

请注意，在发送POST请求时，需要将数据作为第二个参数传递给axios.post()方法。在这个例子中，我们使用了data对象作为请求体发送。您可以根据需要调整数据对象的内容。

如果您按照上述步骤操作仍然遇到跨域问题，那么问题可能出在服务器端CORS策略或代理设置上。根据您的实际情况选择适合的解决方案来解决跨域问题。