vendredi 17 juillet 2020

How to Connect to an API in Your React Native With Expo?

Api

Api is made by laravel in my local environment.

ApiController

public function test(Request $request)
{
    $test = Test::all();
    return response()->json($test, 200);
}

When I get http://127.0.0.1:8000/api/test, it works.


React Native With Expo

When I did expo start, this project has started on http://localhost:19002/

App.js

componentDidMount() {
  axios
    .get('http://127.0.0.1:8000/api/test')
      .then((response) => {
        console.log(response);
      })
      .catch((error) => {
        console.error(error);
      });
}

I got an error:(

Network Error
- node_modules/axios/lib/core/createError.js:15:17 in createError
- node_modules/axios/lib/adapters/xhr.js:80:22 in handleError
- node_modules/event-target-shim/dist/event-target-shim.js:818:20 in EventTarget.prototype.dispatchEvent
- node_modules/react-native/Libraries/Network/XMLHttpRequest.js:575:10 in setReadyState
- node_modules/react-native/Libraries/Network/XMLHttpRequest.js:389:6 in __didCompleteResponse
- node_modules/react-native/Libraries/vendor/emitter/EventEmitter.js:189:10 in emit
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:425:19 in __callFunction
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:112:6 in __guard$argument_0
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:373:10 in __guard
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:111:4 in callFunctionReturnFlushedQueue
* [native code]:null in callFunctionReturnFlushedQueue

I check this project on Expo Client App on iPhone.

I would appreciate it if you could give me any advice:)



from Newest questions tagged laravel-5 - Stack Overflow https://ift.tt/3fGF7FJ
via IFTTT

2 commentaires:

  1. Are you looking for React Native Development Service or want to grow your existing team of experts to create multi-platform User Interfaces for both iOS & Android? React-Native is the most preferred JavaScript framework for building cross-platform application development. To Hire React Native Developer who will deliver the most value to your app development team, you should be prepared to recognize whether they maintain the needed skills, both professional and interpersonal.

    Full Stack Developer has the extensive understanding and experience necessary to create full-fledged applications for your business. Get the best Full Stack services at affordable rates summing up with all your ideas. Hire Full Stack Programmers who are well-versed with a broad range of services including PHP, MEAN Stack, Node, Angular, Ruby on Rails, ReactJS, Laravel, VueJS, and others.

    RépondreSupprimer
  2. Best Web Design Company in Lebanon delivers stunning and functional websites that resonate with the people interacting with them. They will discover the tiered content support levels by following the process and including it in the website design. Their motive is the global growth in the web development domain by rendering effective services and solutions.

    RépondreSupprimer