1

Hello Friends I Can't Get Image From Django To React Native

Here My Code

Fetch APi

const [add, setStudents] = useState([{}])
    async function getAllStudent() {
      try {
        const add = await axios.get('http://192.168.1.77:19000/api/add/')
        method:'GET',
        setStudents(add.data)
      } 
      catch (error) {
        console.log(error)
      }
    }
    getAllStudent(); 

FlatList :

<FlatList 
            data={add}
            
            renderItem={({item})=>
            <Image 
            style={{width:200,height:200, backgroundColor:'green',}}
            source={{uri:item.image}}
            />
            
            }
            />

Django Code Is Here

Views

class addpost(viewsets.ViewSet):
    
    def list(self,request):
        postadd1 = postadd.objects.all()
        postaddserial1 = postaddserial(postadd1,many=True)
        return Response(postaddserial1.data)
    
    def create(self,request):
        postaddserial1 = postaddserial(data=request.data)
        if postaddserial1.is_valid():
            postaddserial1.save()
            return Response(postaddserial1.data, status=status.HTTP_201_CREATED)
        return Response(postaddserial1.errors, status=status.HTTP_400_BAD_REQUEST )

    def retrieve(self,request,pk=None):
        queryset = postadd.objects.all()
        contact = get_object_or_404(queryset,pk=pk)
        postaddserial1 = postaddserial(contact)
        return Response(postaddserial1.data)
    
    
    def update(self,request,pk=None):
        contact = postadd.objects.get(pk=pk)
        postaddserial1 = postaddserial(contact,data=request.data)
        if postaddserial1.is_valid():
            postaddserial1.save()
            return Response(postaddserial1.data,status=status.HTTP_201_CREATED)
            
        return Response(postaddserial1.errors,status=status.HTTP_400_BAD_REQUEST)
    
    def destroy(self, request, pk=None):
        postadd1 = postadd.objects.get(pk=pk)
        postadd1.delete()
        return Response(status=status.HTTP_204_NO_CONTENT)    
    

Serializer

class postaddserial(serializers.ModelSerializer):
    class Meta:
        model = postadd
        fields ='__all__'

Model

class postadd(models.Model):
    city=models.CharField(max_length=122)
    carinfo=models.CharField(max_length=122)
    milage=models.CharField(max_length=122)
    price=models.CharField(max_length=122)
    company=models.CharField(max_length=122)
    image = models.ImageField(upload_to ='static/Images', height_field=None, width_field=None, max_length=100,)
    engine=models.CharField(max_length=122)
    contact=models.CharField(max_length=122)

I make django Api to add product in react native. i show image from post man . but cant get image in react native from api i am making application where i can add product from django rest framework and show it on react native through api i get all data in react native but cant get image from api. when i use postman i get image from api but when i use api on react native i can't get image

1 Answers1

0

You need to define media settings and absolute url for image or files.

For more helo you can see here Django serializer Imagefield to get full URL

Ajay K
  • 183
  • 11