axiosRequest header field access-control-allow-origin is not allowed by Access-Control-Allow-Headers

我用的是Axios React PHP

首选看一下Client代码部分

import axios from "axios"; 

export const logIn = (id, email, password) => {
    
    
    return (dispatch) => {
    
    
        const config={
    
    
            method:'post',
            url:'http://localhost/cup/cup.php',
            headers:{
    
    
                'Access-Control-Allow-Origin':'*',
            },
            data:{
    
    
                id:id,
                email:email,
                password:password
            }
        };

        axios.request(config).then((res) => {
    
    
            // console.log(res.data);
        });

1. 首先我提醒一下要好好注意这部分代码
2. headers:{ 'Access-Control-Allow-Origin':'*',

然后再看一下Server代码部分

<?php
include ("./conn.php");
header("Access-Control-Allow-Origin: *");

当我们这样写完之后我们查看console控制台会发现

Request header field access-control-allow-origin is not allowed by Access-Control-Allow-Headers in preflight response.

真是奇了怪了！为什么会出现这样的提示呢？ 我在客户端和服务端都已经设置了
Access-Control-Allow-Origin：*

于是我找了Stack Overflow 和 所有资源都查了一下，提示还是行不通！

我们要好好品味一下这个Access-Control-Allow-Origin –[相关文档]

Access-Control-Allow-Origin 是个响应头
所以我决定吧client中的headers部分全部删掉，这样不会出现error message了

import axios from "axios"; 

export const logIn = (id, email, password) => {
    
    
    return (dispatch) => {
    
    
        const config={
    
    
            method:'post',
            url:'http://localhost/cup/cup.php',
            data:{
    
    
                id:id,
                email:email,
                password:password
            }
        };

        axios.request(config).then((res) => {
    
    
            // console.log(res.data);
        });

---

如果有人知道相关知识可以评论留给我，thanks dude Have a nice day！