Question

我有一个应用程序Vue + Django。我尝试使用axios post方法将一些数据从vue发送到数据库。不幸的是控制台显示错误： GET http://localhost:8080/api/get_data/ 404 (Not Found)

在python控制台中也是如此： Not Found: /get_data/

我在视图中定义了函数get_data，并向url添加了路径： path('get_data/', views.get_data)

在前端看起来像这样：

    addNewData() {
      axios.post("/api/get_data/", this.componentData.data).then(response => {
        console.log("ok");
      });
    }

我错过了什么吗？

Answer 1

axios.post(conf.BACKEND_URL + "/api/get_data/")-此URL相对于“当前”。这就是为什么它尝试访问axios.post("http://localhost:8000/api/get_data/")的原因，其中 8080 是VUE应用程序的端口。 Django应用默认在 8000 上运行。

您应该使用绝对URL从另一个应用程序访问一个应用程序：从Vue应用程序访问Django应用程序API。

在VUE应用中使用不同的config / env.var来以调试（localhost）和prod（域名+ http / https）模式引用后端API，例如：

const BadInput: React.FunctionComponent<InputProps> = () => {
  return;
};
// BadInput signature is () => void 

const Input: React.FunctionComponent<InputProps> = (props: InputProps) => {
  return <span></span>;
};
// Input matchs the signature (InputProps) => React.Element

在您的情况下，应在调试模式下将其扩展（扩展）：

interface FunctionComponent<P = {}> {
    (props: P & { children?: ReactNode }, context?: any): ReactElement<any> | null;
    propTypes?: WeakValidationMap<P>;
    contextTypes?: ValidationMap<any>;
    defaultProps?: Partial<P>;
    displayName?: string;
}

Answer 2

如果您不使用webpack proxyTable处理'/ api'，则应添加后端地址

找不到VUE axios获取API

2 个答案: