Logo

dev-resources.site

for different kinds of informations.

Browser: Fetch API Cors settings for server wildcard origin

Published at
7/20/2022
Categories
fetch
cors
errors
settings
Author
greggcbs
Categories
4 categories in total
fetch
open
cors
open
errors
open
settings
open
Author
8 person written this
greggcbs
open
Browser: Fetch API Cors settings for server wildcard origin

Cors issues are a pain, especially if your server is allowing all but fetch is still throwing errors. Here is a fix.

fetch(`http://endpoint.com`, {
  method: 'GET', // *GET, POST, PUT, DELETE, etc.
  mode: 'cors', // no-cors, *cors, same-origin
  cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
  credentials: 'omit', // include, *same-origin, omit
  headers: {
    'Content-Type': 'application/json'
  },
})
.then((res) => res.json())
.then((data)=> {
  console.log('data', data)
})
Enter fullscreen mode Exit fullscreen mode

Axios might not work in some cors situations:
In a quote from this thread:

It's important to note is that mode, credentials, and crossdomain aren't supported for configuring Axios. The reason why your example works when using fetch is because those options are part of the Request API (docs for mode are here).

Errors you may have seen when making your requests:

"Uncaught (in promise) SyntaxError: Unexpected end of input"

"Access to fetch at '...' from origin 'null' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'"

"JSON.parse: unexpected end of data at line 1 column 1 of the JSON data"
Enter fullscreen mode Exit fullscreen mode
settings Article's
30 articles in total
Favicon
How to Increase the Scrollback Buffer in VSCode Terminal
Favicon
How to Increase the Scrollback Buffer in VSCode Terminal
Favicon
iOS Settings URL's
Favicon
Enhanced Printing Experience Navigating Driver for Your New Printer
Favicon
Tidy Up Your VSCode Explorer with File Nesting
Favicon
RubyMine. How to remove trailing whitespaces
Favicon
Browser: Fetch API Cors settings for server wildcard origin
Favicon
VSCode Settings You Should Use
Favicon
Mac ᄒᅑᆫ글 카보드에ᄉα…₯ 원ᄒα…ͺα„€α…΅α„’α…©( )λ₯Ό ᄇᅒᆨ쿼트(`)둜 λ°”κΎΈλŠ” 방법
Favicon
BEST VSCode Settings for Flutter Developers πŸš€
Favicon
Format C/Cpp files automatically on VS Code
Favicon
πŸ† Default πŸ”— Maven and β˜• Java settings per project
Favicon
Configure the Prettier
Favicon
Configure the ESLint
Favicon
Designing a library for reading layered application settings in Java
Favicon
Using JSON in Angular
Favicon
Techniques to declare settings in a third party Django library
Favicon
Productive Taskbar Settings missing in Windows 11
Favicon
Understand Django: Making Sense Of Settings
Favicon
IntelliJ settings repo
Favicon
GIT Quick Course
Favicon
Fixing My Brave Browser Ads
Favicon
Share stunning Dracula Official VScode Customization
Favicon
πŸ›  Improving the Way You Configure Security Settings in the Auth0 Dashboard
Favicon
Enhance Security in Your .NET Configuration Files
Favicon
Change cursor animation in VSCODE
Favicon
Individual developer settings in ASP.NET Core
Favicon
VSCode good old colors of errors/warnings
Favicon
Introduction of Settings View for Xamarin.Forms
Favicon
Show me your .gitignore

Featured ones: