已解决 - 如何修复 web.config 文件中的访问控制错误? [英] SOLVED-How do I fix error with access control in web.config file?
问题描述
我收到这个错误，我不知道如何修复它.该站点是实时的，因此我不想测试很多东西，在测试中破坏它.我猜问题出在我的 web.config 文件中，它与我用来缓存文件的 service worker 相关，因为它使用了fetch".
Im getting this error and I don´t know how to fix it.The site is live so therefor I don´t want to test a lot of stuff, breaking it wile testing. I guess the problem is in my web.config file and that its related to the service worker that I use to cache files since that is using "fetch".
我得到的错误.
Fetch API cannot load https://www.google-analytics.com/j/collect?... due to access control checks.
[Error] Failed to load resource: Cannot use wildcard in Access-Control-Allow-Origin when credentials flag is true.
web.config 文件看起来像这样.
And the web.config file looks like this.
<httpProtocol>
<customHeaders>
<add name="Cache-Control" value="public, max-age=365000000" />
<!--<add name="Access-Control-Allow-Origin" value="['https://mydomain.se','http://dibspayment.eu','https://checkout.dibspayment.eu','https://www.google-analytics.com']" />-->
<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Allow-Methods" value="'HEAD,OPTIONS, GET, POST, PUT, PATCH, DELETE'" />
<add name="Access-Control-Allow-Headers" value="'X-Requested-With, Origin, Content-Type, X-Auth-Token, Accept, Authorization, Content-Length,Access-Control-Allow-Origin, Access-Control-Allow-Methods,Cache-Control'" />
</customHeaders>
</httpProtocol>
我的 service worker 看起来像这样.
My service worker looks like this.
self.addEventListener('install', function(event) {
self.skipWaiting()
event.waitUntil(
caches.open('v19').then(function(cache) {
return cache.addAll([
'/js/jquery.cookie.js',
'/js/jquery.sumoselect.min.js',
'/js/wookmark.min.js',
'/js/imagesloaded.pkgd.min.js',
'/js/exif/exif.min.js',
'/js/exif/load-image.min.js',
'/js/exif/load-image-scale.min.js',
'/js/exif/load-image-orientation.min.js',
'/fonts/Framework7Icons-Regular.woff2',
'/fonts/Framework7Icons-Regular.woff',
'/fonts/Framework7Icons-Regular.ttf',
'/fonts/Framework7Icons-Regular.eot',
]);
//caches.open(v2)
//.then( cache = cache.match('/js/v5/framework7.bundle.min.js'))
//.then( res =res.text())
//.then( js = console.log(js))
})
);
});
self.addEventListener('fetch', function(event) {
if (event.request.clone().method === 'GET') {
event.respondWith(
caches.open("v19").then(function (cache) {
return fetch(event.request).then(function (res) {
cache.put(event.request, res.clone());
return res;
})
})
)
} else if (event.request.clone().method === 'POST') {
// attempt to send request normally
event.respondWith(fetch(event.request.clone()).catch(function
(error) {
// only save post requests in browser, if an error occurs
//savePostRequests(event.request.clone().url, form_data)
}))
}
});
self.addEventListener('activate', function(event) {
var cacheKeeplist = ['v19'];
event.waitUntil(
caches.keys().then(function(keyList) {
return Promise.all(keyList.map(function(key) {
if (cacheKeeplist.indexOf(key) === -1) {
return caches.delete(key);
}
}));
})
);
});
我应该如何处理 Access-Control-Allow-Origin?我想这就是问题所在，或者?任何输入都非常感谢，谢谢.
How should I do with the Access-Control-Allow-Origin? I guess that´s where the problem is, or? Any input really appreciated, thanks.
解决办法:好的，所以我把它改成这样，这样它就不会缓存 google.analytis 并且错误消失了.
Solution: Ok so I changed it to this so it is not caching google.analytis and the error went away.
self.addEventListener('fetch', function(event) {
if (( event.request.url.indexOf( 'analytics' ) !== -1 ) || ( event.request.url.indexOf( 'checkout' ) !== -1 )){
}else{
if (event.request.clone().method === 'GET') {
event.respondWith(
caches.open("v19").then(function (cache) {
return fetch(event.request).then(function (res) {
cache.put(event.request, res.clone());
return res;
})
})
)
} else if (event.request.clone().method === 'POST') {
// attempt to send request normally
event.respondWith(fetch(event.request.clone()).catch(function
(error) {
// only save post requests in browser, if an error occurs
//savePostRequests(event.request.clone().url, form_data)
}))
}
}
});
推荐答案
这不是您的 web.config 的问题，而是 Google Analytics (GA) 服务器的问题.因此，您必须调整请求以满足 GA 要求.
It's not the issue with yours web.config, but Google Analytics (GA) server's. So you have to adjust requests to meet GA requirements.
GA 响应不希望被缓存(绿色下划线).统计信息的所有传输都在发送请求中完成，答案只是发送确认(文本如1gfr).
GA 不接受带有凭据(红色下划线)的请求，因为: - 表示通配符 * in Access-Control-Allow-Origin 响应头 - 缺少 Access-Control-Allow-Credentials: true 在响应头中
GA do not accept requests with credentials (underlined in red) because of:
- presents of wildcard * in Access-Control-Allow-Origin response header
- absent of Access-Control-Allow-Credentials: true in responce header
因此，GA 等待没有凭据的跨域请求(不应发送任何身份验证 cookie).feth() 使用 mode: 'cors', credentials: 'same-origin' by 默认(仅向同源请求发送凭据)，因此一切都应该没问题.
Hence GA wait cross-origin requests with no credentials (no auth cookies should not be sent). The feth() uses mode: 'cors', credentials: 'same-origin' by default (send credentials only to same-origin requests), therefore all should be OK.
但如果您仍然收到上述 CORS 错误，则表示某些浏览器发送了凭据.尝试将 Request.credentials 设置为 omit" 作为 由 Mozilla 推荐.
But if you still have got CORS error above, it means some browsers send credentials. Try to set Request.credentials to "omit" as recommended by Mozilla.
或者可以从缓存中排除 GA 并让处理 GA 请求本机方式(GA 本机使用 XMLHttpRequest 和 withCredentials = false 选项，而不是 fetch()).
Or may be it's possible to exclude GA from caching and let process GA requests native way (GA natively use XMLHttpRequest with withCredentials = false option, not fetch()).
这篇关于已解决 - 如何修复 web.config 文件中的访问控制错误?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
