fetch-api

How to post image with fetch?

由 此生再无相见时 提交于 2020-01-02 16:18:12
问题 I just learning react and I create an gallery App, but I have problem with posting picture to API. The problem is that when I click on button ADD there's nothing happend just in console.log I get an error 500 . Here is my component with post request: class AddPhoto extends Component { constructor(props) { super(props); this.state = { modal: false, images: [], isLoading: false, error: null, }; this.toggle = this.toggle.bind(this); this.handleClick = this.handleClick.bind(this); this

How do I determine the status code of a Fetch request?

由 依然范特西╮ 提交于 2020-01-02 10:18:29
问题 I want to fetch an URL and determine what status code it has, especially if it has an HTTP 301 or HTTP 302 status code: fetch('https://httpstat.us/301', { redirect: 'true'}) .then(response => { console.log(response); const headers = response.headers.entries(); for (h of headers) { console.log(h); } }).catch(err => { console.log("in error case") console.log(err); }) This does give me a lot of information, especially it tells me via: response.redirected Which is true. But this only tells me

React Native Fetch API not returning my calls

由 落爺英雄遲暮 提交于 2020-01-02 07:36:26
问题 Sorry for the joke in the title. I am currently exploring the fetch API in react native, but I have bumped in to some issues which I cannot wrap my head around. So, I am trying to get a message from a server, which I am calling with the fetch API in the following manner: var serverCommunicator = { test: function() { fetch(baseUrl , { method: 'GET', headers: { 'Accept': 'application/json', 'Content-Type': 'application/json', } }) .then((response) => response.text()) .then((responseText) => {

What's the difference between “same-origin” and “no-cors” for JavaScript's Fetch API?

由 旧城冷巷雨未停 提交于 2020-01-02 00:58:06
问题 I thought same origin implies no CORS, and vice-versa. What's the difference between the two options for JavaScript's Fetch API's mode option? Also, in the specs, it says: Even though the default request mode is "no-cors", standards are highly discouraged from using it for new features. It is rather unsafe. Why is it unsafe? Source: https://fetch.spec.whatwg.org/#requests 回答1: With same-origin you can perform requests only to your origin, otherwise the request will result in an error. With no

Get an array of values using fetch api javascript

由 不想你离开。 提交于 2019-12-31 04:08:23
问题 I am using fetch api to read a txt file via javascript. I want to load the contents of the txt file which are separated by new line in an array. Text file: A B C I need it in the following format: arr = ["A", "B", "C"] Below is the code I tried var arr = [] fetch('file.txt') .then(function(response) { return response.text(); }).then(function(text) { arr.push(text) console.log(text) }); console.log(arr) Nothing gets added to my array, however the data from the text file gets printed on the

How to make range request for any portion of a media fragment?

由 此生再无相见时 提交于 2019-12-31 03:53:11
问题 If we wanted to make an HTTP/1.0 or HTTP/1.1 request, for example bytes 20000 to 100000 or seconds 20 through 35 seconds of a given media resource for example, .webm or .ogg audio or .mp4 video, where the response would be a discrete media fragment capable of playback without other portions of the media resource, how would we achieve this? For example let headers = new Headers(); let range = 1024 * 1024; headers.append("Range", "bytes=0-" + range); let request = new Request(url, {headers

Using fetch API with mode: 'no-cors', can’t set request headers

由 强颜欢笑 提交于 2019-12-30 04:45:10
问题 I am trying to hit a service end point and the service is a login service I am using the authentication type as basic ,The code is in react and using the fetch library however even if i set the headers field in my request I am unable to see the values of corresponding headers in my request in network tab? Following is the code : var obj = { method: 'GET' , mode : 'no-cors', headers: { 'Access-Control-Request-Headers': 'Authorization', 'Authorization': 'Basic amFzcGVyYWRtaW46amFzcGVyYWRtaW4=',

Relative paths with fetch in Javascript

由 倖福魔咒の 提交于 2019-12-30 03:50:07
问题 I was surprised by an experience with relative paths in Javascript today. I’ve boiled down the situation to the following: Suppose you have a directory structure like: app/ | +--app.html +--js/ | +--app.js +--data.json All my app.html does is run js/app.js <!DOCTYPE html> <title>app.html</title> <body> <script src=js/app.js></script> </body> app.js loads the JSON file and sticks it at the beginning of body : // js/app.js fetch('js/data.json') // <-- this path surprises me .then(response =>

Cleanest way to handle custom errors with fetch & ES6 promise

由 梦想与她 提交于 2019-12-30 03:18:08
问题 I am trying to intelligently handle the success/error responses from our API using fetch & ES6 promises. Here is how I need to handle response statuses: 204: has no json response, but need to treat as success 406: should redirect to sign in 422: has json for error message < 400 (but not 204): success, will have json >= 400 (but not 422): error, will not have json So, I am struggling with how to write this cleanly. I have some less than stellar code working right now that looks like this:

How to extend the 'Window' typescript interface

由 元气小坏坏 提交于 2019-12-30 00:52:09
问题 In my example, I'm trying to extend the TS Window interface to include a polyfill for fetch . Why doesn't matter. The question is " how do I tell TS that window.fetch is a valid function? " I'm doing this in VS Code, v.0.3.0 which is running TS v.1.5 (IIRC). Declaring the interface inside my TS class file where I want to use it doesn't work: ///<reference path="typings/tsd.d.ts"/> interface Window { fetch:(url: string, options?: {}) => Promise<any> } ... window.fetch('/blah').then(...); // TS
订阅 fetch-api