Sur*_*thi 5 aurelia-http-client
当我使用aurelia-fetch-client将json数据发布到服务器时，出现此错误“ TypeError：尝试获取资源时出现NetworkError”。我认为您的回答对我非常有用。
post.html
<template>
<section>
<form role="form" submit.trigger="signup()">
<div class="form-group">
<label for="OrganisationId">OrganisationId</label>
<input type="text" value.bind="organisationId" placeholder="OrganisationId">
</div>
<div >
<label for="OrganisationName">OrganisationName</label>
<input type="OrganisationName" value.bind="organisationName" placeholder="Password">
</div>
<button type="submit" class="btn btn-default">Enter</button>
</form>
</section>
</template>
post.js
import 'fetch';
import { HttpClient, json } from 'aurelia-fetch-client';
let httpClient = new HttpClient();
export class signup {
heading1 = "Welome to User";
organisationId = "";
organisationName = "";
signup() {
alert("calliong");
var myUser1 = { organisationId: this.organisationId, organisationName: this.organisationName }
console.log(myUser1);
httpClient.fetch('http://172.16.0.26:8085/employee-management/rest/employees/addOrganisations', {
method: "POST",
body: JSON.stringify(myUser1)
})
.then(response => response.json())
.then(data => {
console.log(data);
});
}
}
小智 22
我想我有点晚了。但我开始知道除了 cors() 之外的一种不同的解决方法。除此之外，我正在使用cors，但我遇到了同样的问题。我通过添加submitForm()方法解决了这个问题e.preventDefault();。
小智 14
这可能与跨域资源共享（CORS）有关。
跨域资源共享 (CORS) 机制为 Web 服务器提供跨域访问控制，从而实现安全的跨域数据传输。现代浏览器在 API 容器（例如 XMLHttpRequest 或 Fetch）中使用 CORS 来降低跨源 HTTP 请求的风险。（来源：https : //developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS
如果您有 Chrome，您可以尝试使用运行在 Windows 中的命令：chrome.exe --user-data-dir="C:/Chrome dev session" --disable-web-security并查看您是否可以在该环境中运行您的代码。这将允许访问没有 'access-control-allow-origin' 标头请求。
我尝试在 Chrome、Firefox 和 Edge 中正常运行您的部分代码，但遇到了相同的 CORS 错误。但是，当我使用上述命令时，它确实运行了。您没有提供太多信息，但您可能需要对服务器端和代码进行一些更改。
上面的命令和更多关于 CORS 的好信息可以在这里找到 SO：“请求的资源上不存在‘访问控制-允许-原点’标头”
希望这至少可以为您指明正确的方向。
小智 7
在我的例子中，这是一个 CORS 问题，POST 请求被阻止，因为服务器没有在允许的标头请求标头中列出所有需要的标头。在服务器上将“Access-Control-Allow-Headers”设置为“*”就可以了。
我的感觉是可能和CORS没有关系。它可能需要处理“导入”机制（？）这是我的情况：当我刚刚将 OpenLayers 的本地版本更新到 v5.0.0 时，我收到了“源映射错误”消息。这是我的 html：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Lignes SNCF</title>
<link rel="stylesheet" href="sncf.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/openlayers/5.0.0/ol.css">
<link rel="preload" href="Gares.json">
<link rel="preload" href="communes.geojson">
<script src="../../../ENSEIGNEMENT/v5.0.0-dist/ol.js"></script>
</head>
<body>
<h1>Lignes SNCF</h1>
<div id="canvasMap" class="map"><div id="popup"></div></div>
<script src="./sncfV5.js"></script>
</body>
</html>
和错误信息：
Source map error: TypeError: NetworkError when attempting to fetch resource.
Resource URL: file:///E:/ENSEIGNEMENT/v5.0.0-dist/ol.js
Source Map URL: ol.js.map[Learn More]
令人费解的是，JavaScript 代码工作正常，地图正确显示在屏幕上，甚至在控制台上显示“源地图错误”消息之前。
如果我回到以前版本的 OpenLayers，唯一的区别是：
<script src="../../../ENSEIGNEMENT/v4.6.5-dist/ol.js"></script>
它也可以工作，但没有错误消息。
我不知道该怪什么……但 Openlayers 5 是第一个旨在与“导入……从‘ol’”一起使用的版本。我还没有尝试过的（其他问题），我还在使用：
const map = new ol.Map(...);
代替：
import Map from 'ol.Map.js';
const map = new Map(...);
我不知道该怪什么，但“Suresh”的原始问题也与“导入”机制有关。我的情况是我看不到 CORS 的意义。