Это немного другой вопрос. Я пытался исследовать информацию в течение нескольких часов, и, похоже, я не могу найти то, что ищу.
У меня есть бэкэнд Django REST, который я установил. Его очень простой REST API с одной моделью
Model.py
from django.db import models
# Create your models here.
class Hero(models.Model):
name = models.CharField(max_length=60)
alias = models.CharField(max_length=60)
def __str__(self):
return self.name
Я могу отправлять сообщения через интерфейс REST api, см. Изображение ниже
Я бы хотел, чтобы сервер Django работал в фоновом режиме, пока я создаю интерфейс, файлы которого (index.html, main.css, app.js и т. Д.) Отделены от проекта django.
Затем я бы использовал Axios
для GET, POST-данных в базу данных, используя следующий URL-адрес http://127.0.0.1:8000/api/heroes/
Ниже приведен код из моего интерфейса
import axios from "axios";
export default class SuperHero {
constructor() {
this.superHeroForm = document.querySelector("#superHeroForm");
this.events();
}
events() {
this.superHeroForm.addEventListener("submit", e => this.onSubmit(e));
}
onSubmit(e) {
e.preventDefault();
console.log("onSubmit ran");
this.name = document.querySelector("#name").value;
this.alias = document.querySelector("#alias").value;
axios
.post("http://127.0.0.1:8000/api/heroes/", {
name: this.name,
alias: this.alias
})
.then(res => {
console.log(res);
})
.catch(e => {
console.log(e);
});
}
}
Однако я получаю ошибку CROS
Access to XMLHttpRequest at 'http://127.0.0.1:8000/api/heroes/' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Как я могу отправить данные из внешнего приложения в серверное приложение без этой проблемы?
Должны ли мои файлы внешнего интерфейса быть в моем проекте django, чтобы он работал?