2017-02-03 5 views
0
выборки

мой вопрос заключается в следующем У меня есть код:Как использовать API с яваскрипт и функции

const url = 'http://localhost:8080/users/[count]'; 
fetch(url) 
.then((resp) => resp.json()) 
.then(function(data) { 

for (i=o;i<data.length;i++) { 
document.getElementById("Result").innerHTML = `<p>${data[i].name} ${data[i].username}</p>` 
}; 


}) 
.catch(function(error) { 
console.log(JSON.stringify(error)); 
}); 

, что в теории должно захватить информацию в адрес HTTP: // локальный: 8080/пользователи/[число ] и укажите мне имя и имя, указанные в этом адресе. Адрес имеет следующее:

[{"name":"Marisa Koss","username":"Adolfo.Klein","email":"[email protected]","address":{"street":"Nils Mills","suite":"Apt. 415","city":"South Cortney","zipcode":"96235-6649","geo":{"lat":"-6.3807","lng":"-19.6170"}},"phone":"1-212-309-5985 x3453","website":"dovie.com","company":{"name":"Muller, Monahan and Stracke","catchPhrase":"Managed real-time matrices","bs":"rich maximize portals"}},{"name":"Ole Kulas","username":"Lesly.Walter","email":"[email protected]","address":{"street":"White Isle","suite":"Suite 966","city":"Hermannland","zipcode":"13688","geo":{"lat":"-85.1722","lng":"133.7227"}},"phone":"1-161-247-6455 x898","website":"gina.name","company":{"name":"Rodriguez - Botsford","catchPhrase":"Extended leading edge ability","bs":"wireless evolve web-readiness"}},{"name":"Baylee Boehm","username":"Maximillia37","email":"[email protected]","address":{"street":"Laisha Turnpike","suite":"Suite 277","city":"Cesartown","zipcode":"43786-5148","geo":{"lat":"3.6440","lng":"153.8556"}},"phone":"(027) 633-4660 x01161","website":"amari.org","company":{"name":"Wiegand and Sons","catchPhrase":"Advanced high-level open architecture","bs":"viral productize methodologies"}},{"name":"Chanelle Kub Jr.","username":"Mac.Stoltenberg10","email":"[email protected]","address":{"street":"Cecilia Harbor","suite":"Suite 605","city":"East Deonte","zipcode":"11840-8930","geo":{"lat":"-18.2002","lng":"105.6944"}},"phone":"071-752-1969 x96946","website":"tristin.info","company":{"name":"Corwin - Champlin","catchPhrase":"Balanced bi-directional collaboration","bs":"sticky embrace interfaces"}},{"name":"Vickie Wisozk","username":"Ladarius.Conroy98","email":"[email protected]","address":{"street":"Cheyenne Village","suite":"Suite 849","city":"Farrellstad","zipcode":"67187","geo":{"lat":"4.3229","lng":"-125.2004"}},"phone":"1-247-291-1942 x5040","website":"doris.com","company":{"name":"Larson, Cormier and Stoltenberg","catchPhrase":"Profound discrete leverage","bs":"integrated benchmark ROI"}},{"name":"Laury Nader","username":"Eulalia62","email":"[email protected]","address":{"street":"Parker Junction","suite":"Apt. 389","city":"New Gabe","zipcode":"00367","geo":{"lat":"37.2142","lng":"79.3023"}},"phone":"(822) 093-1471 x9308","website":"junior.biz","company":{"name":"Hodkiewicz, Sporer and McClure","catchPhrase":"Inverse zero tolerance product","bs":"distributed generate solutions"}},{"name":"Laron Walker","username":"Rosalinda38","email":"[email protected]","address":{"street":"Rodriguez Knoll","suite":"Suite 488","city":"New Zakaryhaven","zipcode":"24722","geo":{"lat":"-0.9863","lng":"63.8521"}},"phone":"229-380-2044 x086","website":"jaden.biz","company":{"name":"Klein Group","catchPhrase":"Balanced foreground moderator","bs":"user-centric redefine e-markets"}},{"name":"Antonia Wilkinson","username":"Verdie.Casper","email":"[email protected]","address":{"street":"Kuphal Harbor","suite":"Suite 661","city":"East Gregfurt","zipcode":"91590-9271","geo":{"lat":"-87.7308","lng":"25.9781"}},"phone":"307-166-2617","website":"marques.org","company":{"name":"Treutel LLC","catchPhrase":"Public-key discrete project","bs":"24/365 transform infomediaries"}},{"name":"Mr. Mateo Gottlieb","username":"Marina0","email":"[email protected]","address":{"street":"Connelly Throughway","suite":"Apt. 439","city":"Deionfort","zipcode":"49258","geo":{"lat":"-39.2334","lng":"177.2928"}},"phone":"763-148-7666 x4871","website":"roel.net","company":{"name":"Torp - Senger","catchPhrase":"Optional responsive complexity","bs":"viral strategize portals"}},{"name":"Hermann Wolff","username":"Mckayla.Anderson","email":"[email protected]","address":{"street":"Justen Courts","suite":"Suite 217","city":"Lake Jovanburgh","zipcode":"52134-2599","geo":{"lat":"17.1201","lng":"106.4603"}},"phone":"650-449-3725 x0901","website":"heloise.net","company":{"name":"Marvin and Sons","catchPhrase":"Distributed didactic forecast","bs":"bleeding-edge reintermediate action-items"}}] 

Не могли бы вы сказать мне, что моя ошибка есть, или то, что я должен сделать, чтобы получить нужные мне данные

Когда я проверяю Dev Tools из хрома, чтобы увидеть I ошибки получите следующее

Fetch API не может загрузить http://localhost:8080/users/[count]. В запрошенном ресурсе нет заголовка «Access-Control-Allow-Origin». Origin 'http://localhost:3000', следовательно, не допускается. Если непрозрачный ответ отвечает вашим потребностям, установите режим запроса «no-cors» для извлечения ресурса с отключенным CORS.

+0

Вы 'для (я = о, я

+3

http://stackoverflow.com/questions/20035101/no-access-control-allow-origin-header-is-present-on-the-requested- ресурс –

+0

, вероятно, проблема CORS, так как это именно то, что говорит вам ошибка ... и, кстати, установка 'no-cors' гарантирует, что вы ** НЕ ** получите доступ к ответу ... единственное решение для включения CORS на сервере –

ответ