获取API，在浏览器中显示KeyError，但在Postman中工作

Question

我遇到了一个奇怪的问题，我创建的GET API在Postman中运行良好，但在浏览器中输入时无法在特定的URL上运行。

以下是Postman中成功显示的输入和输出的样子：在Postman 中尝试API

以下是我的浏览器上显示的错误：浏览器中的错误

我在React中也收到了关于CORS头的这个错误，尽管我已经添加了代码来尝试处理这个问题：React中关于CORS 的错误

• 以下是Django中settings.py中的代码：

INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'Prediction',
'rest_framework',
'corsheaders',
]

MIDDLEWARE = [
'corsheaders.middleware.CorsMiddleware',
'django.middleware.security.SecurityMiddleware',
'django.contrib.sessions.middleware.SessionMiddleware',
'django.middleware.common.CommonMiddleware',
'django.middleware.csrf.CsrfViewMiddleware',
'django.contrib.auth.middleware.AuthenticationMiddleware',
'django.contrib.messages.middleware.MessageMiddleware',
'django.middleware.clickjacking.XFrameOptionsMiddleware',
]

• 以下是Django中local_settings.py中的代码：

#########################################
##  IMPORT LOCAL SETTINGS ##
#########################################

try:
from .local_settings import *
except ImportError:
pass

DATABASES = {
'default': {
'ENGINE': 'django.db.backends.postgresql_psycopg2',
'NAME': 'postgres',
'USER': 'postgres',
'PASSWORD': 'postgres',
'HOST': '127.0.0.1',
'PORT': '5432',
}
}

#################################################################
##  (CORS) Cross-Origin Resource Sharing Settings ##
#################################################################
CORS_ORIGIN_ALLOW_ALL = True

• 我也尝试在React的index.js中添加这段代码来处理CORS头的问题，但没有成功：

const express = require('express');
const request = require('request');

const app = express();

app.use((req, res, next) => {
res.header('Access-Control-Allow-Origin', '*');
next();
});

app.get('/jokes/random', (req, res) => {
request({
url: 'https://joke-api-strict-cors.appspot.com/jokes/random'
},
(error, response, body) => {
if (error || response.statusCode !== 200) {
return res.status(500).json({
type: 'error',
message: err.message
});
}

res.json(JSON.parse(body));
}
)
});

const PORT = process.env.PORT || 3000;
app.listen(PORT, () => console.log(`listening on ${PORT}`));

以下是React:中App.js中的代码

import logo from './logo.svg';
import './App.css';
import { useState } from 'react';
import axios from 'axios';

function App() {
const [json_response1, set_json_response1] = useState("1st algorithm - List of similar events");

function request_json_response() {
axios.get('http://127.0.0.1:8000/api/get_events_1st_alg', {
data: {
"ID": "User_ID1"
}
}).then(function (response) {
// handle success
set_json_response1(response);
});
}

return (
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<p>
{json_response1}
</p>

<button onClick={request_json_response}>
Generate events for user
</button>

<a
className="App-link"
href="https://reactjs.org"
target="_blank"
rel="noopener noreferrer"
>
Learn React
</a>
</header>
</div>
);
}

export default App;

以下是Django中views.py中的代码：

class get_events_1st_alg(APIView):
def get(self, request, format=None):
"""
data = request.data
banana_dictionary = {'banana':17}
return Response(banana_dictionary, status=status.HTTP_201_CREATED)
"""
import pandas as pd
import numpy as np
import psycopg2
import sqlalchemy
from sklearn.metrics.pairwise import cosine_similarity
from sklearn.metrics import pairwise_distances
import requests

from sqlalchemy import create_engine
engine = create_engine('postgresql://postgres:postgres@localhost/postgres')
# pd.read_sql_query('''SELECT * FROM arts_user_interaction LIMIT 5;''', engine)
events = pd.read_sql_query('''SELECT * FROM arts_event;''', engine)
Ratings = pd.read_sql_query('''SELECT * FROM arts_user_interaction;''', engine)

