Как обновить запись на mon go db через restapi? - PullRequest
Новая
       10

Как обновить запись на mon go db через restapi?

1 голос
/ 25 января 2020

Каждый раз, когда я нажимаю кнопку обновления, появляется сообщение об ошибке, в котором говорится, что Доступ к выборке в 'http://localhost: 3000 / обновление ' из источника 'null' был заблокирован политикой CORS: Ответ на предпечатную проверку запрос не проходит проверку контроля доступа: он не имеет статуса HTTP ok.

Код интерфейса: 

<form id="sweets">

ID: <input v-model="id" type="text" name="id"><br>
Sweet: <input v-model="sweetname" type="text" name="name"><br>
Price: <input v-model="price" type="text" name="price"><br>
<button v-on:click="update">Update</button>

</form>

Кодировка на стороне клиента: 

const app = new Vue({
    el: "#app",
    data: {
        id: "",
        name: "",
        price: ""
    },

    methods: {
        update() {
            const sweetscollection = {
                id: this.id,

                name: this.name,
                price: this.price
            };
            const options = {
                method: "PUT",
                headers: {
                    "Content-type": "application/json"
                }
            };
            fetch("http://localhost:3000/update", options).then(response => {
                console.log("success", response);
            });
        }
    }
});

На стороне сервера: 

app.put("/update", (req, res, next) => {
    req.collection.update(
        { _id: new ObjectID(req.params.id) },
        { $set: req.body },
        { safe: true, multi: false },
        (e, result) => {
            if (e) return next(e);
            res.send(
                result.result.n === 1 ? { msg: "success" } : { msg: "error" }
            );
        }
    );
});

1 Ответ

0 голосов
/ 26 января 2020

  1. Я не вижу места, куда вы отправляете данные бэкэнду. Вы устанавливаете sweetscollection, но куда вы отправляете его на сервер? Чтобы отправить данные через fetch () , вам необходимо установить свойство body запроса на выборку (https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch)

  2. У вас также есть проблема CORS - это означает, что сервер "не хочет" делиться ресурсами с вашим кодом внешнего интерфейса. Вы должны позаботиться об этом, установив Access-Control-Allow-Origin на вашем Express сервере, добавив:

Добавление Access-Control-Allow-Origin: 

app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "YOUR-DOMAIN.TLD"); // update to match the domain you will make the request from
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  next();
});

app.get('/', function(req, res, next) {
  // Handle the get for this route
});

app.post('/', function(req, res, next) {
 // Handle the post for this route
});

Источник: https://enable-cors.org/server_expressjs.html

Подробнее о CORS: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

...