如何使用 axios 从 Django REST 框架中的 React Native 中的 api 获取数据答案

【问题标题】：How to fetch data from an api in React Native from Django rest framework using axios如何使用 axios 从 Django REST 框架中的 React Native 中的 api 获取数据
【发布时间】：2020-11-16 16:18:48
【问题描述】：

这是上下文提供程序，它具有从其余框架 api 获取的我的状态。

import axios from 'axios';

export const PostContext = createContext();

const PostContextProvider = (props) => {

    const [ posts, setPosts ] = useState([]);

    useEffect(() => {
        axios.get('http://127.0.0.1:8000/api/products/')
            .then(res => {
                setPosts(res.data)
            })
            .catch(err => {
                console.log(err);
            })
    }, []);


 return(

    <PostContext.Provider value={{ posts }}>
        {props.children}
    </PostContext.Provider>
  
  )
}


export default PostContextProvider**

当我尝试通过控制台记录它时，我的模拟器 console.log 中出现此错误

 Unrecognized event: {"type":"client_log","level":"log","data":["[]"]}
Array []

当我检查我的浏览器时，我收到了这个错误。

DevTools failed to load SourceMap: Could not load content for http://127.0.0.1:8000/static/rest_framework/css/bootstrap.min.css.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE

我尝试使用 cors 标头配置我的后端，代码如下所示

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'rest_framework',
    'corsheaders',
    'django_filters',
    # 'rest_framework_filters',
    'shop.apps.ShopConfig',
    'cart.apps.CartConfig',
]

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',
]



 CORS_ORIGIN_ALLOW_ALL = True
    
    # CORS_ORIGIN_WHITELIST = (
    #     'http://localhost:19002/'
    # )

【问题讨论】：

标签： django react-native django-rest-framework axios

【解决方案1】：

如果您没有在 django 存储库中创建任何静态文件（js 或 css），请注释掉

'django.contrib.staticfiles',

或在设置中 STATIC_URL = '/static/' STATIC_ROOT = os.path.join(BASE_DIR, 'staticfiles')

在显示您的错误后猜测这个。这可能会有所帮助！

【讨论】：