Mean = Ratings.groupby(by="User_ID", as_index = False)['User Rating'].mean()
Rating_avg = pd.merge(Ratings, Mean, on = "User_ID")
Rating_avg['adg_rating']=Rating_avg['User Rating_x']-Rating_avg['User Rating_y']

check = pd.pivot_table(Rating_avg,values='User Rating_x',index='User_ID',columns='Event_ID')
final = pd.pivot_table(Rating_avg,values='adg_rating',index='User_ID',columns='Event_ID')
final_event = final.fillna(final.mean(axis=0))
final_user = final.apply(lambda row: row.fillna(row.mean()), axis=1)

cosine = cosine_similarity(final_event)
np.fill_diagonal(cosine, 0 )
similarity_with_event =pd.DataFrame(cosine,index=final_event.index)
similarity_with_event.columns=final_user.index

def find_n_neighbours(df,n):
order = np.argsort(df.values, axis=1)[:, :n]
df = df.apply(lambda x: pd.Series(x.sort_values(ascending=False)
.iloc[:n].index, 
index=['top{}'.format(i) for i in range(1, n+1)]), axis=1)
return df

sim_user_30_e = find_n_neighbours(similarity_with_event,30)

def get_user_similar_events( user1, user2 ):
common_events = Rating_avg[Rating_avg.User_ID == user1].merge(
Rating_avg[Rating_avg.User_ID == user2],
on = "Event_ID",
how = "inner" )
return common_events.merge(events, on ='Event_ID')

a = get_user_similar_events('User_ID10','User_ID220')
a = a.reindex(columns= ['User Rating_x_x','User Rating_x_y','Name'])

Rating_avg = Rating_avg.astype({"Event_ID": str})
Movie_user = Rating_avg.groupby(by = 'User_ID')['Event_ID'].apply(lambda x:','.join(x))

def User_item_score1(user):
Movie_seen_by_user = check.columns[check[check.index==user].notna().any()].tolist()
a = sim_user_30_e[sim_user_30_e.index==user].values
b = a.squeeze().tolist()
d = Movie_user[Movie_user.index.isin(b)]
l = ','.join(d.values)
Movie_seen_by_similar_users = l.split(',')
Movies_under_consideration = list(set(Movie_seen_by_similar_users)-set(list(map(str, Movie_seen_by_user))))
Movies_under_consideration = list(map(str, Movies_under_consideration))
score = []
for item in Movies_under_consideration:
c = final_event.loc[:,item]
d = c[c.index.isin(b)]
f = d[d.notnull()]
avg_user = Mean.loc[Mean['User_ID'] == user,'User Rating'].values[0]
index = f.index.values.squeeze().tolist()
corr = similarity_with_event.loc[user,index]
fin = pd.concat([f, corr], axis=1)
fin.columns = ['adg_score','correlation']
fin['score']=fin.apply(lambda x:x['adg_score'] * x['correlation'],axis=1)
nume = fin['score'].sum()
deno = fin['correlation'].sum()
final_score = avg_user + (nume/deno)
score.append(final_score)
data = pd.DataFrame({'Event_ID':Movies_under_consideration,'score':score})
top_5_recommendation = data.sort_values(by='score',ascending=False).head(5)
Movie_Name = top_5_recommendation.merge(events, how='inner', on='Event_ID')
Movie_Names = Movie_Name.Name.values.tolist()
return Movie_Names

# user = input("Enter the user id to whom you want to recommend : ")
data = request.data

user = ""

for i, v in data.items():
user = str(v)

predicted_movies = User_item_score1(user)

return Response(predicted_movies, status=status.HTTP_201_CREATED)

我真的不知道我在做什么，因为我只是在网上看了一系列教程，所以如果有人能帮助解决浏览器中的API问题和浏览器中CORS的React问题，我会很高兴的。非常感谢！

Answer 1

问题是GET请求不应该有正文(axios不指定/支持它(。请参阅axios存储库中的此问题：链接。

请将数据更改为参数：

axios.get('http://127.0.0.1:8000/api/get_events_1st_alg', { params: { "ID":"User_ID1"}})

并在DRF中访问它，如：

user = request.query_params.get("ID")

您的CORS配置正常。