AxiosError:React Native和Django中的网络错误

yuvru6vn  于 2023-10-18  发布在  iOS
关注(0)|答案(1)|浏览(140)

我是Django和React Native的新手。
我使用Django的休息框架连接我的前端到后端。和我使用
“ axios ”
在向Django发送请求时
我正在尝试在Django中发送URL。在接收之后,django将给予url的长度作为对react native的响应。
我在浏览器中访问Django的路径,我认为它工作正常

但是,react native显示“[AxiosError:网络错误]"。对你的帮助深表感谢。
React Native
它将URL发送到django

const [countChar, setcountChar] = useState()

  const sendData = async() =>{

      const url = "Hello"
      
        const response = await axios.post(
          'http://127.0.0.1:8000/validationServer/validate/',
          { url }
        );

        setcountChar(response.data.character_count);
        console.log(countChar)
        
  }

 <TouchableOpacity
              style={{backgroundColor:"white" ,padding:20}}
              onPress={ () => sendData()}>

                 <Text>Send</Text>
  </TouchableOpacity>

验证服务器/view.py

from rest_framework.decorators import api_view
from rest_framework.response import Response
from .serializer import UrlSerializer

@api_view(['POST'])
def validation (request):

    if request.method == 'POST':
        serializer = UrlSerializer(data=request.data)
        if serializer.is_valid():
            url = serializer.validated_data['url']
            character_count = len(url)
            return Response({'character_count': character_count})
        return Response(serializer.errors, status=400)

验证服务器/serializer.py

from rest_framework import serializers

class UrlSerializer(serializers.Serializer):
    url = serializers.CharField(max_length=2048)

验证服务器/urls.py

from django.urls import path
from . import views

urlpatterns = [

    path ("validate/",views.validation, name='url-character')
]

// main /urls.py

from django.contrib import admin
from django.urls import path, include

urlpatterns = [
    path("admin/", admin.site.urls),
    path('api-auth/', include('rest_framework.urls')),
    path("validationServer/", include('validationServer.urls'))
]

//setting.py

ALLOWED_HOSTS = [
"127.0.0.1"
    ]

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

MIDDLEWARE = [
    "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",

        "corsheaders.middleware.CorsMiddleware",
    "django.middleware.common.CommonMiddleware",

]
5cg8jx4n

5cg8jx4n1#

你的后端看起来很好,你发送请求有效负载的方式是问题所在。更改此选项:

const response = await axios.post(
      'http://127.0.0.1:8000/validationServer/validate/',
      { url }
    );

收件人:

const response = await axios.post(
          'http://127.0.0.1:8000/validationServer/validate/',
          { url: url }
        );

相关问题