score:1
Accepted answer
in your next.config.js
.
i18n: {
localedetection: false,
}
this solves a problem for me.
score:1
this solved my problem, hope it solves yours.
- use next
userouter
to get the current active language:
import { userouter } from "next/router";
const router = userouter();
const active_language = router.locale;
- use
window
object to get the current full url of your app:
const window_url = window.location.href;
note: next.js executes code first server-side, then client-side (which includes the window
object). there are many ways to achieve this, if you get "window is not defined" read this article.
- set your api url based on the current active language,
assuming your default language is "en" :
let api_url = "";
if(active_language === "en") {
api_url = `${window_url.substr(0, window_url.lastindexof("/"))}/`;
console.log(window_url) // http://localhost:3000/shop
console.log(api_url) // http://localhost:3000/
};
and your secondary language is "ar":
if(active_language === "ar") {
api_url = window_url.substr(0, window_url.lastindexof("/") - 2);
console.log(window_url) // http://localhost:3000/ar/shop
console.log(api_url) // http://localhost:3000/
};
- now your api url is set to the same url even if you switch the locale language:
fetch(`${api_url}/api/hello`);
Source: stackoverflow.com
Related Query
- how to remove the /[lang tag] from url using nextjs?
- How to remove the static/index.html from URL while using React's HashRouter?
- How do I remove the .html from the end of URL while using SiteGround
- How to remove the hash from the url in react-router
- How to remove suffix slash "/" from the assets url in webpack | Gatsby
- React Tag Autocomplete: How to remove the selected tag from suggestions
- How can I get token from the URL in Nextjs / React App?
- How to remove anchor tag from URL in React
- How to update the global state using redux and remove an item from the global state
- How can I remove markers from the map using the checkboxes on the left?
- How to remove port from url for node application using nginx
- How can I decouple the UI from the URL using react-router?
- How to remove duplicate slashes from URL in Next Js.How to intercept and modify a request on the server side getServerSideProps?
- How to restrict user from accessing a particular page by typing the url using react and typescript?
- How do you pass data from one view to the other via react-router-dom without using url parameters?
- How can I turn the data that is a image came from API to url to use in img tag in react Js
- How to save the input from user given using html input tag to a array in "state" in React JS
- how to remove the dotted line from an anchor tag or Link tag in react?
- How to redirect to home page from custom 404 page with locale in the url nextjs
- How to remove margin or padding added to the top of page from using bootstrap 4.4.1 when printing using window.print and selecting thinner paper size?
- How to remove # from url using createHashHistory from history
- how to compare the query value from url to id using react?
- How can I remove the underline of TextField from Material-UI?
- How can I remove unused imports/declarations from the entire project of React Typescript?
- How can remove console.log in the production build of a React application created using create-react-app?
- How can I get the URL address from the browser in ReactJS (servers URL)
- How can I develop locally using a domain name instead of 'localhost:3000' in the url with create-react-app?
- How to display 404 when URL doesn't match any route and when the URL contains /#/ using ReactJS
- How to pass the match when using render in Route component from react router (v4)
- How to fix the console warning "The resource ... was preloaded using link preload but not used within a few seconds from the window's load event"?
More Query from same tag
- Send post request on Google API using javascript on browser
- How do I call a reducer with a slightly-updated prop value?
- Can react hooks completely replace redux?
- How do I use SVGs for background images on buttons in React
- Different behavior in passing the same props in 2 components in ReactJS
- Semantic-ui react modal shorthand prevent button closing modal
- Disable an image element after first click on toggle, then re-enable it using setTimeout in react hooks
- convert react js files to tsx files
- I don't understand && in this JavaScript (JSX) Syntax
- state updates on event handler
- making an image within a card fill in the space
- What should be a project structure for React + Node.js?
- filter array of objects not returning filtered values
- How to get first child to work with JSS-Nested
- Enzyme's simulate() not changing output for onChange event
- React homepage attribute not working
- Parsing Django DateTimeField in Javascript
- How can I implement in styled components and interpolations with emotion theming?
- React useContext not causing a rerender
- how to get/set component size dynamically
- react-redux store mapping issue between components
- React - Module parse failed: Unexpected Token. You may need an appropriate loader to handle this file type
- Pass value from child to parent without onChange react
- React doesn't propagate events to inner components
- How to display input box value from addImg.js (child component) to app.js (parent component) in react
- Why can't I return an object in React
- useReducer not accepting array or state
- seemingly equal objects are not equal
- How to add types to the own props of the component next to those of the theme?
- React settimeout function causing page to refresh repeatedly