A continuación se muestra mi código, intenté eliminar el registro en la base de datos en tiempo real de firebase usando id


import React from 'react';
import classes from './Order.css';
import axios from '../../axios-orders';
const order = (props) => {
    const restult = () => {
        return (props.details.map((item, i) =>
            <tr key={item.id}>
                <td>{i + 1}</td>
                <td>{item.orderData.name}</td>
                <td>{item.orderData.email}</td>
                <td>{item.orderData.street}</td>
                <td>{item.orderData.zipCode}</td>
                <td>{item.orderData.country}</td>
                <td><button onClick={() => deleteHandler(item.id)} >Delete</button></td>
            </tr>
        )
        )
    }

    const deleteHandler = (itemId) => {
        axios
            .delete('/orders.json/-LrJSCvoqEKoM1BAfgOV', {
                headers:
                    { "Access-Control-Allow-Origin": "*" }
            })
            .then(res => {
                console.log(res);
            })
            .catch(err => {
                console.log(err);
            });
    }

    return (
        <div className={classes.Order}>
            <table className={classes.students}>
                <thead>
                    <tr>
                        <th>Sno</th>
                        <th>Name</th>
                        <th>Email</th>
                        <th>Street</th>
                        <th>ZipCode</th>
                        <th>Country</th>
                        <th>Action</th>
                    </tr>
                </thead>
                <tbody>
                    {restult()}
                </tbody>
            </table>
        </div>
    );
};

export default order;

Pasé id para eliminar la función. Pero muestra el siguiente error:

error: OPCIONES https: // react-my-project-912f7. firebaseio.com/orders.json/-LrJSCvoqEKoM1BAfgOV 405 (método no permitido)

error: Acceso a XMLHttpRequest en 'https: // react-my- project-912f7.firebaseio.com/orders.json/-LrJSCvoqEKoM1BAfgOV 'desde el origen' http: // localhost: 3000 < / a> 'ha sido bloqueado por la política CORS: la respuesta a la solicitud de verificación previa no pasa la verificación de control de acceso: no tiene el estado HTTP ok.

¿Podría decirme dónde cometí un error? Gracias de antemano

A continuación se muestra una captura de pantalla adjunta y pasé la identificación es "-LrJSCvoqEKoM1BAfgOV" Imagen de base de datos de Fibercase

A continuación se muestra mi configuración de base de fuego:

import axios from 'axios';

const instance = axios.create({
    baseURL: 'https://react-my-project-912f7.firebaseio.com/'
});

export default instance;
0
user12181579 16 oct. 2019 a las 15:03

1 respuesta

La mejor respuesta

Esto se debe a que la base de datos Firebase Realtime le impide enviar una solicitud OPTIONS a su punto final, lo que no permite el método OPTIONS.

De Guardando documento de datos de firebase, si su base de datos es así:

- orders
    - -LrJSCvoqEKoM1BAfgOV
        - orderData:
            ...

Y desea eliminar -LrJSCvoqEKoM1BAfgOV, entonces su URL de solicitud DELETE debería verse así:

https://react-my-project-912f7.firebaseio.com/orders / -LrJSCvoqEKoM1BAfgOV .json

.json permanezca al final del extremo para informar a Firebase que habilite los cors para el origen de su host.

1
Toan Quoc Ho 17 oct. 2019 a las 08:02