基础 url 不会根据 link 改变
Base url doesn't change based on the link
我有一个硬编码的 JSON 数据,在应用程序执行时显示,我使用 JSON-schema-faker 获取一些 mockApi 数据并在我设置查询参数 useMockApi 时显示它真实的
我希望 link 根据环境进行更改,但是当我将 useMockApi 设置为 true 时,它会给我这个错误
import { getUsers, deleteUser } from "./api/userApi.js";
getUsers().then(result => {
let userBody = "";
result.forEach(user => {
userBody += `<tr>
<td><a href="#" id="${user.id}" class="del">Delete </a></td>
<td>${user.id}</td>
<td>${user.firstName}</td>
<td>${user.lastName}</td>
<td>${user.email}</td>
</tr>`
});
global.document.getElementById('users').innerHTML = userBody;
const deleteLinks = document.querySelectorAll('.del');
Array.from(deleteLinks, link => {
link.onclick = (event) => {
const element = event.currentTarget;
event.preventDefault();
deleteUser(element.id) //eslint-disable-line no-console
const row = element.parentNode.parentNode;
row.remove();
}
})
})
无法在 'Window' 上执行 'fetch':无法从 http://localhost:5000users
解析 URL
这是我的代码
/* eslint-disable no-unused-vars */
import "whatwg-fetch";
import getBaseUrl from './baseUrl';
const baseurl = getBaseUrl();
export function getUsers() {
return get('users');
}
export function deleteUser(id) {
return del(`users/${id}`)
}
function get(url) {
return fetch(baseurl + url).then(onSuccess, onError);
}
function del(url) {
const request = new Request(`${baseurl}/${url}`, {
method: 'DELETE'
});
return fetch(request).then(onSuccess, onError)
}
function onSuccess(response) {
return response.json();
}
function onError(err) {
console.log(err); //eslint-disable-line no-console
}
export default function getBaseUrl() {
return getQueryStringParameterByName('useMockApi') ? 'http://localhost:5000' : '/';
}
function getQueryStringParameterByName(name, url) {
if (!url) {
url = window.location.href;
}
name = name.replace(/[\[\]]/g, "\$&")
var regex = new RegExp(`[?&]${name}(=([^&#]*)|&|#|$)`),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, " "))
}
尝试在 localhost:5000
后添加正斜杠
return getQueryStringParameterByName('useMockApi') ? 'http://localhost:5000/' : '/';
我有一个硬编码的 JSON 数据,在应用程序执行时显示,我使用 JSON-schema-faker 获取一些 mockApi 数据并在我设置查询参数 useMockApi 时显示它真实的 我希望 link 根据环境进行更改,但是当我将 useMockApi 设置为 true 时,它会给我这个错误
import { getUsers, deleteUser } from "./api/userApi.js";
getUsers().then(result => {
let userBody = "";
result.forEach(user => {
userBody += `<tr>
<td><a href="#" id="${user.id}" class="del">Delete </a></td>
<td>${user.id}</td>
<td>${user.firstName}</td>
<td>${user.lastName}</td>
<td>${user.email}</td>
</tr>`
});
global.document.getElementById('users').innerHTML = userBody;
const deleteLinks = document.querySelectorAll('.del');
Array.from(deleteLinks, link => {
link.onclick = (event) => {
const element = event.currentTarget;
event.preventDefault();
deleteUser(element.id) //eslint-disable-line no-console
const row = element.parentNode.parentNode;
row.remove();
}
})
})
无法在 'Window' 上执行 'fetch':无法从 http://localhost:5000users
解析 URL这是我的代码
/* eslint-disable no-unused-vars */
import "whatwg-fetch";
import getBaseUrl from './baseUrl';
const baseurl = getBaseUrl();
export function getUsers() {
return get('users');
}
export function deleteUser(id) {
return del(`users/${id}`)
}
function get(url) {
return fetch(baseurl + url).then(onSuccess, onError);
}
function del(url) {
const request = new Request(`${baseurl}/${url}`, {
method: 'DELETE'
});
return fetch(request).then(onSuccess, onError)
}
function onSuccess(response) {
return response.json();
}
function onError(err) {
console.log(err); //eslint-disable-line no-console
}
export default function getBaseUrl() {
return getQueryStringParameterByName('useMockApi') ? 'http://localhost:5000' : '/';
}
function getQueryStringParameterByName(name, url) {
if (!url) {
url = window.location.href;
}
name = name.replace(/[\[\]]/g, "\$&")
var regex = new RegExp(`[?&]${name}(=([^&#]*)|&|#|$)`),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, " "))
}
尝试在 localhost:5000
return getQueryStringParameterByName('useMockApi') ? 'http://localhost:5000/' : '/';